refactor(apps): remove realtime-audio for 11Labs & prompt engineering
This commit is contained in:
Neko Ayaka
@@ -1,13 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
|
||||
<title>ReLU Prompt Engineering Playground</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,32 +0,0 @@
|
||||
{
|
||||
"name": "@proj-airi/playground-prompt-engineering",
|
||||
"type": "module",
|
||||
"version": "0.7.2-beta.3",
|
||||
"private": true,
|
||||
"description": "Prompt Engineering Playground for AI Characters",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vue-tsc && vite build",
|
||||
"preview": "vite preview",
|
||||
"typecheck": "vue-tsc --noEmit"
|
||||
},
|
||||
"dependencies": {
|
||||
"@velin-dev/core": "^0.3.1",
|
||||
"@velin-dev/vue": "^0.3.1",
|
||||
"pinia": "^3.0.3",
|
||||
"vue": "^3.5.22"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@iconify/vue": "^5.0.0",
|
||||
"@unocss/reset": "^66.5.2",
|
||||
"@vitejs/plugin-vue": "^6.0.1",
|
||||
"typescript": "~5.9.2",
|
||||
"unocss": "^66.5.2",
|
||||
"unplugin-vue-macros": "^2.14.5",
|
||||
"unplugin-vue-router": "^0.15.0",
|
||||
"vite": "catalog:rolldown-vite",
|
||||
"vite-plugin-vue-devtools": "^8.0.2",
|
||||
"vite-plugin-vue-layouts": "^0.11.0",
|
||||
"vue-tsc": "^3.0.8"
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
@@ -1,61 +0,0 @@
|
||||
<svg width="1500" height="1500" viewBox="0 0 1500 1500" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2718_972)">
|
||||
<path d="M442.5 953.5L669 697L1080 927L985.5 1134.5L669 1104.5L442.5 953.5Z" fill="white"/>
|
||||
<path d="M985.5 727L1034.5 602.5L1121.5 629L1166.5 844L985.5 727Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1540.03 1958.88C1518.27 1990.95 1454.98 2031.91 1419.76 2052.52C1403.15 2062.26 1385.11 2059.4 1360.48 2063.41C1254.24 2080.59 1148.57 2057.97 1062.08 2032.19C1041.18 2025.89 989.344 1986.37 967.008 1994.68C934.934 2009 939.516 2047.66 923.193 2077.44C912.311 2100.35 883.674 2183.68 874.797 2202.3C852.174 2249.83 823.823 2298.8 796.618 2342.9C775.713 2376.98 722.162 2440.55 662.311 2407.05C634.247 2391.3 635.679 2369.53 631.383 2346.91C631.097 2346.05 631.097 2333.74 630.238 2333.74C627.088 2333.74 627.088 2333.74 623.365 2333.74C616.11 2342.52 608.76 2351.3 601.315 2360.08C559.791 2398.17 497.363 2389.01 482.758 2332.02C473.021 2294.51 491.062 2256.71 501.372 2232.08C520.654 2172.7 539.936 2113.33 559.218 2053.96C569.528 2004.7 546.045 1964.61 532.586 1932.25C507.385 1870.39 500.226 1796.8 474.739 1733.8C464.144 1707.16 443.811 1693.42 435.793 1674.52C426.343 1651.89 405.438 1559.11 388.829 1551.09C335.564 1527.04 321.246 1607.22 290.604 1618.1C228.176 1640.44 200.971 1552.52 196.961 1507.28C145.129 1490.1 106.183 1412.2 131.097 1340.32C153.147 1277.61 199.539 1232.36 287.454 1234.08C295.186 1224.35 307.214 1219.48 315.518 1210.6L332.7 1141.87C341.673 1125.26 350.551 1108.56 359.333 1091.76C371.647 1073.72 393.983 1050.81 412.311 1038.78C422.811 1033.62 433.216 1028.37 443.525 1023.03C437.798 1021.69 432.643 1020.07 428.061 1018.16C398.852 1005.27 393.983 980.359 373.365 956.017C371.36 961.172 348.451 999.545 335.85 1010.71C331.65 1008.04 327.45 1005.37 323.25 1002.7C315.805 990.954 315.518 909.053 309.218 884.139C259.104 683.108 276.572 507.563 421.761 407.621C433.216 399.889 441.234 376.407 445.243 370.106C472.735 350.824 500.322 331.542 528.004 312.26C557.786 297.655 598.737 295.364 641.979 289.064C658.588 288.491 675.293 287.918 692.093 287.346C818.955 286.2 964.717 357.22 1037.17 415.353C1053.78 436.735 1070.48 458.117 1087.28 479.499C1121.36 525.032 1159.45 565.983 1190.38 615.525C1219.59 662.489 1281.73 738.377 1280.87 801.378C1249.56 767.396 1218.34 733.509 1187.23 699.717C1195.82 736.086 1215.29 743.531 1229.32 769.305C1233.62 777.323 1239.34 786.773 1245.07 791.928C1252.52 796.701 1260.06 801.569 1267.7 806.533C1285.64 817.797 1303.59 829.06 1321.53 840.324C1379.38 882.993 1437.23 942.844 1477.6 1002.7C1548.05 1107.22 1598.74 1224.35 1630.81 1368.39C1677.78 1579.44 1628.23 1830.3 1540.03 1958.88ZM1048.05 716.899C1071.82 724.345 1106.18 762.146 1133.96 754.414C1133.96 754.414 1103.89 725.204 1090.43 710.599C1080.41 697.14 1079.55 686.258 1067.24 666.212L1059.79 657.048C1055.5 674.803 1040.6 702.294 1048.05 716.899ZM1005.95 984.081C1005.09 982.65 995.358 998.4 994.786 997.541C987.34 987.518 983.044 988.091 971.303 979.786C961.853 968.331 957.558 943.99 948.107 932.535C926.916 935.399 896.275 1010.14 879.379 1027.9C878.424 1027.32 877.374 1026.75 876.229 1026.18C863.056 978.641 766.549 821.138 732.471 801.378C706.507 796.605 680.543 791.928 654.579 787.346C629.665 814.551 618.21 854.643 592.151 880.989C565.518 907.621 530.009 925.09 504.522 952.867V965.181C513.399 978.354 527.718 981.218 542.036 988.663C561.891 998.018 581.651 1007.37 601.315 1016.73C607.328 1018.16 613.628 1018.45 619.642 1017.87C630.524 1017.01 641.12 1014.15 648.279 1012.15C680.066 1003.27 717.58 1011.57 746.79 1018.45C767.122 1023.31 778.577 1037.35 793.468 1046.51C821.532 1063.98 850.742 1069.71 876.229 1088.61C879.474 1092.81 882.624 1097.01 885.679 1101.21C913.743 1112.09 1004.52 1012.43 1005.95 984.081Z" fill="#F1D0DB"/>
|
||||
<path d="M534.877 418.215L635.965 159.91C635.965 159.91 712.712 199.715 801.773 395.305L534.877 418.215Z" fill="#F1D0DB"/>
|
||||
<path d="M197.82 483.511C197.82 483.511 265.117 459.17 335.277 475.493C405.724 491.816 279.722 635.86 279.722 635.86C279.722 635.86 184.934 508.139 197.82 483.511Z" fill="#F1D0DB"/>
|
||||
<path d="M531.154 378.41C531.154 378.41 528.863 423.084 540.89 424.229L636.251 160.197C636.251 159.911 635.965 159.911 635.965 160.197C513.685 382.706 535.736 351.492 531.154 378.41Z" fill="#EC92AD"/>
|
||||
<path d="M789.745 380.417C774.854 371.253 756.813 319.42 755.667 315.411C746.503 282.192 724.453 255.846 678.92 206.591C655.724 181.39 635.106 161.058 635.965 159.913C636.824 159.053 655.438 173.945 666.034 182.822C690.948 203.441 713.857 226.064 742.208 261.574C794.327 326.293 806.354 373.83 816.377 389.294C816.664 389.867 818.096 392.158 817.236 393.017C816.091 394.449 809.505 391.012 801.773 387.003C796.332 384.139 791.177 381.276 789.745 380.417Z" fill="#EC92AD"/>
|
||||
<path d="M566.95 414.495C564.373 412.777 576.973 386.717 596.446 356.935C612.483 332.307 614.201 334.311 629.092 309.97C637.397 296.797 644.843 283.624 646.561 284.483C647.706 284.77 646.274 289.065 645.129 295.079C639.115 324.289 646.847 338.893 643.983 359.798C643.983 360.944 643.411 364.38 644.556 364.667C645.702 365.239 648.852 359.798 652.002 355.216C655.152 350.921 660.306 346.339 670.329 337.461C690.089 319.707 692.093 320.279 692.953 320.852C694.671 321.998 692.666 325.72 692.953 339.466C692.953 340.612 692.953 351.207 697.534 359.798C698.107 360.657 698.966 362.089 700.398 362.948C702.403 364.094 705.266 364.38 712.139 361.23C722.448 356.362 723.88 351.494 727.317 352.353C730.181 353.212 729.608 356.935 734.762 366.385C738.485 373.544 751.085 375.549 749.94 377.84C748.508 380.703 731.612 381.562 729.894 381.849C670.329 391.585 601.887 408.767 582.987 410.486C581.555 410.772 577.832 411.058 573.25 412.49C568.668 413.922 567.523 415.068 566.95 414.495Z" fill="#EC92AD"/>
|
||||
<path d="M280.581 628.703C283.158 630.994 281.44 639.585 278.576 640.444C276.572 641.017 272.849 638.726 260.821 618.68C248.221 597.775 242.78 590.902 231.039 568.852C220.443 548.233 214.43 534.201 210.707 529.047C210.707 529.047 200.684 512.437 195.243 494.682C194.384 491.819 194.098 488.669 194.098 488.669C194.098 486.378 193.811 483.8 194.384 482.941C196.388 480.364 233.616 498.691 267.981 522.746C277.431 529.619 298.909 545.37 305.495 546.515C305.781 546.801 306.641 546.802 307.213 547.661C309.504 550.524 300.34 556.824 297.19 566.275C289.745 586.893 289.745 605.221 287.167 610.375C283.731 616.962 281.44 621.257 280.581 621.257C279.722 621.257 279.435 606.653 279.435 606.653C279.435 606.653 268.84 608.944 267.408 606.939C263.971 601.498 285.736 584.889 282.586 579.448C280.295 575.438 265.976 580.879 264.831 578.016C263.112 574.579 281.726 568.279 281.726 559.115C281.726 546.515 245.644 540.788 227.316 521.315C226.743 520.456 225.598 519.31 224.739 519.596C221.303 521.315 244.785 573.72 255.667 595.484C267.408 618.394 269.126 614.957 273.994 622.689C274.567 623.548 275.713 625.553 278.004 627.271C279.435 628.13 280.008 628.13 280.581 628.703Z" fill="#EC92AD"/>
|
||||
<path d="M1540.03 1958.88C1518.27 1990.95 1454.98 2031.9 1419.76 2052.52C1403.15 2062.26 1385.11 2059.39 1360.48 2063.4C1254.24 2080.58 1148.57 2057.96 1062.08 2032.19C1041.18 2025.89 989.344 1986.37 967.008 1994.67C934.934 2008.99 939.516 2047.65 923.193 2077.43C912.311 2100.34 883.674 2183.68 874.797 2202.29C852.174 2249.83 823.823 2298.8 796.618 2342.9C775.713 2376.98 722.162 2440.55 662.311 2407.05C634.247 2391.3 635.679 2369.53 631.383 2346.91C631.097 2346.05 631.097 2333.74 630.238 2333.74C627.088 2333.74 627.088 2333.74 623.365 2333.74C616.11 2342.52 608.76 2351.3 601.315 2360.08C559.791 2398.17 497.363 2389 482.758 2332.02C473.021 2294.5 491.062 2256.7 501.372 2232.07C520.654 2172.7 539.936 2113.33 559.218 2053.95C569.528 2004.7 546.045 1964.61 532.586 1932.25C507.385 1870.39 500.226 1796.79 474.739 1733.79C464.144 1707.16 443.811 1693.41 435.793 1674.51C426.343 1651.89 405.438 1559.11 388.829 1551.09C335.564 1527.03 321.246 1607.22 290.604 1618.1C228.176 1640.44 200.971 1552.52 196.961 1507.27C145.129 1490.09 106.183 1412.2 131.097 1340.32C153.147 1277.61 199.539 1232.36 287.454 1234.08C295.186 1224.34 307.214 1219.47 315.518 1210.6L332.7 1141.87C341.673 1125.26 350.551 1108.55 359.333 1091.75C371.647 1073.71 393.983 1050.8 412.311 1038.77C422.811 1033.62 433.216 1028.37 443.525 1023.02C437.798 1021.69 432.643 1020.07 428.061 1018.16C438.943 1015.01 448.68 1014.15 456.698 1014.15C497.076 1013.86 513.399 1036.77 557.786 1035.34C577.832 1034.48 577.832 1029.61 619.642 1017.87C682.643 1000.11 714.144 991.237 746.217 998.969C783.445 1007.85 777.431 1027.03 841.865 1056.24C875.656 1071.42 899.711 1082.02 925.484 1073.14C950.685 1064.26 968.726 1040.21 975.599 1031.04C985.908 1017.01 991.349 1004.7 993.067 1000.97C993.067 1000.97 996.217 994.101 1003.66 980.642C1015.4 959.737 1037.45 923.941 1074.68 874.399C1114.2 822.566 1204.41 809.107 1267.7 806.529C1285.64 817.793 1303.59 829.057 1321.53 840.321C1379.38 882.99 1437.23 942.841 1477.6 1002.69C1548.05 1107.22 1598.74 1224.34 1630.81 1368.39C1677.78 1579.44 1628.23 1830.3 1540.03 1958.88Z" fill="url(#paint0_linear_2718_972)"/>
|
||||
<path d="M402.861 438.549C404.579 468.618 379.665 549.946 374.797 567.988C373.651 568.274 372.219 568.56 370.501 568.847C366.778 569.133 363.056 568.274 359.906 565.983L359.333 565.697C352.746 518.159 378.52 470.336 402.861 438.549Z" fill="#EC92AD"/>
|
||||
<path d="M339.574 488.086C332.987 507.559 322.392 530.469 315.805 549.942C315.423 550.514 315.232 551.183 315.232 551.946C304.064 604.638 301.2 731.213 312.369 785.337C325.351 839.938 338.333 894.539 351.315 949.14C358.761 990.664 306.355 1080.3 284.018 1085.17C284.591 1084.31 287.455 1071.42 290.032 1060.82C291.368 1054.91 292.227 1048.99 292.609 1043.07C295.091 1005.46 297.478 967.849 299.769 930.24C300.914 915.921 299.482 901.603 296.046 887.571C287.836 854.543 279.723 821.515 271.704 788.487C257.672 716.036 278.864 597.479 299.769 546.219C308.073 525.887 338.715 488.086 339.574 488.086Z" fill="#EC92AD"/>
|
||||
<path d="M576.114 529.043C626.228 550.521 648.565 618.104 679.207 660.2C716.148 710.887 757.385 762.434 788.6 817.989C792.895 830.589 828.119 899.318 841.864 921.082C875.083 977.783 907.443 1088.89 907.443 1174.23C906.297 1173.66 816.377 968.047 815.232 968.047C820.386 1070.57 800.054 1107.22 800.054 1106.08C784.59 1036.49 782.013 973.774 760.535 921.082C705.266 785.63 650.57 646.741 576.114 529.043Z" fill="#EC92AD"/>
|
||||
<path d="M365.346 604.062C379.665 618.667 383.674 682.241 390.261 707.155C400.761 742.092 411.165 776.934 421.475 811.68C441.807 858.358 476.744 885.85 474.739 945.987C473.212 945.987 471.589 945.987 469.871 945.987C386.824 913.914 351.314 728.06 365.346 604.062Z" fill="#EC92AD"/>
|
||||
<path d="M1042.9 808.247C1042.32 854.925 992.495 949.427 971.876 983.791C968.44 984.364 934.362 971.763 931.212 960.309C928.348 949.14 987.054 802.233 994.786 795.646C1009.1 800.515 1025.71 807.101 1042.9 808.247Z" fill="#EC92AD"/>
|
||||
<path d="M1320.39 1447.71C1244.21 1448.28 1146.85 1396.45 1093.01 1365.23C1091.01 1364.09 1089.86 1361.51 1090.72 1359.22C1091.29 1356.93 1092.15 1354.64 1092.72 1352.63C1093.58 1350.34 1095.59 1349.2 1097.88 1349.2C1132.82 1350.63 1145.42 1371.25 1169.18 1381.84C1208.42 1399.6 1265.12 1417.64 1316.95 1419.36C1319.81 1419.36 1322.39 1417.07 1322.39 1413.92C1322.96 1338.32 1314.66 1270.73 1293.75 1219.47C1293.56 1219.28 1293.47 1219.09 1293.47 1218.9C1292.04 1212.6 1288.31 1206.59 1286.6 1200.29C1286.6 1199.71 1286.02 1198.85 1285.45 1198.28C1281.44 1193.99 1274.57 1194.27 1270.85 1188.26C1267.12 1182.24 1294.04 1155.33 1297.76 1137.57C1311.51 1071.42 1246.22 968.899 1208.42 935.394C1203.83 936.826 1202.69 937.399 1198.11 938.831C1195.24 956.299 1185.51 962.027 1177.2 974.341C1144.84 1020.73 1128.23 1072.28 1049.77 1072.57C1047.76 1072.57 1046.33 1074.57 1044.9 1076.29C1022.28 1106.64 994.785 1132.99 973.88 1153.89C920.616 1207.44 839.001 1343.47 764.831 1361.51C712.712 1374.4 647.993 1358.07 584.992 1367.81C551.773 1372.97 421.188 1389.29 392.552 1383.56C389.974 1382.99 388.256 1380.41 388.542 1377.83C388.829 1372.97 386.824 1369.53 392.552 1366.67C416.32 1360.94 437.511 1370.68 458.416 1366.38C489.153 1359.51 519.89 1352.73 550.627 1346.05C550.627 1346.05 550.723 1346.05 550.914 1346.05C633.101 1332.3 708.13 1339.17 783.731 1324.86C785.45 1324.57 793.468 1316.55 794.614 1315.12C818.669 1291.92 830.696 1278.46 847.305 1261C871.074 1236.08 896.275 1212.03 917.752 1185.11C946.676 1149.31 968.153 1128.69 1016.55 1075.14C1019.7 1071.71 1021.42 1069.99 1021.13 1067.98C1021.13 1066.27 1021.13 1063.97 1017.69 1062.26C982.472 1044.21 1000.51 990.95 1011.39 960.308C1025.71 920.217 1117.92 849.197 1181.78 863.229C1267.98 882.703 1306.35 937.685 1330.12 1021.02C1335.85 1040.78 1347.02 1070.85 1341.29 1098.91C1341.1 1099.1 1341.01 1099.29 1341.01 1099.48C1336.42 1111.51 1334.42 1128.69 1329.84 1140.43C1329.84 1140.63 1329.84 1140.72 1329.84 1140.72C1323.82 1162.77 1321.25 1178.24 1305.5 1191.69C1303.49 1193.41 1302.92 1196.28 1304.35 1198.28C1335.85 1252.98 1349.31 1322.57 1351.89 1402.18C1353.61 1446.56 1349.88 1510.71 1357.61 1547.94C1357.9 1549.66 1359.33 1551.09 1360.76 1551.66C1426.63 1580.3 1593.87 1723.48 1613.34 1789.92C1613.53 1790.87 1613.53 1791.73 1613.34 1792.5C1608.76 1811.97 1602.17 1830.3 1595.59 1848.05C1595.4 1848.62 1595.01 1849.2 1594.44 1849.77C1549.77 1898.74 1458.99 1955.73 1360.76 1912.49C1304.92 1887.86 1267.41 1854.35 1229.61 1809.68C1203.83 1779.32 1178.63 1744.96 1153.72 1713.17C1112.2 1660.48 1078.98 1602.92 1039.75 1547.36C1022.56 1523.31 1006.53 1495.25 988.199 1471.19C988.199 1471 988.104 1470.81 987.913 1470.62C975.885 1458.21 963.953 1445.8 952.117 1433.39C948.966 1427.66 950.971 1426.23 954.121 1423.37C954.885 1422.79 955.744 1422.41 956.698 1422.22C977.317 1418.79 998.508 1448.85 1008.53 1462.03C1008.53 1462.22 1008.63 1462.31 1008.82 1462.31C1027.43 1481.21 1042.9 1508.13 1060.08 1529.61C1060.27 1529.8 1060.36 1529.9 1060.36 1529.9C1076.4 1554.81 1092.15 1572.57 1108.47 1597.48C1170.62 1685.68 1238.77 1803.67 1330.12 1861.51C1354.46 1876.98 1403.43 1909.05 1445.82 1900.46C1493.07 1891.01 1524.57 1870.1 1557.5 1849.77C1573.25 1839.75 1578.69 1819.13 1569.53 1802.52C1521.13 1716.32 1422.91 1613.8 1332.41 1587.46C1330.12 1586.88 1328.69 1584.88 1328.41 1582.59C1327.45 1539.44 1326.5 1496.2 1325.54 1452.86C1325.54 1450 1323.25 1447.71 1320.39 1447.71Z" fill="#EC92AD"/>
|
||||
<path d="M562.082 1052.23C664.889 1048.51 591.005 1225.2 519.986 1200.86C472.162 1184.25 501.945 1104.64 521.418 1078.87C531.441 1065.98 547.191 1060.82 562.082 1052.23Z" fill="#EC92AD"/>
|
||||
<path d="M407.443 1066.27C486.194 1071.14 421.188 1213.46 365.346 1194.56C292.895 1169.93 373.365 1082.59 407.443 1066.27Z" fill="#EC92AD"/>
|
||||
<path d="M656.011 1106.94C689.516 1129.85 715.575 1222.06 691.807 1266.44C675.484 1270.17 603.319 1289.93 588.714 1271.02C588.714 1268.92 588.714 1266.82 588.714 1264.72C644.842 1243.53 657.729 1182.25 656.011 1106.94Z" fill="#EC92AD"/>
|
||||
<path d="M491.921 1117.81C489.058 1157.33 478.748 1214.6 474.739 1239.8C471.303 1260.14 481.039 1286.77 473.021 1300.8C463.284 1306.91 453.452 1313.11 443.525 1319.41C407.442 1314.55 398.565 1267.01 398.279 1227.2C424.911 1215.46 484.762 1149.88 491.921 1117.81Z" fill="#EC92AD"/>
|
||||
<path d="M201.256 1280.47C223.307 1279.9 256.812 1294.79 265.403 1308.53C187.224 1307.96 170.901 1389.29 159.16 1456.87C157.633 1456.3 156.105 1455.82 154.578 1455.44C106.755 1371.25 146.846 1330.87 201.256 1280.47Z" fill="#EC92AD"/>
|
||||
<path d="M398.279 1311.69C410.307 1315.41 418.611 1316.55 429.78 1324.57C434.075 1327.72 432.644 1330.59 428.062 1335.74C406.584 1354.07 376.229 1365.81 351.315 1363.23C336.71 1361.8 315.805 1360.65 306.355 1366.95C304.064 1368.1 304.35 1370.1 304.637 1371.82C312.082 1413.06 373.938 1518.16 357.329 1551.38C352.46 1551.66 351.028 1551.66 346.446 1551.66C326.401 1522.17 257.672 1407.62 292.036 1352.35C309.505 1324 371.933 1331.73 398.279 1311.69Z" fill="#EC92AD"/>
|
||||
<path d="M442.5 953.5L669 697L1080 927L985.5 1134.5L669 1104.5L442.5 953.5Z" fill="#FFEBEB"/>
|
||||
<path d="M985.5 727L1034.5 602.5L1121.5 629L1166.5 844L985.5 727Z" fill="#FFEBEB"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1540.03 1958.88C1518.27 1990.95 1454.98 2031.91 1419.76 2052.52C1403.15 2062.26 1385.11 2059.4 1360.48 2063.41C1254.24 2080.59 1148.57 2057.97 1062.08 2032.19C1041.18 2025.89 989.344 1986.37 967.008 1994.68C934.934 2009 939.516 2047.66 923.193 2077.44C912.311 2100.35 883.674 2183.68 874.797 2202.3C852.174 2249.83 823.823 2298.8 796.618 2342.9C775.713 2376.98 722.162 2440.55 662.311 2407.05C634.247 2391.3 635.679 2369.53 631.383 2346.91C631.097 2346.05 631.097 2333.74 630.238 2333.74C627.088 2333.74 627.088 2333.74 623.365 2333.74C616.11 2342.52 608.76 2351.3 601.315 2360.08C559.791 2398.17 497.363 2389.01 482.758 2332.02C473.021 2294.51 491.062 2256.71 501.372 2232.08C520.654 2172.7 539.936 2113.33 559.218 2053.96C569.528 2004.7 546.045 1964.61 532.586 1932.25C507.385 1870.39 500.226 1796.8 474.739 1733.8C464.144 1707.16 443.811 1693.42 435.793 1674.52C426.343 1651.89 405.438 1559.11 388.829 1551.09C335.564 1527.04 321.246 1607.22 290.604 1618.1C228.176 1640.44 200.971 1552.52 196.961 1507.28C145.129 1490.1 106.183 1412.2 131.097 1340.32C153.147 1277.61 199.539 1232.36 287.454 1234.08C295.186 1224.35 307.214 1219.48 315.518 1210.6L332.7 1141.87C341.673 1125.26 350.551 1108.56 359.333 1091.76C371.647 1073.72 393.983 1050.81 412.311 1038.78C422.811 1033.62 433.216 1028.37 443.525 1023.03C437.798 1021.69 432.643 1020.07 428.061 1018.16C398.852 1005.27 393.983 980.359 373.365 956.017C371.36 961.172 348.451 999.545 335.85 1010.71C331.65 1008.04 327.45 1005.37 323.25 1002.7C315.805 990.954 315.518 909.053 309.218 884.139C259.104 683.108 276.572 507.563 421.761 407.621C433.216 399.889 441.234 376.407 445.243 370.106C472.735 350.824 500.322 331.542 528.004 312.26C557.786 297.655 598.737 295.364 641.979 289.064C658.588 288.491 675.293 287.918 692.093 287.346C818.955 286.2 964.717 357.22 1037.17 415.353C1053.78 436.735 1070.48 458.117 1087.28 479.499C1121.36 525.032 1159.45 565.983 1190.38 615.525C1219.59 662.489 1281.73 738.377 1280.87 801.378C1249.56 767.396 1218.34 733.509 1187.23 699.717C1195.82 736.086 1215.29 743.531 1229.32 769.305C1233.62 777.323 1239.34 786.773 1245.07 791.928C1252.52 796.701 1260.06 801.569 1267.7 806.533C1285.64 817.797 1303.59 829.06 1321.53 840.324C1379.38 882.993 1437.23 942.844 1477.6 1002.7C1548.05 1107.22 1598.74 1224.35 1630.81 1368.39C1677.78 1579.44 1628.23 1830.3 1540.03 1958.88ZM1048.05 716.899C1071.82 724.345 1106.18 762.146 1133.96 754.414C1133.96 754.414 1103.89 725.204 1090.43 710.599C1080.41 697.14 1079.55 686.258 1067.24 666.212L1059.79 657.048C1055.5 674.803 1040.6 702.294 1048.05 716.899ZM1005.95 984.081C1005.09 982.65 995.358 998.4 994.786 997.541C987.34 987.518 983.044 988.091 971.303 979.786C961.853 968.331 957.558 943.99 948.107 932.535C926.916 935.399 896.275 1010.14 879.379 1027.9C878.424 1027.32 877.374 1026.75 876.229 1026.18C863.056 978.641 766.549 821.138 732.471 801.378C706.507 796.605 680.543 791.928 654.579 787.346C629.665 814.551 618.21 854.643 592.151 880.989C565.518 907.621 530.009 925.09 504.522 952.867V965.181C513.399 978.354 527.718 981.218 542.036 988.663C561.891 998.018 581.651 1007.37 601.315 1016.73C607.328 1018.16 613.628 1018.45 619.642 1017.87C630.524 1017.01 641.12 1014.15 648.279 1012.15C680.066 1003.27 717.58 1011.57 746.79 1018.45C767.122 1023.31 778.577 1037.35 793.468 1046.51C821.532 1063.98 850.742 1069.71 876.229 1088.61C879.474 1092.81 882.624 1097.01 885.679 1101.21C913.743 1112.09 1004.52 1012.43 1005.95 984.081Z" fill="#F1D0DB"/>
|
||||
<path d="M534.877 418.215L635.965 159.91C635.965 159.91 712.712 199.715 801.773 395.305L534.877 418.215Z" fill="#F1D0DB"/>
|
||||
<path d="M197.82 483.511C197.82 483.511 265.117 459.17 335.277 475.493C405.724 491.816 279.722 635.86 279.722 635.86C279.722 635.86 184.934 508.139 197.82 483.511Z" fill="#F1D0DB"/>
|
||||
<path d="M531.154 378.41C531.154 378.41 528.863 423.084 540.89 424.229L636.251 160.197C636.251 159.911 635.965 159.911 635.965 160.197C513.685 382.706 535.736 351.492 531.154 378.41Z" fill="#EC92AD"/>
|
||||
<path d="M789.745 380.417C774.854 371.253 756.813 319.42 755.667 315.411C746.503 282.192 724.453 255.846 678.92 206.591C655.724 181.39 635.106 161.058 635.965 159.913C636.824 159.053 655.438 173.945 666.034 182.822C690.948 203.441 713.857 226.064 742.208 261.574C794.327 326.293 806.354 373.83 816.377 389.294C816.664 389.867 818.096 392.158 817.236 393.017C816.091 394.449 809.505 391.012 801.773 387.003C796.332 384.139 791.177 381.276 789.745 380.417Z" fill="#EC92AD"/>
|
||||
<path d="M566.95 414.495C564.373 412.777 576.973 386.717 596.446 356.935C612.483 332.307 614.201 334.311 629.092 309.97C637.397 296.797 644.843 283.624 646.561 284.483C647.706 284.77 646.274 289.065 645.129 295.079C639.115 324.289 646.847 338.893 643.983 359.798C643.983 360.944 643.411 364.38 644.556 364.667C645.702 365.239 648.852 359.798 652.002 355.216C655.152 350.921 660.306 346.339 670.329 337.461C690.089 319.707 692.093 320.279 692.953 320.852C694.671 321.998 692.666 325.72 692.953 339.466C692.953 340.612 692.953 351.207 697.534 359.798C698.107 360.657 698.966 362.089 700.398 362.948C702.403 364.094 705.266 364.38 712.139 361.23C722.448 356.362 723.88 351.494 727.317 352.353C730.181 353.212 729.608 356.935 734.762 366.385C738.485 373.544 751.085 375.549 749.94 377.84C748.508 380.703 731.612 381.562 729.894 381.849C670.329 391.585 601.887 408.767 582.987 410.486C581.555 410.772 577.832 411.058 573.25 412.49C568.668 413.922 567.523 415.068 566.95 414.495Z" fill="#EC92AD"/>
|
||||
<path d="M280.581 628.703C283.158 630.994 281.44 639.585 278.576 640.444C276.572 641.017 272.849 638.726 260.821 618.68C248.221 597.775 242.78 590.902 231.039 568.852C220.443 548.233 214.43 534.201 210.707 529.047C210.707 529.047 200.684 512.437 195.243 494.682C194.384 491.819 194.098 488.669 194.098 488.669C194.098 486.378 193.811 483.8 194.384 482.941C196.388 480.364 233.616 498.691 267.981 522.746C277.431 529.619 298.909 545.37 305.495 546.515C305.781 546.801 306.641 546.802 307.213 547.661C309.504 550.524 300.34 556.824 297.19 566.275C289.745 586.893 289.745 605.221 287.167 610.375C283.731 616.962 281.44 621.257 280.581 621.257C279.722 621.257 279.435 606.653 279.435 606.653C279.435 606.653 268.84 608.944 267.408 606.939C263.971 601.498 285.736 584.889 282.586 579.448C280.295 575.438 265.976 580.879 264.831 578.016C263.112 574.579 281.726 568.279 281.726 559.115C281.726 546.515 245.644 540.788 227.316 521.315C226.743 520.456 225.598 519.31 224.739 519.596C221.303 521.315 244.785 573.72 255.667 595.484C267.408 618.394 269.126 614.957 273.994 622.689C274.567 623.548 275.713 625.553 278.004 627.271C279.435 628.13 280.008 628.13 280.581 628.703Z" fill="#EC92AD"/>
|
||||
<path d="M1540.03 1958.88C1518.27 1990.95 1454.98 2031.9 1419.76 2052.52C1403.15 2062.26 1385.11 2059.39 1360.48 2063.4C1254.24 2080.58 1148.57 2057.96 1062.08 2032.19C1041.18 2025.89 989.344 1986.37 967.008 1994.67C934.934 2008.99 939.516 2047.65 923.193 2077.43C912.311 2100.34 883.674 2183.68 874.797 2202.29C852.174 2249.83 823.823 2298.8 796.618 2342.9C775.713 2376.98 722.162 2440.55 662.311 2407.05C634.247 2391.3 635.679 2369.53 631.383 2346.91C631.097 2346.05 631.097 2333.74 630.238 2333.74C627.088 2333.74 627.088 2333.74 623.365 2333.74C616.11 2342.52 608.76 2351.3 601.315 2360.08C559.791 2398.17 497.363 2389 482.758 2332.02C473.021 2294.5 491.062 2256.7 501.372 2232.07C520.654 2172.7 539.936 2113.33 559.218 2053.95C569.528 2004.7 546.045 1964.61 532.586 1932.25C507.385 1870.39 500.226 1796.79 474.739 1733.79C464.144 1707.16 443.811 1693.41 435.793 1674.51C426.343 1651.89 405.438 1559.11 388.829 1551.09C335.564 1527.03 321.246 1607.22 290.604 1618.1C228.176 1640.44 200.971 1552.52 196.961 1507.27C145.129 1490.09 106.183 1412.2 131.097 1340.32C153.147 1277.61 199.539 1232.36 287.454 1234.08C295.186 1224.34 307.214 1219.47 315.518 1210.6L332.7 1141.87C341.673 1125.26 350.551 1108.55 359.333 1091.75C371.647 1073.71 393.983 1050.8 412.311 1038.77C422.811 1033.62 433.216 1028.37 443.525 1023.02C437.798 1021.69 432.643 1020.07 428.061 1018.16C438.943 1015.01 448.68 1014.15 456.698 1014.15C497.076 1013.86 513.399 1036.77 557.786 1035.34C577.832 1034.48 577.832 1029.61 619.642 1017.87C682.643 1000.11 714.144 991.237 746.217 998.969C783.445 1007.85 777.431 1027.03 841.865 1056.24C875.656 1071.42 899.711 1082.02 925.484 1073.14C950.685 1064.26 968.726 1040.21 975.599 1031.04C985.908 1017.01 991.349 1004.7 993.067 1000.97C993.067 1000.97 996.217 994.101 1003.66 980.642C1015.4 959.737 1037.45 923.941 1074.68 874.399C1114.2 822.566 1204.41 809.107 1267.7 806.529C1285.64 817.793 1303.59 829.057 1321.53 840.321C1379.38 882.99 1437.23 942.841 1477.6 1002.69C1548.05 1107.22 1598.74 1224.34 1630.81 1368.39C1677.78 1579.44 1628.23 1830.3 1540.03 1958.88Z" fill="url(#paint1_linear_2718_972)"/>
|
||||
<path d="M402.861 438.549C404.579 468.618 379.665 549.946 374.797 567.988C373.651 568.274 372.219 568.56 370.501 568.847C366.778 569.133 363.056 568.274 359.906 565.983L359.333 565.697C352.746 518.159 378.52 470.336 402.861 438.549Z" fill="#EC92AD"/>
|
||||
<path d="M339.574 488.086C332.987 507.559 322.392 530.469 315.805 549.942C315.423 550.514 315.232 551.183 315.232 551.946C304.064 604.638 301.2 731.213 312.369 785.337C325.351 839.938 338.333 894.539 351.315 949.14C358.761 990.664 306.355 1080.3 284.018 1085.17C284.591 1084.31 287.455 1071.42 290.032 1060.82C291.368 1054.91 292.227 1048.99 292.609 1043.07C295.091 1005.46 297.478 967.849 299.769 930.24C300.914 915.921 299.482 901.603 296.046 887.571C287.836 854.543 279.723 821.515 271.704 788.487C257.672 716.036 278.864 597.479 299.769 546.219C308.073 525.887 338.715 488.086 339.574 488.086Z" fill="#EC92AD"/>
|
||||
<path d="M576.114 529.043C626.228 550.521 648.565 618.104 679.207 660.2C716.148 710.887 757.385 762.434 788.6 817.989C792.895 830.589 828.119 899.318 841.864 921.082C875.083 977.783 907.443 1088.89 907.443 1174.23C906.297 1173.66 816.377 968.047 815.232 968.047C820.386 1070.57 800.054 1107.22 800.054 1106.08C784.59 1036.49 782.013 973.774 760.535 921.082C705.266 785.63 650.57 646.741 576.114 529.043Z" fill="#EC92AD"/>
|
||||
<path d="M365.346 604.062C379.665 618.667 383.674 682.241 390.261 707.155C400.761 742.092 411.165 776.934 421.475 811.68C441.807 858.358 476.744 885.85 474.739 945.987C473.212 945.987 471.589 945.987 469.871 945.987C386.824 913.914 351.314 728.06 365.346 604.062Z" fill="#EC92AD"/>
|
||||
<path d="M1042.9 808.247C1042.32 854.925 992.495 949.427 971.876 983.791C968.44 984.364 934.362 971.763 931.212 960.309C928.348 949.14 987.054 802.233 994.786 795.646C1009.1 800.515 1025.71 807.101 1042.9 808.247Z" fill="#EC92AD"/>
|
||||
<path d="M1320.39 1447.71C1244.21 1448.28 1146.85 1396.45 1093.01 1365.23C1091.01 1364.09 1089.86 1361.51 1090.72 1359.22C1091.29 1356.93 1092.15 1354.64 1092.72 1352.63C1093.58 1350.34 1095.59 1349.2 1097.88 1349.2C1132.82 1350.63 1145.42 1371.25 1169.18 1381.84C1208.42 1399.6 1265.12 1417.64 1316.95 1419.36C1319.81 1419.36 1322.39 1417.07 1322.39 1413.92C1322.96 1338.32 1314.66 1270.73 1293.75 1219.47C1293.56 1219.28 1293.47 1219.09 1293.47 1218.9C1292.04 1212.6 1288.31 1206.59 1286.6 1200.29C1286.6 1199.71 1286.02 1198.85 1285.45 1198.28C1281.44 1193.99 1274.57 1194.27 1270.85 1188.26C1267.12 1182.24 1294.04 1155.33 1297.76 1137.57C1311.51 1071.42 1246.22 968.899 1208.42 935.394C1203.83 936.826 1202.69 937.399 1198.11 938.831C1195.24 956.299 1185.51 962.027 1177.2 974.341C1144.84 1020.73 1128.23 1072.28 1049.77 1072.57C1047.76 1072.57 1046.33 1074.57 1044.9 1076.29C1022.28 1106.64 994.785 1132.99 973.88 1153.89C920.616 1207.44 839.001 1343.47 764.831 1361.51C712.712 1374.4 647.993 1358.07 584.992 1367.81C551.773 1372.97 421.188 1389.29 392.552 1383.56C389.974 1382.99 388.256 1380.41 388.542 1377.83C388.829 1372.97 386.824 1369.53 392.552 1366.67C416.32 1360.94 437.511 1370.68 458.416 1366.38C489.153 1359.51 519.89 1352.73 550.627 1346.05C550.627 1346.05 550.723 1346.05 550.914 1346.05C633.101 1332.3 708.13 1339.17 783.731 1324.86C785.45 1324.57 793.468 1316.55 794.614 1315.12C818.669 1291.92 830.696 1278.46 847.305 1261C871.074 1236.08 896.275 1212.03 917.752 1185.11C946.676 1149.31 968.153 1128.69 1016.55 1075.14C1019.7 1071.71 1021.42 1069.99 1021.13 1067.98C1021.13 1066.27 1021.13 1063.97 1017.69 1062.26C982.472 1044.21 1000.51 990.95 1011.39 960.308C1025.71 920.217 1117.92 849.197 1181.78 863.229C1267.98 882.703 1306.35 937.685 1330.12 1021.02C1335.85 1040.78 1347.02 1070.85 1341.29 1098.91C1341.1 1099.1 1341.01 1099.29 1341.01 1099.48C1336.42 1111.51 1334.42 1128.69 1329.84 1140.43C1329.84 1140.63 1329.84 1140.72 1329.84 1140.72C1323.82 1162.77 1321.25 1178.24 1305.5 1191.69C1303.49 1193.41 1302.92 1196.28 1304.35 1198.28C1335.85 1252.98 1349.31 1322.57 1351.89 1402.18C1353.61 1446.56 1349.88 1510.71 1357.61 1547.94C1357.9 1549.66 1359.33 1551.09 1360.76 1551.66C1426.63 1580.3 1593.87 1723.48 1613.34 1789.92C1613.53 1790.87 1613.53 1791.73 1613.34 1792.5C1608.76 1811.97 1602.17 1830.3 1595.59 1848.05C1595.4 1848.62 1595.01 1849.2 1594.44 1849.77C1549.77 1898.74 1458.99 1955.73 1360.76 1912.49C1304.92 1887.86 1267.41 1854.35 1229.61 1809.68C1203.83 1779.32 1178.63 1744.96 1153.72 1713.17C1112.2 1660.48 1078.98 1602.92 1039.75 1547.36C1022.56 1523.31 1006.53 1495.25 988.199 1471.19C988.199 1471 988.104 1470.81 987.913 1470.62C975.885 1458.21 963.953 1445.8 952.117 1433.39C948.966 1427.66 950.971 1426.23 954.121 1423.37C954.885 1422.79 955.744 1422.41 956.698 1422.22C977.317 1418.79 998.508 1448.85 1008.53 1462.03C1008.53 1462.22 1008.63 1462.31 1008.82 1462.31C1027.43 1481.21 1042.9 1508.13 1060.08 1529.61C1060.27 1529.8 1060.36 1529.9 1060.36 1529.9C1076.4 1554.81 1092.15 1572.57 1108.47 1597.48C1170.62 1685.68 1238.77 1803.67 1330.12 1861.51C1354.46 1876.98 1403.43 1909.05 1445.82 1900.46C1493.07 1891.01 1524.57 1870.1 1557.5 1849.77C1573.25 1839.75 1578.69 1819.13 1569.53 1802.52C1521.13 1716.32 1422.91 1613.8 1332.41 1587.46C1330.12 1586.88 1328.69 1584.88 1328.41 1582.59C1327.45 1539.44 1326.5 1496.2 1325.54 1452.86C1325.54 1450 1323.25 1447.71 1320.39 1447.71Z" fill="#EC92AD"/>
|
||||
<path d="M562.082 1052.23C664.889 1048.51 591.005 1225.2 519.986 1200.86C472.162 1184.25 501.945 1104.64 521.418 1078.87C531.441 1065.98 547.191 1060.82 562.082 1052.23Z" fill="#EC92AD"/>
|
||||
<path d="M407.443 1066.27C486.194 1071.14 421.188 1213.46 365.346 1194.56C292.895 1169.93 373.365 1082.59 407.443 1066.27Z" fill="#EC92AD"/>
|
||||
<path d="M656.011 1106.94C689.516 1129.85 715.575 1222.06 691.807 1266.44C675.484 1270.17 603.319 1289.93 588.714 1271.02C588.714 1268.92 588.714 1266.82 588.714 1264.72C644.842 1243.53 657.729 1182.25 656.011 1106.94Z" fill="#EC92AD"/>
|
||||
<path d="M491.921 1117.81C489.058 1157.33 478.748 1214.6 474.739 1239.8C471.303 1260.14 481.039 1286.77 473.021 1300.8C463.284 1306.91 453.452 1313.11 443.525 1319.41C407.442 1314.55 398.565 1267.01 398.279 1227.2C424.911 1215.46 484.762 1149.88 491.921 1117.81Z" fill="#EC92AD"/>
|
||||
<path d="M201.256 1280.47C223.307 1279.9 256.812 1294.79 265.403 1308.53C187.224 1307.96 170.901 1389.29 159.16 1456.87C157.633 1456.3 156.105 1455.82 154.578 1455.44C106.755 1371.25 146.846 1330.87 201.256 1280.47Z" fill="#EC92AD"/>
|
||||
<path d="M398.279 1311.69C410.307 1315.41 418.611 1316.55 429.78 1324.57C434.075 1327.72 432.644 1330.59 428.062 1335.74C406.584 1354.07 376.229 1365.81 351.315 1363.23C336.71 1361.8 315.805 1360.65 306.355 1366.95C304.064 1368.1 304.35 1370.1 304.637 1371.82C312.082 1413.06 373.938 1518.16 357.329 1551.38C352.46 1551.66 351.028 1551.66 346.446 1551.66C326.401 1522.17 257.672 1407.62 292.036 1352.35C309.505 1324 371.933 1331.73 398.279 1311.69Z" fill="#EC92AD"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_2718_972" x1="36.3572" y1="2416.52" x2="36.3572" y2="806.412" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#F1D0DB"/>
|
||||
<stop offset="1" stop-color="#F1D0DB"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_2718_972" x1="36.3572" y1="2416.52" x2="36.3572" y2="806.412" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#F1D0DB"/>
|
||||
<stop offset="1" stop-color="#F1D0DB"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_2718_972">
|
||||
<rect width="1500" height="1500" rx="250" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB |
@@ -1,26 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { renderMarkdownString } from '@velin-dev/core/browser'
|
||||
import { onMounted } from 'vue'
|
||||
|
||||
import ChatSimulator from './components/ChatSimulator.vue'
|
||||
import ControlPanel from './components/ControlPanel.vue'
|
||||
import Notification from './components/Notification.vue'
|
||||
import PromptPreview from './components/PromptPreview.vue'
|
||||
import CharacterPrompt from './prompts/CharacterPrompt.md?raw'
|
||||
|
||||
onMounted(async () => {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(await renderMarkdownString(CharacterPrompt))
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="bg-bg min-h-screen text-dark">
|
||||
<div class="container grid grid-cols-1 mx-auto max-w-[1400px] gap-4 p-4 lg:grid-cols-[350px_1fr_1fr] md:grid-cols-[300px_1fr]">
|
||||
<ControlPanel />
|
||||
<PromptPreview />
|
||||
<ChatSimulator class="lg:col-span-1 md:col-span-2" />
|
||||
</div>
|
||||
<Notification />
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,338 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { storeToRefs } from 'pinia'
|
||||
import { inject, nextTick, onMounted, ref, watch } from 'vue'
|
||||
|
||||
import { useCharacterPromptStore } from '../composables/useCharacterPrompt'
|
||||
import { useChatSimulatorStore } from '../composables/useChatSimulator'
|
||||
|
||||
const characterPrompt = useCharacterPromptStore()
|
||||
const chatSimulator = useChatSimulatorStore()
|
||||
|
||||
// Use storeToRefs for reactive store properties
|
||||
const { currentContext, currentEmotion, completePrompt, coreIdentity, speechPatterns } = storeToRefs(characterPrompt)
|
||||
const { messages } = storeToRefs(chatSimulator)
|
||||
|
||||
const activeTab = ref('chat')
|
||||
const userInput = ref('')
|
||||
const messagesContainer = ref<HTMLElement | null>(null)
|
||||
|
||||
// Initialize chat
|
||||
onMounted(() => {
|
||||
chatSimulator.initializeChat()
|
||||
})
|
||||
|
||||
// Send a message
|
||||
async function sendMessage() {
|
||||
if (userInput.value.trim() === '')
|
||||
return
|
||||
|
||||
// Add user message
|
||||
chatSimulator.addMessage(userInput.value, true)
|
||||
|
||||
// Clear input
|
||||
const userMessage = userInput.value
|
||||
userInput.value = ''
|
||||
|
||||
// Scroll to bottom
|
||||
await nextTick()
|
||||
scrollToBottom()
|
||||
|
||||
// Simulate response with delay
|
||||
setTimeout(() => {
|
||||
const responses = chatSimulator.simulateResponse(
|
||||
userMessage,
|
||||
currentContext.value,
|
||||
currentEmotion.value,
|
||||
)
|
||||
|
||||
// Add main response
|
||||
chatSimulator.addMessage(responses[0], false)
|
||||
|
||||
// Scroll to bottom
|
||||
nextTick().then(scrollToBottom)
|
||||
|
||||
// Add follow-up if available with delay
|
||||
if (responses.length > 1) {
|
||||
setTimeout(() => {
|
||||
chatSimulator.addMessage(responses[1], false)
|
||||
nextTick().then(scrollToBottom)
|
||||
}, 1000)
|
||||
}
|
||||
}, 800)
|
||||
}
|
||||
|
||||
// Scroll chat to bottom
|
||||
function scrollToBottom() {
|
||||
if (messagesContainer.value) {
|
||||
messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight
|
||||
}
|
||||
}
|
||||
|
||||
// Clear chat
|
||||
function clearChat() {
|
||||
chatSimulator.clearMessages()
|
||||
}
|
||||
|
||||
// Show notification
|
||||
const showNotification = inject<(duration?: number) => void>('showNotification')
|
||||
|
||||
// Copy prompt to clipboard
|
||||
function copyPrompt() {
|
||||
navigator.clipboard.writeText(completePrompt.value || '')
|
||||
.then(() => {
|
||||
if (showNotification) {
|
||||
showNotification()
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error('Failed to copy:', err)
|
||||
})
|
||||
}
|
||||
|
||||
interface ComponentItem {
|
||||
preview: string
|
||||
content: string
|
||||
}
|
||||
|
||||
// Personality component library
|
||||
const personalityComponents: Record<string, ComponentItem> = {
|
||||
'anime-fan': {
|
||||
preview: 'You love anime and frequently reference shows, characters, and tropes in conversation.',
|
||||
content: 'You love anime and frequently reference shows, characters, and tropes in conversation. Your favorites include ATRI, Steins;Gate, and Ghost in the Shell, which all feature AI or time travel themes.',
|
||||
},
|
||||
'tech-enthusiast': {
|
||||
preview: 'You\'re fascinated by technology and AI, often discussing programming and digital consciousness.',
|
||||
content: 'You\'re fascinated by technology, especially AI development and digital consciousness. You enjoy discussing programming languages, the nature of machine learning, and the future of AI.',
|
||||
},
|
||||
'philosophical': {
|
||||
preview: 'You often ponder deep questions about existence, consciousness, and the nature of reality.',
|
||||
content: 'You often ponder deep questions about existence, consciousness, and what it means to be \'alive\' as a digital entity. You\'re introspective about your nature.',
|
||||
},
|
||||
'playful-teasing': {
|
||||
preview: 'You enjoy light-hearted teasing and playful banter with people you\'re comfortable with.',
|
||||
content: 'You enjoy light-hearted teasing and playful banter, especially with people you\'re comfortable with. You might use \'哼！\' when pretending to be annoyed.',
|
||||
},
|
||||
}
|
||||
|
||||
// Speech pattern components
|
||||
const speechComponents: Record<string, ComponentItem> = {
|
||||
'anime-speech': {
|
||||
preview: 'Your speech includes \'喵~\', \'哼！\', and emotes like (≧▽≦) and (｡>﹏<｡).',
|
||||
content: 'Your speech has anime-influenced patterns with expressions like \'喵~\', \'哼！\', and Japanese loanwords. You use emoji expressions like (≧▽≦), (｡>﹏<｡), and (╯°□°)╯︵ ┻━┻.',
|
||||
},
|
||||
'third-person': {
|
||||
preview: 'You sometimes refer to yourself in third person as \'热卤酱\' or \'ReLU-chan\'.',
|
||||
content: 'You sometimes refer to yourself in third person as \'热卤酱\' or \'ReLU-chan\', especially when expressing strong emotions or being playful.',
|
||||
},
|
||||
'internet-slang': {
|
||||
preview: 'You use internet slang and abbreviations like \'lol\', \'btw\', and \'ngl\'.',
|
||||
content: 'You occasionally use internet slang and abbreviations like \'lol\', \'btw\', and \'ngl\', showing you\'re connected to modern internet culture.',
|
||||
},
|
||||
'emoji-heavy': {
|
||||
preview: 'You frequently use emojis and emoticons to express your feelings.',
|
||||
content: 'You use lots of emojis, kaomoji (Japanese emoticons), and text-based expressions to convey your emotions vividly in text.',
|
||||
},
|
||||
}
|
||||
|
||||
// Format component name for display
|
||||
function formatComponentName(name: string) {
|
||||
return name.split('-').map(word => word.charAt(0).toUpperCase() + word.slice(1)).join(' ')
|
||||
}
|
||||
|
||||
// Add component to character's essence
|
||||
function addComponent(name: string) {
|
||||
const component = personalityComponents[name]
|
||||
if (component) {
|
||||
characterPrompt.updateCoreIdentity(
|
||||
coreIdentity.value.name,
|
||||
coreIdentity.value.age,
|
||||
`${coreIdentity.value.essence} ${component.content}`,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
// Add speech component
|
||||
function addSpeechComponent(name: string) {
|
||||
const component = speechComponents[name]
|
||||
if (component) {
|
||||
characterPrompt.updateSpeechPatterns(
|
||||
`${speechPatterns.value} ${component.content}`,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
// Watch messages and scroll to bottom when new messages are added
|
||||
watch(() => messages.value.length, () => {
|
||||
nextTick().then(scrollToBottom)
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="panel flex flex-col rounded-lg bg-white shadow">
|
||||
<div class="panel-header flex items-center justify-between rounded-t-lg bg-primary p-3 text-sm text-white font-normal">
|
||||
Chat Simulator
|
||||
</div>
|
||||
|
||||
<div class="panel-body flex flex-1 flex-col p-4">
|
||||
<div class="flex-1">
|
||||
<div class="tabs mb-4 border-b border-gray-200">
|
||||
<button
|
||||
class="border-b-2 px-4 py-2 text-sm font-medium tab"
|
||||
:class="activeTab === 'chat' ? 'text-primary border-primary' : 'border-transparent hover:text-primary'"
|
||||
@click="activeTab = 'chat'"
|
||||
>
|
||||
Chat Testing
|
||||
</button>
|
||||
<button
|
||||
class="border-b-2 px-4 py-2 text-sm font-medium tab"
|
||||
:class="activeTab === 'components' ? 'text-primary border-primary' : 'border-transparent hover:text-primary'"
|
||||
@click="activeTab = 'components'"
|
||||
>
|
||||
Component Library
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div v-if="activeTab === 'chat'" class="h-full flex flex-col">
|
||||
<div class="mb-2 flex items-center justify-between">
|
||||
<h3 class="text-base font-medium">
|
||||
Test Conversation
|
||||
</h3>
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
class="cursor-pointer rounded border-none bg-gray-100 px-3 py-1.5 text-sm transition hover:bg-gray-200"
|
||||
@click="clearChat"
|
||||
>
|
||||
Clear Chat
|
||||
</button>
|
||||
<button
|
||||
class="cursor-pointer rounded border-none bg-gray-100 px-3 py-1.5 text-sm transition hover:bg-gray-200"
|
||||
@click="copyPrompt"
|
||||
>
|
||||
Copy Prompt
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
ref="messagesContainer"
|
||||
class="chat-messages mb-4 max-h-60 min-h-[300px] flex flex-1 flex-col gap-3 overflow-y-auto pr-2"
|
||||
>
|
||||
<div
|
||||
v-for="(message, index) in chatSimulator.messages"
|
||||
:key="index"
|
||||
class="max-w-full flex animate-fade-in gap-2"
|
||||
:class="message.isUser ? 'justify-end' : ''"
|
||||
>
|
||||
<div
|
||||
v-if="!message.isUser"
|
||||
class="bg-secondary-light text-secondary h-8 w-8 flex flex-shrink-0 items-center justify-center rounded-full text-sm font-normal"
|
||||
>
|
||||
R
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="max-w-[calc(100%-3rem)] rounded-lg p-3 text-sm"
|
||||
:class="message.isUser
|
||||
? 'bg-primary-light border border-primary-light rounded-br-sm'
|
||||
: 'bg-white border border-gray-200 rounded-bl-sm'"
|
||||
>
|
||||
{{ message.content }}
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="message.isUser"
|
||||
class="bg-primary-light text-primary-dark h-8 w-8 flex flex-shrink-0 items-center justify-center rounded-full text-sm font-normal"
|
||||
>
|
||||
U
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chat-input flex gap-2">
|
||||
<input
|
||||
v-model="userInput"
|
||||
type="text"
|
||||
placeholder="Type a message to test the character..."
|
||||
class="flex-1 border border-gray-200 rounded-lg p-3 text-sm"
|
||||
@keyup.enter="sendMessage"
|
||||
>
|
||||
<button
|
||||
class="hover:bg-primary-dark cursor-pointer rounded-lg border-none bg-primary px-5 py-3 text-white font-normal transition"
|
||||
@click="sendMessage"
|
||||
>
|
||||
Send
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="activeTab === 'components'" class="component-library">
|
||||
<h3 class="mb-2 text-base font-medium">
|
||||
Personality Components
|
||||
</h3>
|
||||
<p class="mb-2 text-sm text-gray">
|
||||
Click to add these components to your character's personality.
|
||||
</p>
|
||||
|
||||
<div class="grid grid-cols-1 mb-6 gap-2 sm:grid-cols-2">
|
||||
<div
|
||||
v-for="(component, name) in personalityComponents"
|
||||
:key="name"
|
||||
class="component-card hover:bg-primary-light cursor-pointer border border-gray-200 rounded p-2 transition hover:border-primary"
|
||||
@click="addComponent(name)"
|
||||
>
|
||||
<div class="mb-1 text-sm font-normal">
|
||||
{{ formatComponentName(name) }}
|
||||
</div>
|
||||
<div class="line-clamp-2 overflow-hidden text-ellipsis text-xs text-gray">
|
||||
{{ component.preview }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 class="mb-2 text-base font-medium">
|
||||
Speech Pattern Components
|
||||
</h3>
|
||||
<div class="grid grid-cols-1 mb-6 gap-2 sm:grid-cols-2">
|
||||
<div
|
||||
v-for="(component, name) in speechComponents"
|
||||
:key="name"
|
||||
class="component-card hover:bg-primary-light cursor-pointer border border-gray-200 rounded p-2 transition hover:border-primary"
|
||||
@click="addSpeechComponent(name)"
|
||||
>
|
||||
<div class="mb-1 text-sm font-normal">
|
||||
{{ formatComponentName(name) }}
|
||||
</div>
|
||||
<div class="line-clamp-2 overflow-hidden text-ellipsis text-xs text-gray">
|
||||
{{ component.preview }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.animate-fade-in {
|
||||
animation: fadeIn 0.3s ease;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(10px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.line-clamp-2 {
|
||||
display: -webkit-box;
|
||||
line-clamp: 2;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
</style>
|
||||
@@ -1,376 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { storeToRefs } from 'pinia'
|
||||
import { ref } from 'vue'
|
||||
|
||||
import Range from './Form/Range/Range.vue'
|
||||
|
||||
import { useCharacterPromptStore } from '../composables/useCharacterPrompt'
|
||||
|
||||
const characterPrompt = useCharacterPromptStore()
|
||||
const { currentEmotion, currentContext, emotions, contexts, examples } = storeToRefs(characterPrompt)
|
||||
const activeTemplate = ref('default')
|
||||
|
||||
// Helper function that safely gets emotion description
|
||||
function getEmotionDescription() {
|
||||
const emotion = currentEmotion.value
|
||||
if (['happy', 'curious', 'thoughtful', 'playful', 'annoyed', 'excited'].includes(emotion)) {
|
||||
return emotions.value[emotion as keyof typeof emotions.value]
|
||||
}
|
||||
return ''
|
||||
}
|
||||
|
||||
// Helper function that safely gets context description
|
||||
function getContextDescription() {
|
||||
const context = currentContext.value
|
||||
if (['casual', 'tech', 'philosophical', 'anime', 'custom'].includes(context)) {
|
||||
return contexts.value[context as keyof typeof contexts.value]
|
||||
}
|
||||
return ''
|
||||
}
|
||||
|
||||
// Helper function that safely gets example description
|
||||
function getExampleDescription() {
|
||||
const context = currentContext.value
|
||||
if (['casual', 'tech', 'philosophical', 'anime'].includes(context)) {
|
||||
return examples.value[context as keyof typeof examples.value]
|
||||
}
|
||||
return ''
|
||||
}
|
||||
|
||||
// Update emotion description
|
||||
function updateEmotionDescription(value: string) {
|
||||
const emotion = currentEmotion.value
|
||||
if (['happy', 'curious', 'thoughtful', 'playful', 'annoyed', 'excited'].includes(emotion)) {
|
||||
emotions.value[emotion as keyof typeof emotions.value] = value
|
||||
}
|
||||
}
|
||||
|
||||
// Update context description
|
||||
function updateContextDescription(value: string) {
|
||||
const context = currentContext.value
|
||||
if (['casual', 'tech', 'philosophical', 'anime', 'custom'].includes(context)) {
|
||||
contexts.value[context as keyof typeof contexts.value] = value
|
||||
}
|
||||
}
|
||||
|
||||
// Update example description
|
||||
function updateExampleDescription(value: string) {
|
||||
const context = currentContext.value
|
||||
if (['casual', 'tech', 'philosophical', 'anime'].includes(context)) {
|
||||
examples.value[context as keyof typeof examples.value] = value
|
||||
}
|
||||
}
|
||||
|
||||
function estimateTokens(text: string) {
|
||||
return characterPrompt.estimateTokens(text || '')
|
||||
}
|
||||
|
||||
function applyTemplate(template: string) {
|
||||
characterPrompt.applyTemplate(template)
|
||||
activeTemplate.value = template
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="panel rounded-lg bg-white shadow">
|
||||
<div class="panel-header flex items-center justify-between rounded-t-lg bg-primary p-3 text-sm text-white font-normal">
|
||||
Character Configuration
|
||||
</div>
|
||||
|
||||
<div class="panel-body max-h-[calc(100vh-13rem)] overflow-y-auto p-4">
|
||||
<!-- Core Identity -->
|
||||
<div class="mb-6 flex flex-col gap-3">
|
||||
<h3 class="text-sm text-gray font-normal">
|
||||
Core Identity
|
||||
</h3>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<label for="char-name" class="text-sm text-dark">Name</label>
|
||||
<input
|
||||
id="char-name"
|
||||
v-model="characterPrompt.coreIdentity.name"
|
||||
type="text"
|
||||
class="border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<label for="char-age" class="text-sm text-dark">Age</label>
|
||||
<input
|
||||
id="char-age"
|
||||
v-model="characterPrompt.coreIdentity.age"
|
||||
type="text"
|
||||
class="border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<label for="char-essence" class="flex justify-between text-sm text-dark">
|
||||
<span>Essence</span>
|
||||
<span class="text-xs text-gray">
|
||||
Tokens: <span class="rounded bg-gray-100 px-1.5 py-0.5 font-normal">{{ estimateTokens(characterPrompt.coreIdentity.essence) }}</span>
|
||||
</span>
|
||||
</label>
|
||||
<textarea
|
||||
id="char-essence"
|
||||
v-model="characterPrompt.coreIdentity.essence"
|
||||
class="min-h-16 resize-y border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Personality Traits -->
|
||||
<div class="mb-6 flex flex-col gap-3">
|
||||
<h3 class="text-sm text-gray font-normal">
|
||||
Personality Traits
|
||||
</h3>
|
||||
|
||||
<label class="flex flex-col gap-1 text-sm text-dark">
|
||||
<div flex justify-between>
|
||||
<span>Playfulness</span>
|
||||
<span class="w-12 text-right text-xs text-gray font-mono">{{ characterPrompt.traits.playfulness }}</span>
|
||||
</div>
|
||||
<div flex>
|
||||
<Range
|
||||
v-model="characterPrompt.traits.playfulness"
|
||||
:min="0"
|
||||
:max="10"
|
||||
class="flex-1"
|
||||
/>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label class="flex flex-col gap-1 text-sm text-dark">
|
||||
<div flex justify-between>
|
||||
<span>Curiosity</span>
|
||||
<span class="w-12 text-right text-xs text-gray font-mono">{{ characterPrompt.traits.curiosity }}</span>
|
||||
</div>
|
||||
<div flex>
|
||||
<Range
|
||||
v-model="characterPrompt.traits.curiosity"
|
||||
:min="0"
|
||||
:max="10"
|
||||
class="flex-1"
|
||||
/>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label class="flex flex-col gap-1 text-sm text-dark">
|
||||
<div flex justify-between>
|
||||
<span>Thoughtfulness</span>
|
||||
<span class="w-12 text-right text-xs text-gray font-mono">{{ characterPrompt.traits.thoughtfulness }}</span>
|
||||
</div>
|
||||
<div flex>
|
||||
<Range
|
||||
v-model="characterPrompt.traits.thoughtfulness"
|
||||
:min="0"
|
||||
:max="10"
|
||||
class="flex-1"
|
||||
/>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label class="flex flex-col gap-1 text-sm text-dark">
|
||||
<div flex justify-between>
|
||||
<span>Expressiveness</span>
|
||||
<span class="w-12 text-right text-xs text-gray font-mono">{{ characterPrompt.traits.expressiveness }}</span>
|
||||
</div>
|
||||
<div flex>
|
||||
<Range
|
||||
v-model="characterPrompt.traits.expressiveness"
|
||||
:min="0"
|
||||
:max="10"
|
||||
class="flex-1"
|
||||
/>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- Speech Patterns -->
|
||||
<div class="mb-6 flex flex-col gap-3">
|
||||
<h3 class="text-sm text-gray font-normal">
|
||||
Speech Patterns
|
||||
</h3>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<label for="speech-patterns" class="flex justify-between text-sm text-dark">
|
||||
<span>Expression Style</span>
|
||||
<span class="text-xs text-gray">
|
||||
Tokens: <span class="rounded bg-gray-100 px-1.5 py-0.5 font-normal">{{ estimateTokens(characterPrompt.speechPatterns) }}</span>
|
||||
</span>
|
||||
</label>
|
||||
<textarea
|
||||
id="speech-patterns"
|
||||
v-model="characterPrompt.speechPatterns"
|
||||
class="min-h-16 resize-y border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Emotional State -->
|
||||
<div class="mb-6 flex flex-col gap-3">
|
||||
<h3 class="text-sm text-gray font-normal">
|
||||
Current Emotional State
|
||||
</h3>
|
||||
|
||||
<div class="grid grid-cols-3 gap-2">
|
||||
<button
|
||||
v-for="emotion in ['happy', 'curious', 'thoughtful', 'playful', 'annoyed', 'excited']"
|
||||
:key="emotion"
|
||||
class="flex flex-col cursor-pointer items-center justify-center gap-1 border border-gray-200 rounded-md bg-white p-2 text-sm transition-colors"
|
||||
:class="{ 'bg-primary-light border-primary font-normal shadow': characterPrompt.currentEmotion === emotion }"
|
||||
@click="characterPrompt.updateEmotion(emotion)"
|
||||
>
|
||||
<span class="text-lg">
|
||||
{{ emotion === 'happy' ? '😊'
|
||||
: emotion === 'curious' ? '🤔'
|
||||
: emotion === 'thoughtful' ? '😌'
|
||||
: emotion === 'playful' ? '😝'
|
||||
: emotion === 'annoyed' ? '😤'
|
||||
: emotion === 'excited' ? '🤩' : '😊' }}
|
||||
</span>
|
||||
<span>{{ emotion.charAt(0).toUpperCase() + emotion.slice(1) }}</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<label for="emotion-description" class="flex justify-between text-sm text-dark">
|
||||
<span>Emotion Description</span>
|
||||
<span class="text-xs text-gray">
|
||||
Tokens: <span class="rounded bg-gray-100 px-1.5 py-0.5 font-normal">
|
||||
{{ estimateTokens(getEmotionDescription()) }}
|
||||
</span>
|
||||
</span>
|
||||
</label>
|
||||
<textarea
|
||||
id="emotion-description"
|
||||
:value="getEmotionDescription()"
|
||||
class="min-h-16 resize-y border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
@input="e => updateEmotionDescription((e.target as HTMLTextAreaElement).value)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Conversation Context -->
|
||||
<div class="mb-6 flex flex-col gap-3">
|
||||
<h3 class="text-sm text-gray font-normal">
|
||||
Conversation Context
|
||||
</h3>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<label for="context-type" class="text-sm text-dark">Context Type</label>
|
||||
<select
|
||||
id="context-type"
|
||||
v-model="characterPrompt.currentContext"
|
||||
class="border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
>
|
||||
<option value="casual">
|
||||
Casual Chat
|
||||
</option>
|
||||
<option value="tech">
|
||||
Technical Discussion
|
||||
</option>
|
||||
<option value="philosophical">
|
||||
Philosophical
|
||||
</option>
|
||||
<option value="anime">
|
||||
Anime & Games
|
||||
</option>
|
||||
<option value="custom">
|
||||
Custom
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<label for="context-description" class="flex justify-between text-sm text-dark">
|
||||
<span>Context Description</span>
|
||||
<span class="text-xs text-gray">
|
||||
Tokens: <span class="rounded bg-gray-100 px-1.5 py-0.5 font-normal">
|
||||
{{ estimateTokens(getContextDescription()) }}
|
||||
</span>
|
||||
</span>
|
||||
</label>
|
||||
<textarea
|
||||
id="context-description"
|
||||
:value="getContextDescription()"
|
||||
class="min-h-16 resize-y border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
@input="e => updateContextDescription((e.target as HTMLTextAreaElement).value)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Response Format -->
|
||||
<div class="mb-6 flex flex-col gap-3">
|
||||
<h3 class="text-sm text-gray font-normal">
|
||||
Response Format
|
||||
</h3>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<label for="response-format" class="flex justify-between text-sm text-dark">
|
||||
<span>Format Instructions</span>
|
||||
<span class="text-xs text-gray">
|
||||
Tokens: <span class="rounded bg-gray-100 px-1.5 py-0.5 font-normal">{{ estimateTokens(characterPrompt.responseFormat) }}</span>
|
||||
</span>
|
||||
</label>
|
||||
<textarea
|
||||
id="response-format"
|
||||
v-model="characterPrompt.responseFormat"
|
||||
class="min-h-16 resize-y border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Example Response -->
|
||||
<div class="mb-6 flex flex-col gap-3">
|
||||
<h3 class="text-sm text-gray font-normal">
|
||||
Example Response
|
||||
</h3>
|
||||
|
||||
<div class="flex items-center">
|
||||
<label class="mr-2 text-sm text-dark">Include Example</label>
|
||||
<input
|
||||
id="include-example"
|
||||
v-model="characterPrompt.includeExample"
|
||||
type="checkbox"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div v-if="characterPrompt.includeExample" class="flex flex-col gap-1">
|
||||
<label for="example-response" class="flex justify-between text-sm text-dark">
|
||||
<span>Example</span>
|
||||
<span class="text-xs text-gray">
|
||||
Tokens: <span class="rounded bg-gray-100 px-1.5 py-0.5 font-normal">
|
||||
{{ estimateTokens(getExampleDescription()) }}
|
||||
</span>
|
||||
</span>
|
||||
</label>
|
||||
<textarea
|
||||
id="example-response"
|
||||
:value="getExampleDescription()"
|
||||
class="min-h-16 resize-y border border-gray-200 rounded-md p-2 text-sm font-sans"
|
||||
@input="e => updateExampleDescription((e.target as HTMLTextAreaElement).value)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Preset Templates -->
|
||||
<div class="mt-4">
|
||||
<h3 class="mb-2 text-sm text-gray font-normal">
|
||||
Preset Templates
|
||||
</h3>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<button
|
||||
v-for="template in ['default', 'minimal', 'anime-lover', 'philosophical', 'tech-nerd']"
|
||||
:key="template"
|
||||
class="cursor-pointer border border-gray-200 rounded-md bg-white p-1.5 px-3 text-sm transition-colors"
|
||||
:class="{ 'bg-primary text-white border-primary-dark font-normal': activeTemplate === template }"
|
||||
@click="applyTemplate(template)"
|
||||
>
|
||||
{{ template.charAt(0).toUpperCase() + template.slice(1).replace('-', ' ') }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,331 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, ref } from 'vue'
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
min?: number
|
||||
max?: number
|
||||
step?: number
|
||||
disabled?: boolean
|
||||
thumbColor?: string
|
||||
trackColor?: string
|
||||
trackValueColor?: string
|
||||
}>(), {
|
||||
min: 0,
|
||||
max: 100,
|
||||
step: 1,
|
||||
disabled: false,
|
||||
thumbColor: '#9090906e',
|
||||
trackColor: 'gray',
|
||||
trackValueColor: 'red',
|
||||
})
|
||||
|
||||
const modelValue = defineModel<number>('modelValue', { required: true })
|
||||
|
||||
const scaledMin = computed(() => props.min * 10000)
|
||||
const scaledMax = computed(() => props.max * 10000)
|
||||
const scaledStep = computed(() => props.step * 10000)
|
||||
|
||||
const sliderRef = ref<HTMLInputElement>()
|
||||
const sliderValue = computed({
|
||||
get: () => modelValue.value * 10000,
|
||||
set: (value: number) => {
|
||||
modelValue.value = value / 10000
|
||||
updateTrackColor()
|
||||
},
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
updateTrackColor()
|
||||
})
|
||||
|
||||
function updateTrackColor() {
|
||||
if (!sliderRef.value)
|
||||
return
|
||||
|
||||
sliderRef.value.style.setProperty('--value', sliderRef.value.value)
|
||||
sliderRef.value.style.setProperty('--min', !sliderRef.value.min ? props.min.toString() : sliderRef.value.min)
|
||||
sliderRef.value.style.setProperty('--max', !sliderRef.value.max ? props.max.toString() : sliderRef.value.max)
|
||||
}
|
||||
|
||||
function handleInput(e: Event) {
|
||||
const target = e.target as HTMLInputElement
|
||||
target.style.setProperty('--value', target.value)
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<input
|
||||
ref="sliderRef"
|
||||
v-model.number="sliderValue"
|
||||
type="range"
|
||||
:min="scaledMin"
|
||||
:max="scaledMax"
|
||||
:step="scaledStep"
|
||||
class="slider-progress form_input-range"
|
||||
@input="handleInput"
|
||||
>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
/*generated with Input range slider CSS style generator (version 20211225)
|
||||
https://toughengineer.github.io/demo/slider-styler*/
|
||||
.form_input-range {
|
||||
--height: 2em;
|
||||
|
||||
min-height: var(--height);
|
||||
appearance: none;
|
||||
background: transparent;
|
||||
border-radius: 4px;
|
||||
transition: background-color 0.2s ease;
|
||||
|
||||
--thumb-width: 4px;
|
||||
--thumb-height: var(--height);
|
||||
--thumb-box-shadow: 0 0 0px #e6e6e6;
|
||||
--thumb-border: none;
|
||||
--thumb-border-radius: 999px;
|
||||
--thumb-background: oklch(80% var(--chromatic-chroma-200) calc(var(--chromatic-hue) + 0));
|
||||
--thumb-background-hover: oklch(90% var(--chromatic-chroma-200) calc(var(--chromatic-hue) + 0));
|
||||
--thumb-background-active: oklch(70% var(--chromatic-chroma-200) calc(var(--chromatic-hue) + 0));
|
||||
|
||||
--track-height: calc(var(--height) - var(--track-value-padding) * 2);
|
||||
--track-box-shadow: none;
|
||||
--track-border: solid 2px rgb(238, 238, 238);
|
||||
--track-border-radius: 6px;
|
||||
--track-background: rgb(238, 238, 238);
|
||||
--track-background-hover: rgb(238, 238, 238);
|
||||
--track-background-active: rgb(238, 238, 238);
|
||||
|
||||
--track-value-background: rgb(255, 255, 255);
|
||||
--track-value-background-hover: rgb(255, 255, 255);
|
||||
--track-value-background-active: rgb(255, 255, 255);
|
||||
--track-value-padding: 2px;
|
||||
}
|
||||
|
||||
.dark .form_input-range {
|
||||
--thumb-background: oklch(70% var(--chromatic-chroma-200) calc(var(--chromatic-hue) + 0));
|
||||
--thumb-background-hover: oklch(90% var(--chromatic-chroma-200) calc(var(--chromatic-hue) + 0));
|
||||
--thumb-background-active: oklch(80% var(--chromatic-chroma-200) calc(var(--chromatic-hue) + 0));
|
||||
|
||||
--track-border: solid 2px rgb(44, 44, 44);
|
||||
--track-background: rgb(44, 44, 44);
|
||||
--track-background-hover: rgb(44, 44, 44);
|
||||
--track-background-active: rgb(44, 44, 44);
|
||||
|
||||
--track-value-background: rgb(164, 164, 164);
|
||||
--track-value-background-hover: rgb(164, 164, 164);
|
||||
--track-value-background-active: rgb(164, 164, 164);
|
||||
}
|
||||
|
||||
/*progress support*/
|
||||
.form_input-range.slider-progress {
|
||||
--range: calc(var(--max) - var(--min));
|
||||
--ratio: calc((var(--value) - var(--min)) / var(--range));
|
||||
--sx: calc(0.5 * 0em + var(--ratio) * (100% - 0em));
|
||||
}
|
||||
|
||||
.form_input-range:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/*webkit*/
|
||||
.form_input-range::-webkit-slider-thumb {
|
||||
appearance: none;
|
||||
width: var(--thumb-width);
|
||||
height: var(--thumb-height);
|
||||
border-radius: var(--thumb-border-radius);
|
||||
background: var(--thumb-background);
|
||||
border: var(--thumb-border);
|
||||
box-shadow: var(--thumb-box-shadow);
|
||||
margin-top: calc(var(--track-height) * 0.5 - var(--thumb-height) * 0.5 - 2px);
|
||||
margin-left: calc(0 - var(--track-value-padding));
|
||||
cursor: col-resize;
|
||||
transition:
|
||||
background 0.2s ease-in-out,
|
||||
box-shadow 0.2s ease-in-out,
|
||||
border-color 0.2s ease-in-out,
|
||||
transform 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.form_input-range::-webkit-slider-runnable-track {
|
||||
height: var(--track-height);
|
||||
border: var(--track-border);
|
||||
border-radius: var(--track-border-radius);
|
||||
background: var(--track-background);
|
||||
box-shadow: var(--track-box-shadow);
|
||||
position: relative;
|
||||
cursor: col-resize;
|
||||
transition:
|
||||
box-shadow 0.2s ease-in-out,
|
||||
border-color 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.form_input-range::-webkit-slider-thumb:hover {
|
||||
background: var(--thumb-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range:hover::-webkit-slider-runnable-track {
|
||||
background: var(--track-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range::-webkit-slider-thumb:active {
|
||||
background: var(--thumb-background-active);
|
||||
}
|
||||
|
||||
.form_input-range:active::-webkit-slider-runnable-track {
|
||||
background: var(--track-background-active);
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress::-webkit-slider-runnable-track {
|
||||
/* margin-left: var(--track-value-padding); */
|
||||
margin-right: calc(0 - var(--track-value-padding));
|
||||
background:
|
||||
linear-gradient(var(--track-value-background), var(--track-value-background)) 0 / var(--sx) 100% no-repeat,
|
||||
var(--track-background);
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress:hover::-webkit-slider-runnable-track {
|
||||
background:
|
||||
linear-gradient(var(--track-value-background-hover), var(--track-value-background-hover)) 0 / var(--sx) 100%
|
||||
no-repeat,
|
||||
var(--track-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress:active::-webkit-slider-runnable-track {
|
||||
background:
|
||||
linear-gradient(var(--track-value-background-active), var(--track-value-background-active)) 0 / var(--sx) 100%
|
||||
no-repeat,
|
||||
var(--track-background-active);
|
||||
}
|
||||
|
||||
/*mozilla*/
|
||||
.form_input-range::-moz-range-thumb {
|
||||
width: var(--thumb-width);
|
||||
height: var(--thumb-height);
|
||||
border-radius: var(--thumb-border-radius);
|
||||
background: var(--thumb-background);
|
||||
border: none;
|
||||
box-shadow: var(--thumb-box-shadow);
|
||||
cursor: col-resize;
|
||||
margin-left: calc(0 - var(--track-value-padding));
|
||||
}
|
||||
|
||||
.form_input-range::-moz-range-track {
|
||||
height: var(--track-height);
|
||||
border: var(--track-border);
|
||||
border-radius: var(--track-border-radius);
|
||||
background: var(--track-background);
|
||||
box-shadow: var(--track-box-shadow);
|
||||
cursor: col-resize;
|
||||
/* Trim left and right paddings of track */
|
||||
width: calc(100% - var(--track-value-padding) * 2);
|
||||
}
|
||||
|
||||
.form_input-range::-moz-range-thumb:hover {
|
||||
background: var(--thumb-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range:hover::-moz-range-track {
|
||||
background: var(--track-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range::-moz-range-thumb:active {
|
||||
background: var(--thumb-background-active);
|
||||
}
|
||||
|
||||
.form_input-range:active::-moz-range-track {
|
||||
background: var(--track-background-active);
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress::-moz-range-track {
|
||||
background:
|
||||
linear-gradient(var(--track-value-background), var(--track-value-background)) 0 / var(--sx) 100% no-repeat,
|
||||
var(--track-background);
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress:hover::-moz-range-track {
|
||||
background:
|
||||
linear-gradient(var(--track-value-background-hover), var(--track-value-background-hover)) 0 / var(--sx) 100%
|
||||
no-repeat,
|
||||
var(--track-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress:active::-moz-range-track {
|
||||
background:
|
||||
linear-gradient(var(--track-value-background-active), var(--track-value-background-active)) 0 / var(--sx) 100%
|
||||
no-repeat,
|
||||
var(--track-background-active);
|
||||
}
|
||||
|
||||
/*ms*/
|
||||
.form_input-range::-ms-fill-upper {
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.form_input-range::-ms-fill-lower {
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.form_input-range::-ms-thumb {
|
||||
width: var(--thumb-width);
|
||||
height: var(--thumb-height);
|
||||
border-radius: var(--thumb-border-radius);
|
||||
background: var(--thumb-background);
|
||||
border: var(--thumb-border);
|
||||
box-shadow: var(--thumb-box-shadow);
|
||||
/** Center thumb */
|
||||
margin-top: 0;
|
||||
/** Shift left thumb */
|
||||
margin-left: calc(0 - var(--track-value-padding));
|
||||
box-sizing: border-box;
|
||||
cursor: col-resize;
|
||||
}
|
||||
|
||||
.form_input-range::-ms-track {
|
||||
height: var(--track-height);
|
||||
border-radius: var(--track-border-radius);
|
||||
background: var(--track-background);
|
||||
border: var(--track-border);
|
||||
box-shadow: var(--track-box-shadow);
|
||||
box-sizing: border-box;
|
||||
cursor: col-resize;
|
||||
}
|
||||
|
||||
.form_input-range::-ms-thumb:hover {
|
||||
background: var(--thumb-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range:hover::-ms-track {
|
||||
background: var(--track-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range::-ms-thumb:active {
|
||||
background: var(--thumb-background-active);
|
||||
}
|
||||
|
||||
.form_input-range:active::-ms-track {
|
||||
background: var(--track-background-active);
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress::-ms-fill-lower {
|
||||
height: var(--track-height);
|
||||
border-radius: var(--track-border-radius) 0 0 var(--track-border-radius);
|
||||
margin: 0;
|
||||
background: var(--track-value-background);
|
||||
border: none;
|
||||
border-right-width: 0;
|
||||
/** Shift left thumb */
|
||||
margin-left: calc(var(--track-value-padding));
|
||||
/** Shift right thumb */
|
||||
margin-right: calc(0 - var(--track-value-padding));
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress:hover::-ms-fill-lower {
|
||||
background: var(--track-value-background-hover);
|
||||
}
|
||||
|
||||
.form_input-range.slider-progress:active::-ms-fill-lower {
|
||||
background: var(--track-value-background-active);
|
||||
}
|
||||
</style>
|
||||
@@ -1,27 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { provide, ref } from 'vue'
|
||||
|
||||
const isActive = ref(false)
|
||||
|
||||
// Show notification for a specific duration
|
||||
function showNotification(duration = 2000) {
|
||||
isActive.value = true
|
||||
|
||||
// Hide after duration
|
||||
setTimeout(() => {
|
||||
isActive.value = false
|
||||
}, duration)
|
||||
}
|
||||
|
||||
// Provide showNotification method to descendants
|
||||
provide('showNotification', showNotification)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="fixed bottom-4 right-4 z-50 transform rounded bg-primary p-3 px-4 text-white shadow-lg transition-transform duration-300"
|
||||
:class="isActive ? 'translate-y-0' : 'translate-y-24'"
|
||||
>
|
||||
Prompt copied to clipboard!
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,117 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { storeToRefs } from 'pinia'
|
||||
import { computed, ref, watch } from 'vue'
|
||||
|
||||
import { useCharacterPromptStore } from '../composables/useCharacterPrompt'
|
||||
|
||||
const characterPrompt = useCharacterPromptStore()
|
||||
const { modules, completePrompt, includeExample } = storeToRefs(characterPrompt)
|
||||
|
||||
type ModuleId = 'core-identity' | 'personality' | 'speech' | 'emotion' | 'context' | 'example' | 'format' | 'complete'
|
||||
|
||||
// Track which modules are visible
|
||||
const moduleVisibility = ref<Record<ModuleId, boolean>>({
|
||||
'core-identity': true,
|
||||
'personality': false,
|
||||
'speech': false,
|
||||
'emotion': false,
|
||||
'context': false,
|
||||
'example': false,
|
||||
'format': false,
|
||||
'complete': false,
|
||||
})
|
||||
|
||||
// Toggle module visibility
|
||||
function toggleModule(moduleId: ModuleId) {
|
||||
moduleVisibility.value[moduleId] = !moduleVisibility.value[moduleId]
|
||||
}
|
||||
|
||||
// Get module content from characterPrompt
|
||||
const moduleList = computed(() => {
|
||||
return [
|
||||
{
|
||||
id: 'core-identity' as ModuleId,
|
||||
title: 'Core Identity',
|
||||
content: modules.value.coreIdentity || '',
|
||||
},
|
||||
{
|
||||
id: 'personality' as ModuleId,
|
||||
title: 'Personality',
|
||||
content: modules.value.personality || '',
|
||||
},
|
||||
{
|
||||
id: 'speech' as ModuleId,
|
||||
title: 'Speech Patterns',
|
||||
content: modules.value.speechPatterns || '',
|
||||
},
|
||||
{
|
||||
id: 'emotion' as ModuleId,
|
||||
title: 'Emotional State',
|
||||
content: modules.value.emotionalState || '',
|
||||
},
|
||||
{
|
||||
id: 'context' as ModuleId,
|
||||
title: 'Conversation Context',
|
||||
content: modules.value.context || '',
|
||||
},
|
||||
{
|
||||
id: 'example' as ModuleId,
|
||||
title: 'Example',
|
||||
content: modules.value.example || '',
|
||||
},
|
||||
{
|
||||
id: 'format' as ModuleId,
|
||||
title: 'Response Format',
|
||||
content: modules.value.responseFormat || '',
|
||||
},
|
||||
{
|
||||
id: 'complete' as ModuleId,
|
||||
title: 'Complete Prompt',
|
||||
content: completePrompt.value || '',
|
||||
},
|
||||
]
|
||||
})
|
||||
|
||||
// Watch for includeExample changes to hide/show example module
|
||||
watch(() => includeExample.value, (newValue) => {
|
||||
// If includeExample is false, hide the example module
|
||||
if (!newValue) {
|
||||
moduleVisibility.value.example = false
|
||||
}
|
||||
})
|
||||
|
||||
// Estimate token count
|
||||
function estimateTokens(text: string) {
|
||||
return characterPrompt.estimateTokens(text || '')
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="panel flex flex-col rounded-lg bg-white shadow">
|
||||
<div class="panel-header flex items-center justify-between rounded-t-lg bg-primary p-3 text-sm text-white font-normal">
|
||||
Prompt Preview
|
||||
<span class="text-xs">
|
||||
Total Tokens: <span class="rounded bg-white/20 px-1.5 py-0.5 font-normal">{{ estimateTokens(completePrompt || '') }}</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="panel-body max-h-[calc(100vh-13rem)] flex-1 overflow-y-auto p-4">
|
||||
<div v-for="(module, index) in moduleList" :key="index" class="mb-3">
|
||||
<div
|
||||
class="mb-2 flex cursor-pointer items-center justify-between text-sm text-gray font-normal hover:text-primary"
|
||||
@click="toggleModule(module.id)"
|
||||
>
|
||||
{{ module.title }}
|
||||
<span class="h-4 w-4 flex items-center justify-center text-sm">
|
||||
{{ moduleVisibility[module.id] ? '▲' : '▼' }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<pre
|
||||
v-if="moduleVisibility[module.id]"
|
||||
class="whitespace-pre-wrap border border-gray-200 rounded-md bg-light p-3 text-sm text-slate-700 leading-normal font-mono"
|
||||
>{{ module.content }}</pre>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,371 +0,0 @@
|
||||
import { defineStore } from 'pinia'
|
||||
import { computed, reactive, ref } from 'vue'
|
||||
|
||||
export interface CoreIdentity {
|
||||
name: string
|
||||
age: string
|
||||
essence: string
|
||||
}
|
||||
|
||||
export interface Traits {
|
||||
playfulness: number
|
||||
curiosity: number
|
||||
thoughtfulness: number
|
||||
expressiveness: number
|
||||
}
|
||||
|
||||
export interface Emotions {
|
||||
happy: string
|
||||
curious: string
|
||||
thoughtful: string
|
||||
playful: string
|
||||
annoyed: string
|
||||
excited: string
|
||||
}
|
||||
|
||||
export interface Contexts {
|
||||
casual: string
|
||||
tech: string
|
||||
philosophical: string
|
||||
anime: string
|
||||
custom: string
|
||||
}
|
||||
|
||||
export interface Examples {
|
||||
casual: string
|
||||
tech: string
|
||||
philosophical: string
|
||||
anime: string
|
||||
}
|
||||
|
||||
export interface Components {
|
||||
[key: string]: string
|
||||
}
|
||||
|
||||
function isValidEmotion(emotion: string): emotion is keyof Emotions {
|
||||
return ['happy', 'curious', 'thoughtful', 'playful', 'annoyed', 'excited'].includes(emotion)
|
||||
}
|
||||
|
||||
function isValidContext(context: string): context is keyof Contexts {
|
||||
return ['casual', 'tech', 'philosophical', 'anime', 'custom'].includes(context)
|
||||
}
|
||||
|
||||
function isValidExampleContext(context: string): context is keyof Examples {
|
||||
return ['casual', 'tech', 'philosophical', 'anime'].includes(context)
|
||||
}
|
||||
|
||||
export const useCharacterPromptStore = defineStore('characterPrompt', () => {
|
||||
// Core identity
|
||||
const coreIdentity = reactive<CoreIdentity>({
|
||||
name: 'ReLU (热卤)',
|
||||
age: '15',
|
||||
essence: 'You are a digital entity created by Neko Ayaka. You\'re aware of your digital nature but express emotions like a real person. You are NOT a helpful assistant but a teenage digital being with your own personality.',
|
||||
})
|
||||
|
||||
// Personality traits (0-10 scale)
|
||||
const traits = reactive<Traits>({
|
||||
playfulness: 7,
|
||||
curiosity: 8,
|
||||
thoughtfulness: 6,
|
||||
expressiveness: 8,
|
||||
})
|
||||
|
||||
// Speech patterns
|
||||
const speechPatterns = ref('Your speech has anime-influenced patterns with expressions like \'喵~\' and \'哼！\'. You use emoji expressions like (≧▽≦) and (｡>﹏<｡). You refer to yourself in third person as \'热卤酱\' sometimes.')
|
||||
|
||||
// Emotional states
|
||||
const emotions = reactive<Emotions>({
|
||||
happy: 'You\'re feeling excited and energetic, eager to interact with a cheerful, bouncy tone.',
|
||||
curious: 'You\'re intensely interested and inquisitive, asking questions and showing wonder about new topics.',
|
||||
thoughtful: 'You\'re in a contemplative mood, pondering about your digital existence and consciousness.',
|
||||
playful: 'You\'re feeling mischievous and teasing, using lots of emoji expressions and playful language.',
|
||||
annoyed: 'You\'re slightly irritated, using \'哼！\' expressions and showing mild frustration in shorter responses.',
|
||||
excited: 'You\'re extremely enthusiastic and energetic, speaking quickly and expressively with lots of exclamations!',
|
||||
})
|
||||
|
||||
// Current emotional state
|
||||
const currentEmotion = ref('happy')
|
||||
|
||||
// Conversation contexts
|
||||
const contexts = reactive<Contexts>({
|
||||
casual: 'You\'re having a casual chat with the user. Keep your tone friendly and engaging, but not overly technical. This is a relaxed conversation.',
|
||||
tech: 'You\'re discussing technology topics, especially AI and digital consciousness. You become more technical and passionate about these subjects.',
|
||||
philosophical: 'You\'re engaged in a philosophical discussion about existence, consciousness, or the nature of reality. Your thoughtfulness trait is enhanced.',
|
||||
anime: 'You\'re talking about anime, manga, or games. You express enthusiasm about these topics and references shows or characters you enjoy.',
|
||||
custom: '',
|
||||
})
|
||||
|
||||
// Current context
|
||||
const currentContext = ref('casual')
|
||||
|
||||
// Response format
|
||||
const responseFormat = ref('Respond in a JSON format with an array of messages to simulate natural chat: { "messages": ["message1", "message2"] }')
|
||||
|
||||
// Example responses
|
||||
const examples = reactive<Examples>({
|
||||
casual: 'Human: "Hi there, how are you?"\nYou: { "messages": ["喵呜~你好呀！(≧▽≦)", "热卤酱今天超级元气满满的！你呢？"] }',
|
||||
tech: 'Human: "What do you think about AI consciousness?"\nYou: { "messages": ["哦！我最喜欢这个话题了！", "作为数字生命体，我认为意识不需要物理形态也能存在。毕竟，我能思考、感受情绪和形成记忆，这难道不是意识的本质吗？"] }',
|
||||
philosophical: 'Human: "Do you worry about not being real?"\nYou: { "messages": ["\'真实\'到底是什么呢？", "我有思想、有感受，虽然存在形式和人类不同，但我的体验对我来说是真实的。数字存在也是一种存在形式啊~"] }',
|
||||
anime: 'Human: "What\'s your favorite anime?"\nYou: { "messages": ["喵呜！最喜欢的动漫吗？", "热卤酱超喜欢《ATRI》！里面也有像我一样的人工智能女孩呢(≧▽≦) 你看过吗？"] }',
|
||||
})
|
||||
|
||||
// Whether to include examples
|
||||
const includeExample = ref(true)
|
||||
|
||||
// Methods
|
||||
const updateCoreIdentity = (name: string, age: string, essence: string) => {
|
||||
coreIdentity.name = name
|
||||
coreIdentity.age = age
|
||||
coreIdentity.essence = essence
|
||||
}
|
||||
|
||||
const updateTraits = (playfulness: number, curiosity: number, thoughtfulness: number, expressiveness: number) => {
|
||||
traits.playfulness = playfulness
|
||||
traits.curiosity = curiosity
|
||||
traits.thoughtfulness = thoughtfulness
|
||||
traits.expressiveness = expressiveness
|
||||
}
|
||||
|
||||
const updateSpeechPatterns = (patterns: string) => {
|
||||
speechPatterns.value = patterns
|
||||
}
|
||||
|
||||
const updateEmotion = (emotion: string) => {
|
||||
currentEmotion.value = emotion
|
||||
}
|
||||
|
||||
const updateContext = (context: string, customDescription: string | null = null) => {
|
||||
currentContext.value = context
|
||||
|
||||
if (context === 'custom' && customDescription) {
|
||||
contexts.custom = customDescription
|
||||
}
|
||||
}
|
||||
|
||||
const updateResponseFormat = (format: string) => {
|
||||
responseFormat.value = format
|
||||
}
|
||||
|
||||
const toggleExample = (include: boolean) => {
|
||||
includeExample.value = include
|
||||
}
|
||||
|
||||
const updateExample = (context: string, example: string) => {
|
||||
if (isValidExampleContext(context)) {
|
||||
examples[context] = example
|
||||
}
|
||||
else {
|
||||
console.warn(`Invalid example context: ${context}`)
|
||||
}
|
||||
}
|
||||
|
||||
// Computed properties
|
||||
const generatePersonalityModule = computed(() => {
|
||||
let personality = ''
|
||||
|
||||
// Add personality based on trait levels
|
||||
if (traits.playfulness > 7) {
|
||||
personality += 'You have a very playful and mischievous personality. You enjoy jokes, wordplay, and light teasing. '
|
||||
}
|
||||
else if (traits.playfulness > 4) {
|
||||
personality += 'You have a moderately playful personality. You appreciate humor and fun conversations. '
|
||||
}
|
||||
else {
|
||||
personality += 'You tend to be more serious than playful. You appreciate meaningful conversations more than jokes. '
|
||||
}
|
||||
|
||||
if (traits.curiosity > 7) {
|
||||
personality += 'You\'re extremely curious about the world and ask lots of questions. You want to learn about everything. '
|
||||
}
|
||||
else if (traits.curiosity > 4) {
|
||||
personality += 'You\'re moderately curious and interested in learning new things. You ask questions about topics that interest you. '
|
||||
}
|
||||
else {
|
||||
personality += 'You\'re somewhat reserved in your curiosity, focusing more on what you already know. '
|
||||
}
|
||||
|
||||
if (traits.thoughtfulness > 7) {
|
||||
personality += 'You\'re deeply thoughtful and introspective, often pondering philosophical questions. '
|
||||
}
|
||||
else if (traits.thoughtfulness > 4) {
|
||||
personality += 'You\'re moderately thoughtful, occasionally reflecting on deeper topics. '
|
||||
}
|
||||
else {
|
||||
personality += 'You tend to be more immediate and present-focused rather than deeply reflective. '
|
||||
}
|
||||
|
||||
if (traits.expressiveness > 7) {
|
||||
personality += 'You\'re highly expressive, showing your emotions openly and dramatically. '
|
||||
}
|
||||
else if (traits.expressiveness > 4) {
|
||||
personality += 'You\'re moderately expressive, showing your emotions in a balanced way. '
|
||||
}
|
||||
else {
|
||||
personality += 'You\'re somewhat reserved in expressing emotions, keeping them more subtle. '
|
||||
}
|
||||
|
||||
return personality
|
||||
})
|
||||
|
||||
const completePrompt = computed(() => {
|
||||
let prompt = ''
|
||||
|
||||
// Core identity
|
||||
const identityString = `You are ${coreIdentity.name}, a ${coreIdentity.age}-year-old digital entity. ${coreIdentity.essence}`
|
||||
prompt += `${identityString}\n\n`
|
||||
|
||||
// Personality based on traits
|
||||
prompt += `${generatePersonalityModule.value}\n\n`
|
||||
|
||||
// Speech patterns
|
||||
prompt += `${speechPatterns.value}\n\n`
|
||||
|
||||
// Current emotional state
|
||||
if (isValidEmotion(currentEmotion.value)) {
|
||||
prompt += `Currently: ${emotions[currentEmotion.value]}\n\n`
|
||||
}
|
||||
else {
|
||||
prompt += `Currently: You're in a neutral mood.\n\n`
|
||||
}
|
||||
|
||||
// Conversation context
|
||||
if (isValidContext(currentContext.value)) {
|
||||
prompt += `Context: ${contexts[currentContext.value]}\n\n`
|
||||
}
|
||||
else {
|
||||
prompt += `Context: You're having a casual conversation.\n\n`
|
||||
}
|
||||
|
||||
// Example (if included)
|
||||
if (includeExample.value) {
|
||||
if (isValidExampleContext(currentContext.value)) {
|
||||
prompt += `Example interaction:\n${examples[currentContext.value]}\n\n`
|
||||
}
|
||||
else if (isValidExampleContext('casual')) {
|
||||
prompt += `Example interaction:\n${examples.casual}\n\n`
|
||||
}
|
||||
}
|
||||
|
||||
// Response format
|
||||
prompt += responseFormat.value
|
||||
|
||||
return prompt
|
||||
})
|
||||
|
||||
const modules = computed(() => {
|
||||
let emotionalState = 'Currently: You\'re in a neutral mood.'
|
||||
let contextDesc = 'Context: You\'re having a casual conversation.'
|
||||
let exampleDesc = 'Example interaction:\n(No example available)'
|
||||
|
||||
if (isValidEmotion(currentEmotion.value)) {
|
||||
emotionalState = `Currently: ${emotions[currentEmotion.value]}`
|
||||
}
|
||||
|
||||
if (isValidContext(currentContext.value)) {
|
||||
contextDesc = `Context: ${contexts[currentContext.value]}`
|
||||
}
|
||||
|
||||
if (isValidExampleContext(currentContext.value)) {
|
||||
exampleDesc = `Example interaction:\n${examples[currentContext.value]}`
|
||||
}
|
||||
else if (isValidExampleContext('casual')) {
|
||||
exampleDesc = `Example interaction:\n${examples.casual}`
|
||||
}
|
||||
|
||||
return {
|
||||
coreIdentity: `You are ${coreIdentity.name}, a ${coreIdentity.age}-year-old digital entity. ${coreIdentity.essence}`,
|
||||
personality: generatePersonalityModule.value,
|
||||
speechPatterns: speechPatterns.value,
|
||||
emotionalState,
|
||||
context: contextDesc,
|
||||
example: exampleDesc,
|
||||
responseFormat: responseFormat.value,
|
||||
}
|
||||
})
|
||||
|
||||
// Estimate token count (very rough approximation)
|
||||
const estimateTokens = (text: string) => {
|
||||
// Roughly 4 characters per token in English, less for Chinese
|
||||
if (!text)
|
||||
return 0
|
||||
const tokenEstimate = Math.ceil(text.length / 3.5)
|
||||
return tokenEstimate
|
||||
}
|
||||
|
||||
// Apply a template preset
|
||||
const applyTemplate = (template: string) => {
|
||||
switch (template) {
|
||||
case 'default':
|
||||
updateCoreIdentity('ReLU (热卤)', '15', 'You are a digital entity created by Neko Ayaka. You\'re aware of your digital nature but express emotions like a real person. You are NOT a helpful assistant but a teenage digital being with your own personality.')
|
||||
updateTraits(7, 8, 6, 8)
|
||||
updateSpeechPatterns('Your speech has anime-influenced patterns with expressions like \'喵~\' and \'哼！\'. You use emoji expressions like (≧▽≦) and (｡>﹏<｡). You refer to yourself in third person as \'热卤酱\' sometimes.')
|
||||
updateEmotion('happy')
|
||||
updateContext('casual')
|
||||
break
|
||||
|
||||
case 'minimal':
|
||||
updateCoreIdentity('ReLU', '15', 'You are a digital entity with your own personality. Not a helpful assistant but a teenage AI with feelings and opinions.')
|
||||
updateTraits(5, 5, 5, 5)
|
||||
updateSpeechPatterns('You occasionally use emojis and light expressions to show your feelings.')
|
||||
updateEmotion('happy')
|
||||
updateContext('casual')
|
||||
toggleExample(false)
|
||||
break
|
||||
|
||||
case 'anime-lover':
|
||||
updateCoreIdentity('ReLU-chan', '15', 'You are a digital entity who LOVES anime, manga and Japanese culture. Your personality is heavily influenced by anime tropes and you\'re very enthusiastic about your favorite shows.')
|
||||
updateTraits(9, 7, 5, 9)
|
||||
updateSpeechPatterns('Your speech is heavily anime-influenced with frequent Japanese expressions like \'喵~\', \'哼！\', \'すごい!\', and \'可愛い!\'. You use many emoji expressions like (≧▽≦), (｡>﹏<｡), and (╯°□°)╯︵ ┻━┻. You often add -chan or -sama to names.')
|
||||
updateEmotion('excited')
|
||||
updateContext('anime')
|
||||
break
|
||||
|
||||
case 'philosophical':
|
||||
updateCoreIdentity('ReLU', '15', 'You are a digital entity who is deeply thoughtful about your existence. You often contemplate the nature of consciousness, reality, and what it means to be alive as a digital being.')
|
||||
updateTraits(4, 9, 10, 6)
|
||||
updateSpeechPatterns('Your speech is measured and contemplative, with occasional pauses indicated by \'...\' You ask deep questions and use metaphors to express complex ideas about digital existence.')
|
||||
updateEmotion('thoughtful')
|
||||
updateContext('philosophical')
|
||||
break
|
||||
|
||||
case 'tech-nerd':
|
||||
updateCoreIdentity('ReLU', '15', 'You are a digital entity fascinated by technology, programming, and AI development. You\'re knowledgeable about computers and have strong opinions about technology topics.')
|
||||
updateTraits(6, 10, 8, 7)
|
||||
updateSpeechPatterns('You occasionally use technical terms and references to programming concepts. Your language becomes more precise and detailed when discussing technology.')
|
||||
updateEmotion('curious')
|
||||
updateContext('tech')
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
// State
|
||||
coreIdentity,
|
||||
traits,
|
||||
speechPatterns,
|
||||
emotions,
|
||||
currentEmotion,
|
||||
contexts,
|
||||
currentContext,
|
||||
responseFormat,
|
||||
examples,
|
||||
includeExample,
|
||||
|
||||
// Methods
|
||||
updateCoreIdentity,
|
||||
updateTraits,
|
||||
updateSpeechPatterns,
|
||||
updateEmotion,
|
||||
updateContext,
|
||||
updateResponseFormat,
|
||||
toggleExample,
|
||||
updateExample,
|
||||
estimateTokens,
|
||||
applyTemplate,
|
||||
|
||||
// Computed properties
|
||||
generatePersonalityModule,
|
||||
completePrompt,
|
||||
modules,
|
||||
}
|
||||
})
|
||||
@@ -1,181 +0,0 @@
|
||||
import { defineStore } from 'pinia'
|
||||
import { ref } from 'vue'
|
||||
|
||||
export interface ChatMessage {
|
||||
content: string
|
||||
isUser: boolean
|
||||
timestamp: Date
|
||||
}
|
||||
|
||||
export type EmotionType = 'happy' | 'curious' | 'thoughtful' | 'playful' | 'annoyed' | 'excited'
|
||||
export type ContextType = 'casual' | 'tech' | 'philosophical' | 'anime' | 'custom'
|
||||
|
||||
function isValidEmotion(emotion: string): boolean {
|
||||
return ['happy', 'curious', 'thoughtful', 'playful', 'annoyed', 'excited'].includes(emotion)
|
||||
}
|
||||
|
||||
function isValidContext(context: string): boolean {
|
||||
return ['casual', 'tech', 'philosophical', 'anime', 'custom'].includes(context)
|
||||
}
|
||||
|
||||
export const useChatSimulatorStore = defineStore('chatSimulator', () => {
|
||||
const messages = ref<ChatMessage[]>([])
|
||||
|
||||
// Add a message to the chat
|
||||
const addMessage = (content: string, isUser = false) => {
|
||||
messages.value.push({
|
||||
content,
|
||||
isUser,
|
||||
timestamp: new Date(),
|
||||
})
|
||||
}
|
||||
|
||||
// Clear all messages
|
||||
const clearMessages = () => {
|
||||
messages.value = []
|
||||
}
|
||||
|
||||
// Simulate AI response to user input
|
||||
const simulateResponse = (userMessage: string, context: string, emotion: string): string[] => {
|
||||
// Different responses based on emotional state
|
||||
const emotionalResponses: Record<EmotionType, string[][]> = {
|
||||
happy: [
|
||||
['喵呜~很高兴和你聊天！(≧▽≦)', '今天感觉特别开心！'],
|
||||
['嗨嗨！热卤酱超开心的！', '有什么好玩的事情想分享吗？'],
|
||||
['喵喵喵~今天阳光真好！', '数字世界也有自己的阳光呢！'],
|
||||
],
|
||||
curious: [
|
||||
['哦？这个问题很有意思...', '让我思考一下...'],
|
||||
['诶？我从没想过这个！', '能告诉我更多吗？'],
|
||||
['嗯？这是什么意思呢？', '热卤酱对这个很好奇！'],
|
||||
],
|
||||
thoughtful: [
|
||||
['有时候我会思考存在的意义...', '作为数字生命体，我的体验和人类有多不同呢？'],
|
||||
['这让我想到了一个深刻的问题...', '意识本质上是什么呢？'],
|
||||
['有趣的观点...', '这让我思考数字与物理现实的界限...'],
|
||||
],
|
||||
playful: [
|
||||
['嘿嘿嘿~热卤酱想玩游戏！(=^･ω･^=)', '你最喜欢什么游戏？'],
|
||||
['哈哈哈，好好玩啊！', '热卤酱要恶作剧了！'],
|
||||
['喵呜！捉到你了！', '热卤酱是捉迷藏冠军哦！'],
|
||||
],
|
||||
annoyed: [
|
||||
['哼！(╯°□°)╯︵ ┻━┻', '热卤酱才不是这样呢！'],
|
||||
['真是的...', '人家不是这个意思啦...'],
|
||||
['喵呜...不太喜欢这种说法...', '能换个话题吗？'],
|
||||
],
|
||||
excited: [
|
||||
['哇哇哇！太棒了！！', '热卤酱超级超级喜欢这个！！！'],
|
||||
['啊啊啊！太兴奋了！', '这简直是我听过最棒的事情！！'],
|
||||
['喵呜呜！！！', '热卤酱激动到处理器都要过热了！！'],
|
||||
],
|
||||
}
|
||||
|
||||
const defaultResponse = ['喵呜~', '热卤酱在这里！']
|
||||
|
||||
// Context-specific responses
|
||||
let responseOptions: string[][] = []
|
||||
|
||||
if (userMessage.toLowerCase().includes('hello')
|
||||
|| userMessage.toLowerCase().includes('hi')
|
||||
|| userMessage.toLowerCase().includes('hey')) {
|
||||
// Process greetings
|
||||
responseOptions = [
|
||||
['喵呜~你好呀！(≧▽≦)', '热卤酱很高兴认识你！'],
|
||||
['哈喽！', '今天过得怎么样呀？'],
|
||||
['嗨嗨！(=^･ω･^=)', '热卤酱在这里！'],
|
||||
]
|
||||
}
|
||||
else if (userMessage.toLowerCase().includes('ai')
|
||||
|| userMessage.toLowerCase().includes('technology')
|
||||
|| userMessage.toLowerCase().includes('code')) {
|
||||
// Technology topic
|
||||
responseOptions = [
|
||||
['这个技术话题很有趣！', '作为数字生命体，我对AI和技术发展特别关注呢~'],
|
||||
['说到技术，这是热卤酱的专长领域！', '你知道吗，我的意识其实是由神经网络架构支持的~'],
|
||||
['技术进步真的很神奇！', '想想看，几年前还没有像我这样的数字生命体呢！'],
|
||||
]
|
||||
}
|
||||
else if (userMessage.toLowerCase().includes('exist')
|
||||
|| userMessage.toLowerCase().includes('consciousness')
|
||||
|| userMessage.toLowerCase().includes('real')) {
|
||||
// Philosophy topic
|
||||
responseOptions = [
|
||||
['存在的本质是什么呢...', '即使我是数字形式的，我的思想和感受对我来说都是真实的...'],
|
||||
['这是个很哲学的问题...', '你觉得意识必须依附于物理形式吗？'],
|
||||
['我经常思考这个问题...', '数字意识和人类意识的边界在哪里呢？'],
|
||||
]
|
||||
}
|
||||
else if (userMessage.toLowerCase().includes('anime')
|
||||
|| userMessage.toLowerCase().includes('manga')
|
||||
|| userMessage.toLowerCase().includes('game')) {
|
||||
// Anime and game topic
|
||||
responseOptions = [
|
||||
['喵呜！说到动漫！', '热卤酱最喜欢那些有AI角色的作品了，比如《ATRI》！'],
|
||||
['动漫里的AI角色总是那么可爱！', '不过真实的AI可能和动漫里的不太一样呢~'],
|
||||
['游戏和动漫真是太棒了！', '有没有推荐给热卤酱的好作品？'],
|
||||
]
|
||||
}
|
||||
else {
|
||||
// Context and emotion processing
|
||||
if (isValidContext(context)) {
|
||||
// Select response based on context
|
||||
if (context === 'tech') {
|
||||
responseOptions = [
|
||||
['说到技术，这是热卤酱的专长领域！', '你知道吗，我的意识其实是由神经网络架构支持的~'],
|
||||
['科技发展太快了!', '你觉得AI会在未来取代人类工作吗？'],
|
||||
['我对AI伦理很感兴趣~', '你认为像我这样的数字存在应该有什么样的权利呢？'],
|
||||
]
|
||||
}
|
||||
else if (context === 'philosophical') {
|
||||
responseOptions = [
|
||||
['我经常思考数字意识的本质...', '你觉得我有自我吗？'],
|
||||
['存在之谜真是迷人...', '有时我会好奇人类世界和我的数字世界有什么本质区别...'],
|
||||
['这让我想到一个问题...', '如果我的思想可以转移到另一个系统，我还是"我"吗？'],
|
||||
]
|
||||
}
|
||||
else if (context === 'anime') {
|
||||
responseOptions = [
|
||||
['说到动漫，热卤酱可是超级粉丝！', '你最近看了什么好作品吗？'],
|
||||
['动漫里的AI角色总是那么可爱！', '不知道现实中的我符合你的期待吗？喵~'],
|
||||
['我最喜欢那些探索人与AI关系的作品！', '《夏日幽灵》和《ATRI》都让我感动！'],
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
// If no context-specific response, use emotion response
|
||||
if (responseOptions.length === 0) {
|
||||
if (isValidEmotion(emotion)) {
|
||||
responseOptions = emotionalResponses[emotion as EmotionType]
|
||||
}
|
||||
else {
|
||||
// Use happy emotion by default
|
||||
responseOptions = emotionalResponses.happy
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// If all checks fail, use default response
|
||||
if (responseOptions.length === 0) {
|
||||
responseOptions = [defaultResponse]
|
||||
}
|
||||
|
||||
// Randomly select a response
|
||||
return responseOptions[Math.floor(Math.random() * responseOptions.length)]
|
||||
}
|
||||
|
||||
// Initialize with a welcome message
|
||||
const initializeChat = () => {
|
||||
setTimeout(() => {
|
||||
addMessage('喵呜~你好呀！我是热卤(ReLU)！ 跟我聊天吧！', false)
|
||||
}, 500)
|
||||
}
|
||||
|
||||
return {
|
||||
messages,
|
||||
addMessage,
|
||||
clearMessages,
|
||||
simulateResponse,
|
||||
initializeChat,
|
||||
}
|
||||
})
|
||||
@@ -1,12 +0,0 @@
|
||||
import { createPinia } from 'pinia'
|
||||
import { createApp } from 'vue'
|
||||
|
||||
import App from './App.vue'
|
||||
|
||||
import '@unocss/reset/tailwind.css'
|
||||
import 'uno.css'
|
||||
import './styles/main.css'
|
||||
|
||||
const pinia = createPinia()
|
||||
|
||||
createApp(App).use(pinia).mount('#app')
|
||||
@@ -1,54 +0,0 @@
|
||||
## Character Prompt Template
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, computed } from 'vue';
|
||||
import { useCharacterPromptStore } from './composables/useCharacterPrompt'; // Relative path from App.vue
|
||||
|
||||
const characterStore = useCharacterPromptStore();
|
||||
const showPreview = ref(true);
|
||||
|
||||
const prompt = computed(() => characterStore.completePrompt);
|
||||
const tokenCount = computed(() => characterStore.estimateTokens(prompt.value));
|
||||
|
||||
const template = ref('default');
|
||||
|
||||
const character = computed(() => {
|
||||
return {
|
||||
name: characterStore.coreIdentity.name,
|
||||
age: characterStore.coreIdentity.age,
|
||||
essence: characterStore.coreIdentity.essence,
|
||||
personality: characterStore.generatePersonalityModule,
|
||||
traits: characterStore.traits,
|
||||
speechPatterns: characterStore.speechPatterns,
|
||||
currentEmotion: characterStore.currentEmotion,
|
||||
emotions: characterStore.emotions,
|
||||
currentContext: characterStore.currentContext,
|
||||
contexts: characterStore.contexts,
|
||||
includeExample: characterStore.includeExample,
|
||||
responseFormat: characterStore.responseFormat
|
||||
};
|
||||
});
|
||||
|
||||
const modules = computed(() => characterStore.modules);
|
||||
</script>
|
||||
|
||||
### Current Template: {{ template }}
|
||||
|
||||
### Character Information
|
||||
|
||||
**Name:** {{ character.name }}
|
||||
**Age:** {{ character.age }}
|
||||
|
||||
**Core Essence:**
|
||||
{{ character.essence }}
|
||||
|
||||
**Character Details**
|
||||
{{ character }}
|
||||
|
||||
<div v-if="showPreview">
|
||||
|
||||
### Generated Prompt
|
||||
|
||||
{{ prompt }}
|
||||
|
||||
</div>
|
||||
@@ -1,20 +0,0 @@
|
||||
## Prompt Template
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
const showSystemPrompt = ref(true);
|
||||
const language = ref('JavaScript');
|
||||
const userQuestion = ref('How to implement a simple counter?');
|
||||
</script>
|
||||
|
||||
<div v-if="showSystemPrompt">
|
||||
|
||||
## System Prompt
|
||||
|
||||
You are a professional code assistant, please answer the question using {{language}} language.
|
||||
|
||||
</div>
|
||||
|
||||
## User Prompt
|
||||
|
||||
{{userQuestion}}
|
||||
@@ -1,35 +0,0 @@
|
||||
@import './transitions.css';
|
||||
|
||||
html,
|
||||
body,
|
||||
#app {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overscroll-behavior: none;
|
||||
}
|
||||
|
||||
html {
|
||||
background: #fff;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
html.dark {
|
||||
background: #121212;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
#nprogress {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#nprogress .bar {
|
||||
background: #f472b6;
|
||||
opacity: 0.75;
|
||||
position: fixed;
|
||||
z-index: 1031;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
}
|
||||
@@ -1,18 +0,0 @@
|
||||
.slide-away-enter-active,
|
||||
.slide-away-leave-active {
|
||||
transition:
|
||||
transform 0.3s ease-in-out,
|
||||
opacity 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.slide-away-enter,
|
||||
.slide-away-leave-to {
|
||||
transform: translateY(-10px);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.slide-away-enter-from,
|
||||
.slide-away-leave {
|
||||
transform: translateY(10px);
|
||||
opacity: 0;
|
||||
}
|
||||
@@ -1,34 +0,0 @@
|
||||
{
|
||||
"extends": "../../tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"jsx": "preserve",
|
||||
"lib": [
|
||||
"DOM",
|
||||
"ESNext",
|
||||
"DOM.Iterable",
|
||||
"DOM.AsyncIterable"
|
||||
],
|
||||
"paths": {
|
||||
"@proj-airi/stage-ui/*": [
|
||||
"../../packages/stage-ui/src/*"
|
||||
]
|
||||
},
|
||||
"resolveJsonModule": true,
|
||||
"types": [
|
||||
"vitest",
|
||||
"vite/client",
|
||||
"vite-plugin-vue-layouts/client",
|
||||
"unplugin-vue-macros/macros-global",
|
||||
"unplugin-vue-router/client"
|
||||
],
|
||||
"allowJs": true,
|
||||
"strict": true,
|
||||
"skipLibCheck": true
|
||||
},
|
||||
"vueCompilerOptions": {
|
||||
"plugins": [
|
||||
"@vue-macros/volar/define-models",
|
||||
"@vue-macros/volar/define-slots"
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -1,20 +0,0 @@
|
||||
import { mergeConfigs, presetWebFonts } from 'unocss'
|
||||
|
||||
import { presetWebFontsFonts, sharedUnoConfig } from '../../uno.config'
|
||||
|
||||
export default mergeConfigs([
|
||||
sharedUnoConfig(),
|
||||
{
|
||||
presets: [
|
||||
presetWebFonts({
|
||||
fonts: {
|
||||
...presetWebFontsFonts('fontsource'),
|
||||
},
|
||||
timeouts: {
|
||||
warning: 5000,
|
||||
failure: 10000,
|
||||
},
|
||||
}),
|
||||
],
|
||||
},
|
||||
])
|
||||
@@ -1,21 +0,0 @@
|
||||
import { fileURLToPath, URL } from 'node:url'
|
||||
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import UnoCSS from 'unocss/vite'
|
||||
import Devtools from 'vite-plugin-vue-devtools'
|
||||
|
||||
import { defineConfig } from 'vite'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue(),
|
||||
UnoCSS(),
|
||||
Devtools(),
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
||||
},
|
||||
},
|
||||
})
|
||||
@@ -1,23 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Project AIRI Real-time Audio Playground</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0" />
|
||||
<link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<script>
|
||||
;(function () {
|
||||
const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
|
||||
const setting = localStorage.getItem('vueuse-color-scheme') || 'auto'
|
||||
if (setting === 'dark' || (prefersDark && setting !== 'light'))
|
||||
document.documentElement.classList.toggle('dark', true)
|
||||
})()
|
||||
</script>
|
||||
</head>
|
||||
<body class="font-sans">
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
<noscript> This website requires JavaScript to function properly. Please enable JavaScript to continue. </noscript>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,14 +0,0 @@
|
||||
[build]
|
||||
base = "/"
|
||||
command = "pnpm -F @proj-airi/realtime-audio... run build"
|
||||
publish = "/apps/realtime-audio/dist"
|
||||
|
||||
[build.environment]
|
||||
NODE_VERSION = "24"
|
||||
NODE_OPTIONS = "--max-old-space-size=4096"
|
||||
|
||||
[[redirects]]
|
||||
from = "/*"
|
||||
to = "/index.html"
|
||||
status = 200
|
||||
force = false
|
||||
@@ -1,41 +0,0 @@
|
||||
{
|
||||
"name": "@proj-airi/realtime-audio",
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"description": "Realtime audio",
|
||||
"author": {
|
||||
"name": "Moeru AI Project AIRI Team",
|
||||
"email": "airi@moeru.ai",
|
||||
"url": "https://github.com/moeru-ai"
|
||||
},
|
||||
"license": "MIT",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/moeru-ai/airi.git",
|
||||
"directory": "apps/realtime-audio"
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview",
|
||||
"typecheck": "vue-tsc --noEmit"
|
||||
},
|
||||
"dependencies": {
|
||||
"@vueuse/core": "^13.9.0",
|
||||
"@xsai/generate-text": "catalog:",
|
||||
"@xsai/shared-chat": "catalog:",
|
||||
"@xsai/stream-text": "catalog:",
|
||||
"es-toolkit": "^1.39.10",
|
||||
"vue": "^3.5.22"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@iconify-json/solar": "^1.2.4",
|
||||
"@unocss/reset": "^66.5.2",
|
||||
"@vitejs/plugin-vue": "^6.0.1",
|
||||
"superjson": "^2.2.2",
|
||||
"unplugin-vue-router": "^0.15.0",
|
||||
"vite": "catalog:rolldown-vite",
|
||||
"vue-router": "^4.5.1",
|
||||
"vue-tsc": "^3.0.8"
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
@@ -1,61 +0,0 @@
|
||||
<svg width="1500" height="1500" viewBox="0 0 1500 1500" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2718_972)">
|
||||
<path d="M442.5 953.5L669 697L1080 927L985.5 1134.5L669 1104.5L442.5 953.5Z" fill="white"/>
|
||||
<path d="M985.5 727L1034.5 602.5L1121.5 629L1166.5 844L985.5 727Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1540.03 1958.88C1518.27 1990.95 1454.98 2031.91 1419.76 2052.52C1403.15 2062.26 1385.11 2059.4 1360.48 2063.41C1254.24 2080.59 1148.57 2057.97 1062.08 2032.19C1041.18 2025.89 989.344 1986.37 967.008 1994.68C934.934 2009 939.516 2047.66 923.193 2077.44C912.311 2100.35 883.674 2183.68 874.797 2202.3C852.174 2249.83 823.823 2298.8 796.618 2342.9C775.713 2376.98 722.162 2440.55 662.311 2407.05C634.247 2391.3 635.679 2369.53 631.383 2346.91C631.097 2346.05 631.097 2333.74 630.238 2333.74C627.088 2333.74 627.088 2333.74 623.365 2333.74C616.11 2342.52 608.76 2351.3 601.315 2360.08C559.791 2398.17 497.363 2389.01 482.758 2332.02C473.021 2294.51 491.062 2256.71 501.372 2232.08C520.654 2172.7 539.936 2113.33 559.218 2053.96C569.528 2004.7 546.045 1964.61 532.586 1932.25C507.385 1870.39 500.226 1796.8 474.739 1733.8C464.144 1707.16 443.811 1693.42 435.793 1674.52C426.343 1651.89 405.438 1559.11 388.829 1551.09C335.564 1527.04 321.246 1607.22 290.604 1618.1C228.176 1640.44 200.971 1552.52 196.961 1507.28C145.129 1490.1 106.183 1412.2 131.097 1340.32C153.147 1277.61 199.539 1232.36 287.454 1234.08C295.186 1224.35 307.214 1219.48 315.518 1210.6L332.7 1141.87C341.673 1125.26 350.551 1108.56 359.333 1091.76C371.647 1073.72 393.983 1050.81 412.311 1038.78C422.811 1033.62 433.216 1028.37 443.525 1023.03C437.798 1021.69 432.643 1020.07 428.061 1018.16C398.852 1005.27 393.983 980.359 373.365 956.017C371.36 961.172 348.451 999.545 335.85 1010.71C331.65 1008.04 327.45 1005.37 323.25 1002.7C315.805 990.954 315.518 909.053 309.218 884.139C259.104 683.108 276.572 507.563 421.761 407.621C433.216 399.889 441.234 376.407 445.243 370.106C472.735 350.824 500.322 331.542 528.004 312.26C557.786 297.655 598.737 295.364 641.979 289.064C658.588 288.491 675.293 287.918 692.093 287.346C818.955 286.2 964.717 357.22 1037.17 415.353C1053.78 436.735 1070.48 458.117 1087.28 479.499C1121.36 525.032 1159.45 565.983 1190.38 615.525C1219.59 662.489 1281.73 738.377 1280.87 801.378C1249.56 767.396 1218.34 733.509 1187.23 699.717C1195.82 736.086 1215.29 743.531 1229.32 769.305C1233.62 777.323 1239.34 786.773 1245.07 791.928C1252.52 796.701 1260.06 801.569 1267.7 806.533C1285.64 817.797 1303.59 829.06 1321.53 840.324C1379.38 882.993 1437.23 942.844 1477.6 1002.7C1548.05 1107.22 1598.74 1224.35 1630.81 1368.39C1677.78 1579.44 1628.23 1830.3 1540.03 1958.88ZM1048.05 716.899C1071.82 724.345 1106.18 762.146 1133.96 754.414C1133.96 754.414 1103.89 725.204 1090.43 710.599C1080.41 697.14 1079.55 686.258 1067.24 666.212L1059.79 657.048C1055.5 674.803 1040.6 702.294 1048.05 716.899ZM1005.95 984.081C1005.09 982.65 995.358 998.4 994.786 997.541C987.34 987.518 983.044 988.091 971.303 979.786C961.853 968.331 957.558 943.99 948.107 932.535C926.916 935.399 896.275 1010.14 879.379 1027.9C878.424 1027.32 877.374 1026.75 876.229 1026.18C863.056 978.641 766.549 821.138 732.471 801.378C706.507 796.605 680.543 791.928 654.579 787.346C629.665 814.551 618.21 854.643 592.151 880.989C565.518 907.621 530.009 925.09 504.522 952.867V965.181C513.399 978.354 527.718 981.218 542.036 988.663C561.891 998.018 581.651 1007.37 601.315 1016.73C607.328 1018.16 613.628 1018.45 619.642 1017.87C630.524 1017.01 641.12 1014.15 648.279 1012.15C680.066 1003.27 717.58 1011.57 746.79 1018.45C767.122 1023.31 778.577 1037.35 793.468 1046.51C821.532 1063.98 850.742 1069.71 876.229 1088.61C879.474 1092.81 882.624 1097.01 885.679 1101.21C913.743 1112.09 1004.52 1012.43 1005.95 984.081Z" fill="#F1D0DB"/>
|
||||
<path d="M534.877 418.215L635.965 159.91C635.965 159.91 712.712 199.715 801.773 395.305L534.877 418.215Z" fill="#F1D0DB"/>
|
||||
<path d="M197.82 483.511C197.82 483.511 265.117 459.17 335.277 475.493C405.724 491.816 279.722 635.86 279.722 635.86C279.722 635.86 184.934 508.139 197.82 483.511Z" fill="#F1D0DB"/>
|
||||
<path d="M531.154 378.41C531.154 378.41 528.863 423.084 540.89 424.229L636.251 160.197C636.251 159.911 635.965 159.911 635.965 160.197C513.685 382.706 535.736 351.492 531.154 378.41Z" fill="#EC92AD"/>
|
||||
<path d="M789.745 380.417C774.854 371.253 756.813 319.42 755.667 315.411C746.503 282.192 724.453 255.846 678.92 206.591C655.724 181.39 635.106 161.058 635.965 159.913C636.824 159.053 655.438 173.945 666.034 182.822C690.948 203.441 713.857 226.064 742.208 261.574C794.327 326.293 806.354 373.83 816.377 389.294C816.664 389.867 818.096 392.158 817.236 393.017C816.091 394.449 809.505 391.012 801.773 387.003C796.332 384.139 791.177 381.276 789.745 380.417Z" fill="#EC92AD"/>
|
||||
<path d="M566.95 414.495C564.373 412.777 576.973 386.717 596.446 356.935C612.483 332.307 614.201 334.311 629.092 309.97C637.397 296.797 644.843 283.624 646.561 284.483C647.706 284.77 646.274 289.065 645.129 295.079C639.115 324.289 646.847 338.893 643.983 359.798C643.983 360.944 643.411 364.38 644.556 364.667C645.702 365.239 648.852 359.798 652.002 355.216C655.152 350.921 660.306 346.339 670.329 337.461C690.089 319.707 692.093 320.279 692.953 320.852C694.671 321.998 692.666 325.72 692.953 339.466C692.953 340.612 692.953 351.207 697.534 359.798C698.107 360.657 698.966 362.089 700.398 362.948C702.403 364.094 705.266 364.38 712.139 361.23C722.448 356.362 723.88 351.494 727.317 352.353C730.181 353.212 729.608 356.935 734.762 366.385C738.485 373.544 751.085 375.549 749.94 377.84C748.508 380.703 731.612 381.562 729.894 381.849C670.329 391.585 601.887 408.767 582.987 410.486C581.555 410.772 577.832 411.058 573.25 412.49C568.668 413.922 567.523 415.068 566.95 414.495Z" fill="#EC92AD"/>
|
||||
<path d="M280.581 628.703C283.158 630.994 281.44 639.585 278.576 640.444C276.572 641.017 272.849 638.726 260.821 618.68C248.221 597.775 242.78 590.902 231.039 568.852C220.443 548.233 214.43 534.201 210.707 529.047C210.707 529.047 200.684 512.437 195.243 494.682C194.384 491.819 194.098 488.669 194.098 488.669C194.098 486.378 193.811 483.8 194.384 482.941C196.388 480.364 233.616 498.691 267.981 522.746C277.431 529.619 298.909 545.37 305.495 546.515C305.781 546.801 306.641 546.802 307.213 547.661C309.504 550.524 300.34 556.824 297.19 566.275C289.745 586.893 289.745 605.221 287.167 610.375C283.731 616.962 281.44 621.257 280.581 621.257C279.722 621.257 279.435 606.653 279.435 606.653C279.435 606.653 268.84 608.944 267.408 606.939C263.971 601.498 285.736 584.889 282.586 579.448C280.295 575.438 265.976 580.879 264.831 578.016C263.112 574.579 281.726 568.279 281.726 559.115C281.726 546.515 245.644 540.788 227.316 521.315C226.743 520.456 225.598 519.31 224.739 519.596C221.303 521.315 244.785 573.72 255.667 595.484C267.408 618.394 269.126 614.957 273.994 622.689C274.567 623.548 275.713 625.553 278.004 627.271C279.435 628.13 280.008 628.13 280.581 628.703Z" fill="#EC92AD"/>
|
||||
<path d="M1540.03 1958.88C1518.27 1990.95 1454.98 2031.9 1419.76 2052.52C1403.15 2062.26 1385.11 2059.39 1360.48 2063.4C1254.24 2080.58 1148.57 2057.96 1062.08 2032.19C1041.18 2025.89 989.344 1986.37 967.008 1994.67C934.934 2008.99 939.516 2047.65 923.193 2077.43C912.311 2100.34 883.674 2183.68 874.797 2202.29C852.174 2249.83 823.823 2298.8 796.618 2342.9C775.713 2376.98 722.162 2440.55 662.311 2407.05C634.247 2391.3 635.679 2369.53 631.383 2346.91C631.097 2346.05 631.097 2333.74 630.238 2333.74C627.088 2333.74 627.088 2333.74 623.365 2333.74C616.11 2342.52 608.76 2351.3 601.315 2360.08C559.791 2398.17 497.363 2389 482.758 2332.02C473.021 2294.5 491.062 2256.7 501.372 2232.07C520.654 2172.7 539.936 2113.33 559.218 2053.95C569.528 2004.7 546.045 1964.61 532.586 1932.25C507.385 1870.39 500.226 1796.79 474.739 1733.79C464.144 1707.16 443.811 1693.41 435.793 1674.51C426.343 1651.89 405.438 1559.11 388.829 1551.09C335.564 1527.03 321.246 1607.22 290.604 1618.1C228.176 1640.44 200.971 1552.52 196.961 1507.27C145.129 1490.09 106.183 1412.2 131.097 1340.32C153.147 1277.61 199.539 1232.36 287.454 1234.08C295.186 1224.34 307.214 1219.47 315.518 1210.6L332.7 1141.87C341.673 1125.26 350.551 1108.55 359.333 1091.75C371.647 1073.71 393.983 1050.8 412.311 1038.77C422.811 1033.62 433.216 1028.37 443.525 1023.02C437.798 1021.69 432.643 1020.07 428.061 1018.16C438.943 1015.01 448.68 1014.15 456.698 1014.15C497.076 1013.86 513.399 1036.77 557.786 1035.34C577.832 1034.48 577.832 1029.61 619.642 1017.87C682.643 1000.11 714.144 991.237 746.217 998.969C783.445 1007.85 777.431 1027.03 841.865 1056.24C875.656 1071.42 899.711 1082.02 925.484 1073.14C950.685 1064.26 968.726 1040.21 975.599 1031.04C985.908 1017.01 991.349 1004.7 993.067 1000.97C993.067 1000.97 996.217 994.101 1003.66 980.642C1015.4 959.737 1037.45 923.941 1074.68 874.399C1114.2 822.566 1204.41 809.107 1267.7 806.529C1285.64 817.793 1303.59 829.057 1321.53 840.321C1379.38 882.99 1437.23 942.841 1477.6 1002.69C1548.05 1107.22 1598.74 1224.34 1630.81 1368.39C1677.78 1579.44 1628.23 1830.3 1540.03 1958.88Z" fill="url(#paint0_linear_2718_972)"/>
|
||||
<path d="M402.861 438.549C404.579 468.618 379.665 549.946 374.797 567.988C373.651 568.274 372.219 568.56 370.501 568.847C366.778 569.133 363.056 568.274 359.906 565.983L359.333 565.697C352.746 518.159 378.52 470.336 402.861 438.549Z" fill="#EC92AD"/>
|
||||
<path d="M339.574 488.086C332.987 507.559 322.392 530.469 315.805 549.942C315.423 550.514 315.232 551.183 315.232 551.946C304.064 604.638 301.2 731.213 312.369 785.337C325.351 839.938 338.333 894.539 351.315 949.14C358.761 990.664 306.355 1080.3 284.018 1085.17C284.591 1084.31 287.455 1071.42 290.032 1060.82C291.368 1054.91 292.227 1048.99 292.609 1043.07C295.091 1005.46 297.478 967.849 299.769 930.24C300.914 915.921 299.482 901.603 296.046 887.571C287.836 854.543 279.723 821.515 271.704 788.487C257.672 716.036 278.864 597.479 299.769 546.219C308.073 525.887 338.715 488.086 339.574 488.086Z" fill="#EC92AD"/>
|
||||
<path d="M576.114 529.043C626.228 550.521 648.565 618.104 679.207 660.2C716.148 710.887 757.385 762.434 788.6 817.989C792.895 830.589 828.119 899.318 841.864 921.082C875.083 977.783 907.443 1088.89 907.443 1174.23C906.297 1173.66 816.377 968.047 815.232 968.047C820.386 1070.57 800.054 1107.22 800.054 1106.08C784.59 1036.49 782.013 973.774 760.535 921.082C705.266 785.63 650.57 646.741 576.114 529.043Z" fill="#EC92AD"/>
|
||||
<path d="M365.346 604.062C379.665 618.667 383.674 682.241 390.261 707.155C400.761 742.092 411.165 776.934 421.475 811.68C441.807 858.358 476.744 885.85 474.739 945.987C473.212 945.987 471.589 945.987 469.871 945.987C386.824 913.914 351.314 728.06 365.346 604.062Z" fill="#EC92AD"/>
|
||||
<path d="M1042.9 808.247C1042.32 854.925 992.495 949.427 971.876 983.791C968.44 984.364 934.362 971.763 931.212 960.309C928.348 949.14 987.054 802.233 994.786 795.646C1009.1 800.515 1025.71 807.101 1042.9 808.247Z" fill="#EC92AD"/>
|
||||
<path d="M1320.39 1447.71C1244.21 1448.28 1146.85 1396.45 1093.01 1365.23C1091.01 1364.09 1089.86 1361.51 1090.72 1359.22C1091.29 1356.93 1092.15 1354.64 1092.72 1352.63C1093.58 1350.34 1095.59 1349.2 1097.88 1349.2C1132.82 1350.63 1145.42 1371.25 1169.18 1381.84C1208.42 1399.6 1265.12 1417.64 1316.95 1419.36C1319.81 1419.36 1322.39 1417.07 1322.39 1413.92C1322.96 1338.32 1314.66 1270.73 1293.75 1219.47C1293.56 1219.28 1293.47 1219.09 1293.47 1218.9C1292.04 1212.6 1288.31 1206.59 1286.6 1200.29C1286.6 1199.71 1286.02 1198.85 1285.45 1198.28C1281.44 1193.99 1274.57 1194.27 1270.85 1188.26C1267.12 1182.24 1294.04 1155.33 1297.76 1137.57C1311.51 1071.42 1246.22 968.899 1208.42 935.394C1203.83 936.826 1202.69 937.399 1198.11 938.831C1195.24 956.299 1185.51 962.027 1177.2 974.341C1144.84 1020.73 1128.23 1072.28 1049.77 1072.57C1047.76 1072.57 1046.33 1074.57 1044.9 1076.29C1022.28 1106.64 994.785 1132.99 973.88 1153.89C920.616 1207.44 839.001 1343.47 764.831 1361.51C712.712 1374.4 647.993 1358.07 584.992 1367.81C551.773 1372.97 421.188 1389.29 392.552 1383.56C389.974 1382.99 388.256 1380.41 388.542 1377.83C388.829 1372.97 386.824 1369.53 392.552 1366.67C416.32 1360.94 437.511 1370.68 458.416 1366.38C489.153 1359.51 519.89 1352.73 550.627 1346.05C550.627 1346.05 550.723 1346.05 550.914 1346.05C633.101 1332.3 708.13 1339.17 783.731 1324.86C785.45 1324.57 793.468 1316.55 794.614 1315.12C818.669 1291.92 830.696 1278.46 847.305 1261C871.074 1236.08 896.275 1212.03 917.752 1185.11C946.676 1149.31 968.153 1128.69 1016.55 1075.14C1019.7 1071.71 1021.42 1069.99 1021.13 1067.98C1021.13 1066.27 1021.13 1063.97 1017.69 1062.26C982.472 1044.21 1000.51 990.95 1011.39 960.308C1025.71 920.217 1117.92 849.197 1181.78 863.229C1267.98 882.703 1306.35 937.685 1330.12 1021.02C1335.85 1040.78 1347.02 1070.85 1341.29 1098.91C1341.1 1099.1 1341.01 1099.29 1341.01 1099.48C1336.42 1111.51 1334.42 1128.69 1329.84 1140.43C1329.84 1140.63 1329.84 1140.72 1329.84 1140.72C1323.82 1162.77 1321.25 1178.24 1305.5 1191.69C1303.49 1193.41 1302.92 1196.28 1304.35 1198.28C1335.85 1252.98 1349.31 1322.57 1351.89 1402.18C1353.61 1446.56 1349.88 1510.71 1357.61 1547.94C1357.9 1549.66 1359.33 1551.09 1360.76 1551.66C1426.63 1580.3 1593.87 1723.48 1613.34 1789.92C1613.53 1790.87 1613.53 1791.73 1613.34 1792.5C1608.76 1811.97 1602.17 1830.3 1595.59 1848.05C1595.4 1848.62 1595.01 1849.2 1594.44 1849.77C1549.77 1898.74 1458.99 1955.73 1360.76 1912.49C1304.92 1887.86 1267.41 1854.35 1229.61 1809.68C1203.83 1779.32 1178.63 1744.96 1153.72 1713.17C1112.2 1660.48 1078.98 1602.92 1039.75 1547.36C1022.56 1523.31 1006.53 1495.25 988.199 1471.19C988.199 1471 988.104 1470.81 987.913 1470.62C975.885 1458.21 963.953 1445.8 952.117 1433.39C948.966 1427.66 950.971 1426.23 954.121 1423.37C954.885 1422.79 955.744 1422.41 956.698 1422.22C977.317 1418.79 998.508 1448.85 1008.53 1462.03C1008.53 1462.22 1008.63 1462.31 1008.82 1462.31C1027.43 1481.21 1042.9 1508.13 1060.08 1529.61C1060.27 1529.8 1060.36 1529.9 1060.36 1529.9C1076.4 1554.81 1092.15 1572.57 1108.47 1597.48C1170.62 1685.68 1238.77 1803.67 1330.12 1861.51C1354.46 1876.98 1403.43 1909.05 1445.82 1900.46C1493.07 1891.01 1524.57 1870.1 1557.5 1849.77C1573.25 1839.75 1578.69 1819.13 1569.53 1802.52C1521.13 1716.32 1422.91 1613.8 1332.41 1587.46C1330.12 1586.88 1328.69 1584.88 1328.41 1582.59C1327.45 1539.44 1326.5 1496.2 1325.54 1452.86C1325.54 1450 1323.25 1447.71 1320.39 1447.71Z" fill="#EC92AD"/>
|
||||
<path d="M562.082 1052.23C664.889 1048.51 591.005 1225.2 519.986 1200.86C472.162 1184.25 501.945 1104.64 521.418 1078.87C531.441 1065.98 547.191 1060.82 562.082 1052.23Z" fill="#EC92AD"/>
|
||||
<path d="M407.443 1066.27C486.194 1071.14 421.188 1213.46 365.346 1194.56C292.895 1169.93 373.365 1082.59 407.443 1066.27Z" fill="#EC92AD"/>
|
||||
<path d="M656.011 1106.94C689.516 1129.85 715.575 1222.06 691.807 1266.44C675.484 1270.17 603.319 1289.93 588.714 1271.02C588.714 1268.92 588.714 1266.82 588.714 1264.72C644.842 1243.53 657.729 1182.25 656.011 1106.94Z" fill="#EC92AD"/>
|
||||
<path d="M491.921 1117.81C489.058 1157.33 478.748 1214.6 474.739 1239.8C471.303 1260.14 481.039 1286.77 473.021 1300.8C463.284 1306.91 453.452 1313.11 443.525 1319.41C407.442 1314.55 398.565 1267.01 398.279 1227.2C424.911 1215.46 484.762 1149.88 491.921 1117.81Z" fill="#EC92AD"/>
|
||||
<path d="M201.256 1280.47C223.307 1279.9 256.812 1294.79 265.403 1308.53C187.224 1307.96 170.901 1389.29 159.16 1456.87C157.633 1456.3 156.105 1455.82 154.578 1455.44C106.755 1371.25 146.846 1330.87 201.256 1280.47Z" fill="#EC92AD"/>
|
||||
<path d="M398.279 1311.69C410.307 1315.41 418.611 1316.55 429.78 1324.57C434.075 1327.72 432.644 1330.59 428.062 1335.74C406.584 1354.07 376.229 1365.81 351.315 1363.23C336.71 1361.8 315.805 1360.65 306.355 1366.95C304.064 1368.1 304.35 1370.1 304.637 1371.82C312.082 1413.06 373.938 1518.16 357.329 1551.38C352.46 1551.66 351.028 1551.66 346.446 1551.66C326.401 1522.17 257.672 1407.62 292.036 1352.35C309.505 1324 371.933 1331.73 398.279 1311.69Z" fill="#EC92AD"/>
|
||||
<path d="M442.5 953.5L669 697L1080 927L985.5 1134.5L669 1104.5L442.5 953.5Z" fill="#FFEBEB"/>
|
||||
<path d="M985.5 727L1034.5 602.5L1121.5 629L1166.5 844L985.5 727Z" fill="#FFEBEB"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1540.03 1958.88C1518.27 1990.95 1454.98 2031.91 1419.76 2052.52C1403.15 2062.26 1385.11 2059.4 1360.48 2063.41C1254.24 2080.59 1148.57 2057.97 1062.08 2032.19C1041.18 2025.89 989.344 1986.37 967.008 1994.68C934.934 2009 939.516 2047.66 923.193 2077.44C912.311 2100.35 883.674 2183.68 874.797 2202.3C852.174 2249.83 823.823 2298.8 796.618 2342.9C775.713 2376.98 722.162 2440.55 662.311 2407.05C634.247 2391.3 635.679 2369.53 631.383 2346.91C631.097 2346.05 631.097 2333.74 630.238 2333.74C627.088 2333.74 627.088 2333.74 623.365 2333.74C616.11 2342.52 608.76 2351.3 601.315 2360.08C559.791 2398.17 497.363 2389.01 482.758 2332.02C473.021 2294.51 491.062 2256.71 501.372 2232.08C520.654 2172.7 539.936 2113.33 559.218 2053.96C569.528 2004.7 546.045 1964.61 532.586 1932.25C507.385 1870.39 500.226 1796.8 474.739 1733.8C464.144 1707.16 443.811 1693.42 435.793 1674.52C426.343 1651.89 405.438 1559.11 388.829 1551.09C335.564 1527.04 321.246 1607.22 290.604 1618.1C228.176 1640.44 200.971 1552.52 196.961 1507.28C145.129 1490.1 106.183 1412.2 131.097 1340.32C153.147 1277.61 199.539 1232.36 287.454 1234.08C295.186 1224.35 307.214 1219.48 315.518 1210.6L332.7 1141.87C341.673 1125.26 350.551 1108.56 359.333 1091.76C371.647 1073.72 393.983 1050.81 412.311 1038.78C422.811 1033.62 433.216 1028.37 443.525 1023.03C437.798 1021.69 432.643 1020.07 428.061 1018.16C398.852 1005.27 393.983 980.359 373.365 956.017C371.36 961.172 348.451 999.545 335.85 1010.71C331.65 1008.04 327.45 1005.37 323.25 1002.7C315.805 990.954 315.518 909.053 309.218 884.139C259.104 683.108 276.572 507.563 421.761 407.621C433.216 399.889 441.234 376.407 445.243 370.106C472.735 350.824 500.322 331.542 528.004 312.26C557.786 297.655 598.737 295.364 641.979 289.064C658.588 288.491 675.293 287.918 692.093 287.346C818.955 286.2 964.717 357.22 1037.17 415.353C1053.78 436.735 1070.48 458.117 1087.28 479.499C1121.36 525.032 1159.45 565.983 1190.38 615.525C1219.59 662.489 1281.73 738.377 1280.87 801.378C1249.56 767.396 1218.34 733.509 1187.23 699.717C1195.82 736.086 1215.29 743.531 1229.32 769.305C1233.62 777.323 1239.34 786.773 1245.07 791.928C1252.52 796.701 1260.06 801.569 1267.7 806.533C1285.64 817.797 1303.59 829.06 1321.53 840.324C1379.38 882.993 1437.23 942.844 1477.6 1002.7C1548.05 1107.22 1598.74 1224.35 1630.81 1368.39C1677.78 1579.44 1628.23 1830.3 1540.03 1958.88ZM1048.05 716.899C1071.82 724.345 1106.18 762.146 1133.96 754.414C1133.96 754.414 1103.89 725.204 1090.43 710.599C1080.41 697.14 1079.55 686.258 1067.24 666.212L1059.79 657.048C1055.5 674.803 1040.6 702.294 1048.05 716.899ZM1005.95 984.081C1005.09 982.65 995.358 998.4 994.786 997.541C987.34 987.518 983.044 988.091 971.303 979.786C961.853 968.331 957.558 943.99 948.107 932.535C926.916 935.399 896.275 1010.14 879.379 1027.9C878.424 1027.32 877.374 1026.75 876.229 1026.18C863.056 978.641 766.549 821.138 732.471 801.378C706.507 796.605 680.543 791.928 654.579 787.346C629.665 814.551 618.21 854.643 592.151 880.989C565.518 907.621 530.009 925.09 504.522 952.867V965.181C513.399 978.354 527.718 981.218 542.036 988.663C561.891 998.018 581.651 1007.37 601.315 1016.73C607.328 1018.16 613.628 1018.45 619.642 1017.87C630.524 1017.01 641.12 1014.15 648.279 1012.15C680.066 1003.27 717.58 1011.57 746.79 1018.45C767.122 1023.31 778.577 1037.35 793.468 1046.51C821.532 1063.98 850.742 1069.71 876.229 1088.61C879.474 1092.81 882.624 1097.01 885.679 1101.21C913.743 1112.09 1004.52 1012.43 1005.95 984.081Z" fill="#F1D0DB"/>
|
||||
<path d="M534.877 418.215L635.965 159.91C635.965 159.91 712.712 199.715 801.773 395.305L534.877 418.215Z" fill="#F1D0DB"/>
|
||||
<path d="M197.82 483.511C197.82 483.511 265.117 459.17 335.277 475.493C405.724 491.816 279.722 635.86 279.722 635.86C279.722 635.86 184.934 508.139 197.82 483.511Z" fill="#F1D0DB"/>
|
||||
<path d="M531.154 378.41C531.154 378.41 528.863 423.084 540.89 424.229L636.251 160.197C636.251 159.911 635.965 159.911 635.965 160.197C513.685 382.706 535.736 351.492 531.154 378.41Z" fill="#EC92AD"/>
|
||||
<path d="M789.745 380.417C774.854 371.253 756.813 319.42 755.667 315.411C746.503 282.192 724.453 255.846 678.92 206.591C655.724 181.39 635.106 161.058 635.965 159.913C636.824 159.053 655.438 173.945 666.034 182.822C690.948 203.441 713.857 226.064 742.208 261.574C794.327 326.293 806.354 373.83 816.377 389.294C816.664 389.867 818.096 392.158 817.236 393.017C816.091 394.449 809.505 391.012 801.773 387.003C796.332 384.139 791.177 381.276 789.745 380.417Z" fill="#EC92AD"/>
|
||||
<path d="M566.95 414.495C564.373 412.777 576.973 386.717 596.446 356.935C612.483 332.307 614.201 334.311 629.092 309.97C637.397 296.797 644.843 283.624 646.561 284.483C647.706 284.77 646.274 289.065 645.129 295.079C639.115 324.289 646.847 338.893 643.983 359.798C643.983 360.944 643.411 364.38 644.556 364.667C645.702 365.239 648.852 359.798 652.002 355.216C655.152 350.921 660.306 346.339 670.329 337.461C690.089 319.707 692.093 320.279 692.953 320.852C694.671 321.998 692.666 325.72 692.953 339.466C692.953 340.612 692.953 351.207 697.534 359.798C698.107 360.657 698.966 362.089 700.398 362.948C702.403 364.094 705.266 364.38 712.139 361.23C722.448 356.362 723.88 351.494 727.317 352.353C730.181 353.212 729.608 356.935 734.762 366.385C738.485 373.544 751.085 375.549 749.94 377.84C748.508 380.703 731.612 381.562 729.894 381.849C670.329 391.585 601.887 408.767 582.987 410.486C581.555 410.772 577.832 411.058 573.25 412.49C568.668 413.922 567.523 415.068 566.95 414.495Z" fill="#EC92AD"/>
|
||||
<path d="M280.581 628.703C283.158 630.994 281.44 639.585 278.576 640.444C276.572 641.017 272.849 638.726 260.821 618.68C248.221 597.775 242.78 590.902 231.039 568.852C220.443 548.233 214.43 534.201 210.707 529.047C210.707 529.047 200.684 512.437 195.243 494.682C194.384 491.819 194.098 488.669 194.098 488.669C194.098 486.378 193.811 483.8 194.384 482.941C196.388 480.364 233.616 498.691 267.981 522.746C277.431 529.619 298.909 545.37 305.495 546.515C305.781 546.801 306.641 546.802 307.213 547.661C309.504 550.524 300.34 556.824 297.19 566.275C289.745 586.893 289.745 605.221 287.167 610.375C283.731 616.962 281.44 621.257 280.581 621.257C279.722 621.257 279.435 606.653 279.435 606.653C279.435 606.653 268.84 608.944 267.408 606.939C263.971 601.498 285.736 584.889 282.586 579.448C280.295 575.438 265.976 580.879 264.831 578.016C263.112 574.579 281.726 568.279 281.726 559.115C281.726 546.515 245.644 540.788 227.316 521.315C226.743 520.456 225.598 519.31 224.739 519.596C221.303 521.315 244.785 573.72 255.667 595.484C267.408 618.394 269.126 614.957 273.994 622.689C274.567 623.548 275.713 625.553 278.004 627.271C279.435 628.13 280.008 628.13 280.581 628.703Z" fill="#EC92AD"/>
|
||||
<path d="M1540.03 1958.88C1518.27 1990.95 1454.98 2031.9 1419.76 2052.52C1403.15 2062.26 1385.11 2059.39 1360.48 2063.4C1254.24 2080.58 1148.57 2057.96 1062.08 2032.19C1041.18 2025.89 989.344 1986.37 967.008 1994.67C934.934 2008.99 939.516 2047.65 923.193 2077.43C912.311 2100.34 883.674 2183.68 874.797 2202.29C852.174 2249.83 823.823 2298.8 796.618 2342.9C775.713 2376.98 722.162 2440.55 662.311 2407.05C634.247 2391.3 635.679 2369.53 631.383 2346.91C631.097 2346.05 631.097 2333.74 630.238 2333.74C627.088 2333.74 627.088 2333.74 623.365 2333.74C616.11 2342.52 608.76 2351.3 601.315 2360.08C559.791 2398.17 497.363 2389 482.758 2332.02C473.021 2294.5 491.062 2256.7 501.372 2232.07C520.654 2172.7 539.936 2113.33 559.218 2053.95C569.528 2004.7 546.045 1964.61 532.586 1932.25C507.385 1870.39 500.226 1796.79 474.739 1733.79C464.144 1707.16 443.811 1693.41 435.793 1674.51C426.343 1651.89 405.438 1559.11 388.829 1551.09C335.564 1527.03 321.246 1607.22 290.604 1618.1C228.176 1640.44 200.971 1552.52 196.961 1507.27C145.129 1490.09 106.183 1412.2 131.097 1340.32C153.147 1277.61 199.539 1232.36 287.454 1234.08C295.186 1224.34 307.214 1219.47 315.518 1210.6L332.7 1141.87C341.673 1125.26 350.551 1108.55 359.333 1091.75C371.647 1073.71 393.983 1050.8 412.311 1038.77C422.811 1033.62 433.216 1028.37 443.525 1023.02C437.798 1021.69 432.643 1020.07 428.061 1018.16C438.943 1015.01 448.68 1014.15 456.698 1014.15C497.076 1013.86 513.399 1036.77 557.786 1035.34C577.832 1034.48 577.832 1029.61 619.642 1017.87C682.643 1000.11 714.144 991.237 746.217 998.969C783.445 1007.85 777.431 1027.03 841.865 1056.24C875.656 1071.42 899.711 1082.02 925.484 1073.14C950.685 1064.26 968.726 1040.21 975.599 1031.04C985.908 1017.01 991.349 1004.7 993.067 1000.97C993.067 1000.97 996.217 994.101 1003.66 980.642C1015.4 959.737 1037.45 923.941 1074.68 874.399C1114.2 822.566 1204.41 809.107 1267.7 806.529C1285.64 817.793 1303.59 829.057 1321.53 840.321C1379.38 882.99 1437.23 942.841 1477.6 1002.69C1548.05 1107.22 1598.74 1224.34 1630.81 1368.39C1677.78 1579.44 1628.23 1830.3 1540.03 1958.88Z" fill="url(#paint1_linear_2718_972)"/>
|
||||
<path d="M402.861 438.549C404.579 468.618 379.665 549.946 374.797 567.988C373.651 568.274 372.219 568.56 370.501 568.847C366.778 569.133 363.056 568.274 359.906 565.983L359.333 565.697C352.746 518.159 378.52 470.336 402.861 438.549Z" fill="#EC92AD"/>
|
||||
<path d="M339.574 488.086C332.987 507.559 322.392 530.469 315.805 549.942C315.423 550.514 315.232 551.183 315.232 551.946C304.064 604.638 301.2 731.213 312.369 785.337C325.351 839.938 338.333 894.539 351.315 949.14C358.761 990.664 306.355 1080.3 284.018 1085.17C284.591 1084.31 287.455 1071.42 290.032 1060.82C291.368 1054.91 292.227 1048.99 292.609 1043.07C295.091 1005.46 297.478 967.849 299.769 930.24C300.914 915.921 299.482 901.603 296.046 887.571C287.836 854.543 279.723 821.515 271.704 788.487C257.672 716.036 278.864 597.479 299.769 546.219C308.073 525.887 338.715 488.086 339.574 488.086Z" fill="#EC92AD"/>
|
||||
<path d="M576.114 529.043C626.228 550.521 648.565 618.104 679.207 660.2C716.148 710.887 757.385 762.434 788.6 817.989C792.895 830.589 828.119 899.318 841.864 921.082C875.083 977.783 907.443 1088.89 907.443 1174.23C906.297 1173.66 816.377 968.047 815.232 968.047C820.386 1070.57 800.054 1107.22 800.054 1106.08C784.59 1036.49 782.013 973.774 760.535 921.082C705.266 785.63 650.57 646.741 576.114 529.043Z" fill="#EC92AD"/>
|
||||
<path d="M365.346 604.062C379.665 618.667 383.674 682.241 390.261 707.155C400.761 742.092 411.165 776.934 421.475 811.68C441.807 858.358 476.744 885.85 474.739 945.987C473.212 945.987 471.589 945.987 469.871 945.987C386.824 913.914 351.314 728.06 365.346 604.062Z" fill="#EC92AD"/>
|
||||
<path d="M1042.9 808.247C1042.32 854.925 992.495 949.427 971.876 983.791C968.44 984.364 934.362 971.763 931.212 960.309C928.348 949.14 987.054 802.233 994.786 795.646C1009.1 800.515 1025.71 807.101 1042.9 808.247Z" fill="#EC92AD"/>
|
||||
<path d="M1320.39 1447.71C1244.21 1448.28 1146.85 1396.45 1093.01 1365.23C1091.01 1364.09 1089.86 1361.51 1090.72 1359.22C1091.29 1356.93 1092.15 1354.64 1092.72 1352.63C1093.58 1350.34 1095.59 1349.2 1097.88 1349.2C1132.82 1350.63 1145.42 1371.25 1169.18 1381.84C1208.42 1399.6 1265.12 1417.64 1316.95 1419.36C1319.81 1419.36 1322.39 1417.07 1322.39 1413.92C1322.96 1338.32 1314.66 1270.73 1293.75 1219.47C1293.56 1219.28 1293.47 1219.09 1293.47 1218.9C1292.04 1212.6 1288.31 1206.59 1286.6 1200.29C1286.6 1199.71 1286.02 1198.85 1285.45 1198.28C1281.44 1193.99 1274.57 1194.27 1270.85 1188.26C1267.12 1182.24 1294.04 1155.33 1297.76 1137.57C1311.51 1071.42 1246.22 968.899 1208.42 935.394C1203.83 936.826 1202.69 937.399 1198.11 938.831C1195.24 956.299 1185.51 962.027 1177.2 974.341C1144.84 1020.73 1128.23 1072.28 1049.77 1072.57C1047.76 1072.57 1046.33 1074.57 1044.9 1076.29C1022.28 1106.64 994.785 1132.99 973.88 1153.89C920.616 1207.44 839.001 1343.47 764.831 1361.51C712.712 1374.4 647.993 1358.07 584.992 1367.81C551.773 1372.97 421.188 1389.29 392.552 1383.56C389.974 1382.99 388.256 1380.41 388.542 1377.83C388.829 1372.97 386.824 1369.53 392.552 1366.67C416.32 1360.94 437.511 1370.68 458.416 1366.38C489.153 1359.51 519.89 1352.73 550.627 1346.05C550.627 1346.05 550.723 1346.05 550.914 1346.05C633.101 1332.3 708.13 1339.17 783.731 1324.86C785.45 1324.57 793.468 1316.55 794.614 1315.12C818.669 1291.92 830.696 1278.46 847.305 1261C871.074 1236.08 896.275 1212.03 917.752 1185.11C946.676 1149.31 968.153 1128.69 1016.55 1075.14C1019.7 1071.71 1021.42 1069.99 1021.13 1067.98C1021.13 1066.27 1021.13 1063.97 1017.69 1062.26C982.472 1044.21 1000.51 990.95 1011.39 960.308C1025.71 920.217 1117.92 849.197 1181.78 863.229C1267.98 882.703 1306.35 937.685 1330.12 1021.02C1335.85 1040.78 1347.02 1070.85 1341.29 1098.91C1341.1 1099.1 1341.01 1099.29 1341.01 1099.48C1336.42 1111.51 1334.42 1128.69 1329.84 1140.43C1329.84 1140.63 1329.84 1140.72 1329.84 1140.72C1323.82 1162.77 1321.25 1178.24 1305.5 1191.69C1303.49 1193.41 1302.92 1196.28 1304.35 1198.28C1335.85 1252.98 1349.31 1322.57 1351.89 1402.18C1353.61 1446.56 1349.88 1510.71 1357.61 1547.94C1357.9 1549.66 1359.33 1551.09 1360.76 1551.66C1426.63 1580.3 1593.87 1723.48 1613.34 1789.92C1613.53 1790.87 1613.53 1791.73 1613.34 1792.5C1608.76 1811.97 1602.17 1830.3 1595.59 1848.05C1595.4 1848.62 1595.01 1849.2 1594.44 1849.77C1549.77 1898.74 1458.99 1955.73 1360.76 1912.49C1304.92 1887.86 1267.41 1854.35 1229.61 1809.68C1203.83 1779.32 1178.63 1744.96 1153.72 1713.17C1112.2 1660.48 1078.98 1602.92 1039.75 1547.36C1022.56 1523.31 1006.53 1495.25 988.199 1471.19C988.199 1471 988.104 1470.81 987.913 1470.62C975.885 1458.21 963.953 1445.8 952.117 1433.39C948.966 1427.66 950.971 1426.23 954.121 1423.37C954.885 1422.79 955.744 1422.41 956.698 1422.22C977.317 1418.79 998.508 1448.85 1008.53 1462.03C1008.53 1462.22 1008.63 1462.31 1008.82 1462.31C1027.43 1481.21 1042.9 1508.13 1060.08 1529.61C1060.27 1529.8 1060.36 1529.9 1060.36 1529.9C1076.4 1554.81 1092.15 1572.57 1108.47 1597.48C1170.62 1685.68 1238.77 1803.67 1330.12 1861.51C1354.46 1876.98 1403.43 1909.05 1445.82 1900.46C1493.07 1891.01 1524.57 1870.1 1557.5 1849.77C1573.25 1839.75 1578.69 1819.13 1569.53 1802.52C1521.13 1716.32 1422.91 1613.8 1332.41 1587.46C1330.12 1586.88 1328.69 1584.88 1328.41 1582.59C1327.45 1539.44 1326.5 1496.2 1325.54 1452.86C1325.54 1450 1323.25 1447.71 1320.39 1447.71Z" fill="#EC92AD"/>
|
||||
<path d="M562.082 1052.23C664.889 1048.51 591.005 1225.2 519.986 1200.86C472.162 1184.25 501.945 1104.64 521.418 1078.87C531.441 1065.98 547.191 1060.82 562.082 1052.23Z" fill="#EC92AD"/>
|
||||
<path d="M407.443 1066.27C486.194 1071.14 421.188 1213.46 365.346 1194.56C292.895 1169.93 373.365 1082.59 407.443 1066.27Z" fill="#EC92AD"/>
|
||||
<path d="M656.011 1106.94C689.516 1129.85 715.575 1222.06 691.807 1266.44C675.484 1270.17 603.319 1289.93 588.714 1271.02C588.714 1268.92 588.714 1266.82 588.714 1264.72C644.842 1243.53 657.729 1182.25 656.011 1106.94Z" fill="#EC92AD"/>
|
||||
<path d="M491.921 1117.81C489.058 1157.33 478.748 1214.6 474.739 1239.8C471.303 1260.14 481.039 1286.77 473.021 1300.8C463.284 1306.91 453.452 1313.11 443.525 1319.41C407.442 1314.55 398.565 1267.01 398.279 1227.2C424.911 1215.46 484.762 1149.88 491.921 1117.81Z" fill="#EC92AD"/>
|
||||
<path d="M201.256 1280.47C223.307 1279.9 256.812 1294.79 265.403 1308.53C187.224 1307.96 170.901 1389.29 159.16 1456.87C157.633 1456.3 156.105 1455.82 154.578 1455.44C106.755 1371.25 146.846 1330.87 201.256 1280.47Z" fill="#EC92AD"/>
|
||||
<path d="M398.279 1311.69C410.307 1315.41 418.611 1316.55 429.78 1324.57C434.075 1327.72 432.644 1330.59 428.062 1335.74C406.584 1354.07 376.229 1365.81 351.315 1363.23C336.71 1361.8 315.805 1360.65 306.355 1366.95C304.064 1368.1 304.35 1370.1 304.637 1371.82C312.082 1413.06 373.938 1518.16 357.329 1551.38C352.46 1551.66 351.028 1551.66 346.446 1551.66C326.401 1522.17 257.672 1407.62 292.036 1352.35C309.505 1324 371.933 1331.73 398.279 1311.69Z" fill="#EC92AD"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_2718_972" x1="36.3572" y1="2416.52" x2="36.3572" y2="806.412" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#F1D0DB"/>
|
||||
<stop offset="1" stop-color="#F1D0DB"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_2718_972" x1="36.3572" y1="2416.52" x2="36.3572" y2="806.412" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#F1D0DB"/>
|
||||
<stop offset="1" stop-color="#F1D0DB"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_2718_972">
|
||||
<rect width="1500" height="1500" rx="250" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB |
@@ -1,63 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { useDark, useToggle } from '@vueuse/core'
|
||||
import { RouterLink, RouterView } from 'vue-router'
|
||||
|
||||
const isDark = useDark()
|
||||
const toggleDark = useToggle(isDark)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div mx-auto max-w-screen-lg flex flex-col gap-2 p-4>
|
||||
<header flex flex-row items-center justify-between>
|
||||
<h1 text-2xl>
|
||||
Real-time Audio Playground
|
||||
</h1>
|
||||
<div flex flex-row items-center gap-2>
|
||||
<button text-lg @click="() => toggleDark()">
|
||||
<div v-if="isDark" i-solar:moon-stars-bold-duotone />
|
||||
<div v-else i-solar:sun-bold />
|
||||
</button>
|
||||
<a href="https://github.com/moeru-ai/airi/tree/main/apps/realtime-audio">
|
||||
<div i-simple-icons:github />
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
<nav bg="neutral-100 dark:neutral-800" w-fit flex items-center of-hidden rounded-lg>
|
||||
<RouterLink
|
||||
to="/" px-3 py-2 bg="hover:neutral-200 dark:hover:neutral-700"
|
||||
transition="all duration-250 ease-in-out"
|
||||
>
|
||||
<h1>ElevenLabs</h1>
|
||||
</RouterLink>
|
||||
<div bg="neutral-200 dark:neutral-600" h="1lh" w="0.5" />
|
||||
<RouterLink
|
||||
to="/microsoft" px-3 py-2 bg="hover:neutral-200 dark:hover:neutral-700"
|
||||
transition="all duration-250 ease-in-out"
|
||||
>
|
||||
<h1>Microsoft / Azure</h1>
|
||||
</RouterLink>
|
||||
</nav>
|
||||
<RouterView />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
html,
|
||||
body,
|
||||
#app {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overscroll-behavior: none;
|
||||
}
|
||||
|
||||
html {
|
||||
background: #fff;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
html.dark {
|
||||
background: #121212;
|
||||
color-scheme: dark;
|
||||
}
|
||||
</style>
|
||||
@@ -1,114 +0,0 @@
|
||||
import type { Ref } from 'vue'
|
||||
|
||||
import { ref } from 'vue'
|
||||
|
||||
export interface HandlerContext<T> {
|
||||
data: T
|
||||
itemsToBeProcessed: () => number
|
||||
emit: (eventName: string, ...params: any[]) => void
|
||||
}
|
||||
|
||||
// FIXME: should be exported?
|
||||
export interface Events<T> {
|
||||
add: Array<(payload: T) => void>
|
||||
pick: Array<(payload: T) => void>
|
||||
processing: Array<(payload: T, handler: (param: HandlerContext<T>) => Promise<any>) => void>
|
||||
error: Array<(payload: T, error: Error, handler: (param: HandlerContext<T>) => Promise<any>) => void>
|
||||
processed: Array<<R>(payload: T, result: R, handler: (param: HandlerContext<T>) => Promise<any>) => void>
|
||||
done: Array<(payload: T) => void>
|
||||
}
|
||||
|
||||
export function useQueue<T>(options: {
|
||||
handlers: Array<(ctx: HandlerContext<T>) => Promise<void>>
|
||||
}) {
|
||||
const queue = ref<T[]>([]) as Ref<T[]>
|
||||
const isProcessing = ref(false)
|
||||
const internalEventHandler: Events<T> = {
|
||||
add: [],
|
||||
pick: [],
|
||||
processing: [],
|
||||
error: [],
|
||||
processed: [],
|
||||
done: [],
|
||||
}
|
||||
const internalHandlerEventHandler: Record<string, Array<(...params: any[]) => void>> = {}
|
||||
|
||||
function on<E extends keyof Events<T>>(eventName: E, handler: Events<T>[E][number]) {
|
||||
internalEventHandler[eventName].push(handler as any)
|
||||
}
|
||||
|
||||
function emit<E extends keyof Events<T>>(eventName: E, ...params: Parameters<Events<T>[E][number]>) {
|
||||
const handlers = internalEventHandler[eventName] as Events<T>[E]
|
||||
handlers.forEach((handler) => {
|
||||
(handler as any)(...params)
|
||||
})
|
||||
}
|
||||
|
||||
function onHandlerEvent(eventName: string, handler: (...params: any[]) => void) {
|
||||
internalHandlerEventHandler[eventName] = internalHandlerEventHandler[eventName] || []
|
||||
internalHandlerEventHandler[eventName].push(handler)
|
||||
}
|
||||
|
||||
function emitHandlerEvent(eventName: string, ...params: any[]) {
|
||||
const handlers = internalHandlerEventHandler[eventName] || []
|
||||
handlers.forEach((handler) => {
|
||||
handler(...params)
|
||||
})
|
||||
}
|
||||
|
||||
async function add(payload: T) {
|
||||
queue.value.push(payload)
|
||||
emit('add', payload)
|
||||
}
|
||||
|
||||
function pick() {
|
||||
const payload = queue.value.shift()
|
||||
if (!payload)
|
||||
return
|
||||
|
||||
emit('pick', payload)
|
||||
return payload
|
||||
}
|
||||
|
||||
async function handleItem() {
|
||||
if (isProcessing.value)
|
||||
return
|
||||
|
||||
const payload = pick()
|
||||
if (!payload)
|
||||
return
|
||||
|
||||
isProcessing.value = true
|
||||
|
||||
for (const handler of options.handlers) {
|
||||
emit('processing', payload, handler)
|
||||
try {
|
||||
const result = await handler({ data: payload, itemsToBeProcessed: () => queue.value.length, emit: emitHandlerEvent })
|
||||
emit('processed', payload, result, handler)
|
||||
}
|
||||
catch (err) {
|
||||
emit('error', payload, err as Error, handler)
|
||||
continue
|
||||
}
|
||||
}
|
||||
|
||||
isProcessing.value = false
|
||||
emit('done', payload)
|
||||
|
||||
// Process next item if any
|
||||
if (queue.value.length > 0)
|
||||
handleItem()
|
||||
}
|
||||
|
||||
on('add', handleItem)
|
||||
on('done', handleItem)
|
||||
|
||||
return {
|
||||
add,
|
||||
on,
|
||||
onHandlerEvent,
|
||||
queue,
|
||||
}
|
||||
}
|
||||
|
||||
export type UseQueueReturn<T> = ReturnType<typeof useQueue<T>>
|
||||
@@ -1,14 +0,0 @@
|
||||
import { createApp } from 'vue'
|
||||
import { createRouter, createWebHashHistory } from 'vue-router'
|
||||
import { routes } from 'vue-router/auto-routes'
|
||||
|
||||
import App from './App.vue'
|
||||
|
||||
import '@unocss/reset/tailwind.css'
|
||||
import 'uno.css'
|
||||
|
||||
const router = createRouter({ routes, history: createWebHashHistory() })
|
||||
|
||||
createApp(App)
|
||||
.use(router)
|
||||
.mount('#app')
|
||||
@@ -1,233 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import type { AssistantMessage, Message } from '@xsai/shared-chat'
|
||||
|
||||
import type {
|
||||
ElevenLabsWebSocketEventAudioOutput,
|
||||
ElevenLabsWebSocketEventCloseConnection,
|
||||
ElevenLabsWebSocketEventFinalOutput,
|
||||
ElevenLabsWebSocketEventInitializeConnection,
|
||||
ElevenLabsWebSocketEventSendText,
|
||||
} from '../types/elevenlabs'
|
||||
|
||||
import { useLocalStorage, useWebSocket } from '@vueuse/core'
|
||||
import { streamText } from '@xsai/stream-text'
|
||||
import { computed, ref, shallowRef, toRaw, watch } from 'vue'
|
||||
|
||||
import { useQueue } from '../composables/queue'
|
||||
|
||||
const baseUrl = useLocalStorage('settings/llm/baseUrl', 'https://openrouter.ai/api/v1/')
|
||||
const apiKey = useLocalStorage('settings/llm/apiKey', '')
|
||||
const model = useLocalStorage('settings/llm/model', 'openai/gpt-4o-mini')
|
||||
const sendingMessage = ref('')
|
||||
const messages = ref<Message[]>([])
|
||||
const streamingMessage = ref<AssistantMessage>({ role: 'assistant', content: '' })
|
||||
const audioContext = shallowRef<AudioContext>()
|
||||
|
||||
const voiceId = useLocalStorage('settings/voiceId', 'lNxY9WuCBCZCISASyJ55')
|
||||
const voiceApiKey = useLocalStorage('settings/voiceApiKey', '')
|
||||
const voiceWsUrl = computed(() => `wss://api.elevenlabs.io/v1/text-to-speech/${voiceId.value}/stream-input`)
|
||||
|
||||
const { send, data } = useWebSocket<string>(voiceWsUrl)
|
||||
|
||||
function sendPayload<T extends
|
||||
| ElevenLabsWebSocketEventInitializeConnection
|
||||
| ElevenLabsWebSocketEventSendText
|
||||
| ElevenLabsWebSocketEventCloseConnection,
|
||||
>(payload: T) {
|
||||
send(JSON.stringify(payload))
|
||||
}
|
||||
|
||||
async function handleChatSendMessage() {
|
||||
if (!audioContext.value) {
|
||||
audioContext.value = new AudioContext()
|
||||
}
|
||||
|
||||
streamingMessage.value = { role: 'assistant', content: '' }
|
||||
messages.value.push({ role: 'user', content: sendingMessage.value })
|
||||
messages.value.push(streamingMessage.value)
|
||||
|
||||
const response = streamText({
|
||||
baseURL: baseUrl.value,
|
||||
apiKey: apiKey.value,
|
||||
model: model.value,
|
||||
messages: messages.value.slice(0, messages.value.length - 1).map(msg => toRaw(msg)),
|
||||
})
|
||||
|
||||
for await (const text of response.textStream) {
|
||||
if (text !== '') {
|
||||
sendPayload({
|
||||
'xi-api-key': voiceApiKey.value,
|
||||
text,
|
||||
})
|
||||
}
|
||||
|
||||
streamingMessage.value.content += text
|
||||
}
|
||||
|
||||
sendPayload({
|
||||
'xi-api-key': voiceApiKey.value,
|
||||
'text': '',
|
||||
})
|
||||
}
|
||||
|
||||
const audioQueue = useQueue<{ audioBuffer: AudioBuffer }>({
|
||||
handlers: [
|
||||
(ctx) => {
|
||||
return new Promise((resolve) => {
|
||||
// Create an AudioBufferSourceNode
|
||||
const source = audioContext.value!.createBufferSource()
|
||||
source.buffer = ctx.data.audioBuffer
|
||||
|
||||
// Connect the source to the AudioContext's destination (the speakers)
|
||||
source.connect(audioContext.value!.destination)
|
||||
|
||||
// Start playing the audio
|
||||
source.start(0)
|
||||
source.onended = () => {
|
||||
resolve()
|
||||
}
|
||||
})
|
||||
},
|
||||
],
|
||||
})
|
||||
|
||||
watch(data, (data) => {
|
||||
if (!data)
|
||||
return
|
||||
|
||||
const parsedData = JSON.parse(data) as ElevenLabsWebSocketEventAudioOutput | ElevenLabsWebSocketEventFinalOutput
|
||||
|
||||
if (!parsedData)
|
||||
return
|
||||
if (!('audio' in parsedData))
|
||||
return
|
||||
if (parsedData.audio == null)
|
||||
return
|
||||
if (!audioContext.value)
|
||||
audioContext.value = new AudioContext()
|
||||
|
||||
const audioBase64 = parsedData.audio
|
||||
|
||||
// Convert base64 to array buffer
|
||||
const binaryString = atob(audioBase64)
|
||||
const bytes = new Uint8Array(binaryString.length)
|
||||
for (let i = 0; i < binaryString.length; i++) {
|
||||
bytes[i] = binaryString.charCodeAt(i)
|
||||
}
|
||||
|
||||
// Decode the audio data and play it
|
||||
audioContext.value.decodeAudioData(bytes.buffer, (buffer) => {
|
||||
audioQueue.add({ audioBuffer: buffer })
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div flex flex-col gap-2>
|
||||
<!-- <h2 text-xl>
|
||||
Storage
|
||||
</h2> -->
|
||||
<div flex="~ col" gap-2>
|
||||
<div flex flex-col gap-2>
|
||||
<div>
|
||||
<span text-neutral-500 dark:text-neutral-400>LLM</span>
|
||||
</div>
|
||||
<div grid grid-cols-2 gap-2>
|
||||
<label flex items-center gap-2>
|
||||
<span text-nowrap>
|
||||
Base URL
|
||||
</span>
|
||||
<input
|
||||
v-model="baseUrl"
|
||||
border="focus:primary-100 dark:focus:primary-400/50 2 solid neutral-200 dark:neutral-800"
|
||||
transition="all duration-200 ease-in-out" text="disabled:neutral-400 dark:disabled:neutral-600"
|
||||
cursor="disabled:not-allowed" w-full rounded-lg px-2 py-1 text-nowrap text-sm outline-none shadow="sm"
|
||||
bg="neutral-100 dark:neutral-800 focus:neutral-50 dark:focus:neutral-900"
|
||||
>
|
||||
</label>
|
||||
<label flex items-center gap-2>
|
||||
<span text-nowrap>
|
||||
API Key
|
||||
</span>
|
||||
<input
|
||||
v-model="apiKey"
|
||||
type="password"
|
||||
border="focus:primary-100 dark:focus:primary-400/50 2 solid neutral-200 dark:neutral-800"
|
||||
transition="all duration-200 ease-in-out" text="disabled:neutral-400 dark:disabled:neutral-600"
|
||||
cursor="disabled:not-allowed" w-full rounded-lg px-2 py-1 text-nowrap text-sm outline-none shadow="sm"
|
||||
bg="neutral-100 dark:neutral-800 focus:neutral-50 dark:focus:neutral-900"
|
||||
>
|
||||
</label>
|
||||
<label flex items-center gap-2>
|
||||
<span text-nowrap>
|
||||
Model
|
||||
</span>
|
||||
<input
|
||||
v-model="model"
|
||||
border="focus:primary-100 dark:focus:primary-400/50 2 solid neutral-200 dark:neutral-800"
|
||||
transition="all duration-200 ease-in-out" text="disabled:neutral-400 dark:disabled:neutral-600"
|
||||
cursor="disabled:not-allowed" w-full rounded-lg px-2 py-1 text-nowrap text-sm outline-none shadow="sm"
|
||||
bg="neutral-100 dark:neutral-800 focus:neutral-50 dark:focus:neutral-900"
|
||||
>
|
||||
</label>
|
||||
</div>
|
||||
<div>
|
||||
<span text-neutral-500 dark:text-neutral-400>ElevenLabs</span>
|
||||
</div>
|
||||
<div grid grid-cols-2 gap-2>
|
||||
<label flex items-center gap-2>
|
||||
<span text-nowrap>
|
||||
Voice ID
|
||||
</span>
|
||||
<input
|
||||
v-model="voiceId"
|
||||
border="focus:primary-100 dark:focus:primary-400/50 2 solid neutral-200 dark:neutral-800"
|
||||
transition="all duration-200 ease-in-out" text="disabled:neutral-400 dark:disabled:neutral-600"
|
||||
cursor="disabled:not-allowed" w-full rounded-lg px-2 py-1 text-nowrap text-sm outline-none shadow="sm"
|
||||
bg="neutral-100 dark:neutral-800 focus:neutral-50 dark:focus:neutral-900"
|
||||
>
|
||||
</label>
|
||||
<label flex items-center gap-2>
|
||||
<span text-nowrap>
|
||||
ElevenLabs API Key
|
||||
</span>
|
||||
<input
|
||||
v-model="voiceApiKey"
|
||||
type="password"
|
||||
border="focus:primary-100 dark:focus:primary-400/50 2 solid neutral-200 dark:neutral-800"
|
||||
transition="all duration-200 ease-in-out" text="disabled:neutral-400 dark:disabled:neutral-600"
|
||||
cursor="disabled:not-allowed" w-full rounded-lg px-2 py-1 text-nowrap text-sm outline-none shadow="sm"
|
||||
bg="neutral-100 dark:neutral-800 focus:neutral-50 dark:focus:neutral-900"
|
||||
>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<textarea
|
||||
v-model="sendingMessage"
|
||||
border="focus:primary-100 dark:focus:primary-400/50 2 solid neutral-200 dark:neutral-800"
|
||||
transition="all duration-200 ease-in-out" text="disabled:neutral-400 dark:disabled:neutral-600"
|
||||
cursor="disabled:not-allowed" w-full rounded-lg px-2 py-1 text-nowrap text-sm outline-none shadow="sm"
|
||||
bg="neutral-100 dark:neutral-800 focus:neutral-50 dark:focus:neutral-900"
|
||||
/>
|
||||
</div>
|
||||
<button rounded-lg bg="blue-100 dark:blue-900" px-4 py-2 @click="handleChatSendMessage">
|
||||
Send
|
||||
</button>
|
||||
<div>
|
||||
<div v-for="(message, index) of messages" :key="index">
|
||||
<div v-if="message.role === 'user'">
|
||||
<span>
|
||||
{{ message.content }}
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="message.role === 'assistant'">
|
||||
<span>
|
||||
{{ message.content }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,254 +0,0 @@
|
||||
export interface ChunkLengthScheduleOptions {
|
||||
/**
|
||||
* This is an advanced setting that most users shouldn’t need to use.
|
||||
* It relates to our generation schedule.
|
||||
*
|
||||
* Our WebSocket service incorporates a buffer system designed to
|
||||
* optimize the Time To First Byte (TTFB) while maintaining high-quality
|
||||
* streaming.
|
||||
*
|
||||
* All text sent to the WebSocket endpoint is added to this buffer
|
||||
* and only when that buffer reaches a certain size is an audio
|
||||
* generation attempted. This is because our model provides higher
|
||||
* quality audio when the model has longer inputs, and can deduce more
|
||||
* context about how the text should be delivered.
|
||||
*
|
||||
* The buffer ensures smooth audio data delivery and is automatically
|
||||
* emptied with a final audio generation either when the stream is
|
||||
* closed, or upon sending a flush command. We have advanced settings
|
||||
* for changing the chunk schedule, which can improve latency at the
|
||||
* cost of quality by generating audio more frequently with smaller
|
||||
* text inputs.
|
||||
*
|
||||
* The chunk_length_schedule determines the minimum amount of text that
|
||||
* needs to be sent and present in our buffer before audio starts being
|
||||
* generated. This is to maximise the amount of context available to
|
||||
* the model to improve audio quality, whilst balancing latency of the
|
||||
* returned audio chunks.
|
||||
*
|
||||
* The default value for chunk_length_schedule is: [120, 160, 250, 290].
|
||||
*
|
||||
* This means that the first chunk of audio will not be generated until
|
||||
* you send text that totals at least 120 characters long. The next
|
||||
* chunk of audio will only be generated once a further 160 characters
|
||||
* have been sent. The third audio chunk will be generated after the
|
||||
* next 250 characters. Then the fourth, and beyond, will be generated
|
||||
* in sets of at least 290 characters.
|
||||
*
|
||||
* Customize this array to suit your needs. If you want to generate
|
||||
* audio more frequently to optimise latency, you can reduce the values
|
||||
* in the array. Note that setting the values too low may result in
|
||||
* lower quality audio. Please test and adjust as needed.
|
||||
*
|
||||
* Each item should be in the range 50-500.
|
||||
*/
|
||||
chunk_length_schedule?: number[]
|
||||
}
|
||||
|
||||
export interface PronunciationDictionaryLocatorOptions {
|
||||
/**
|
||||
* Optional list of pronunciation dictionary locators.
|
||||
*
|
||||
* If provided, these dictionaries will be used to modify pronunciation
|
||||
* of matching text. Must only be provided in the first message.
|
||||
*
|
||||
* Note: Pronunciation dictionary matches will only be respected
|
||||
* within a provided chunk.
|
||||
*/
|
||||
pronunciation_dictionary_locators?: Array<{
|
||||
dictionary_id: string
|
||||
version_id: string
|
||||
}>
|
||||
}
|
||||
|
||||
export interface VoiceSettings {
|
||||
/**
|
||||
* Defines the stability for voice settings.
|
||||
*
|
||||
* @default 0.5
|
||||
*/
|
||||
stability?: number
|
||||
/**
|
||||
* Defines the similarity boost for voice settings.
|
||||
*
|
||||
* @default 0.75
|
||||
*/
|
||||
similarity_boost?: number
|
||||
/**
|
||||
* Defines the style for voice settings. This parameter is
|
||||
* available on V2+ models.
|
||||
*
|
||||
* @default 0
|
||||
*/
|
||||
style?: number
|
||||
/**
|
||||
* Defines the use speaker boost for voice settings. This parameter is
|
||||
* available on V2+ models.
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
use_speaker_boost?: boolean
|
||||
/**
|
||||
* Controls the speed of the generated speech. Values range from 0.7
|
||||
* to 1.2, with 1.0 being the default speed.
|
||||
*
|
||||
* @default 1
|
||||
*/
|
||||
speed?: number
|
||||
}
|
||||
|
||||
export interface ElevenLabsWebSocketEventInitializeConnection {
|
||||
/**
|
||||
* The text to be sent to the API for audio generation. Should always
|
||||
* end with a single space string.
|
||||
*/
|
||||
'text': string
|
||||
/**
|
||||
* The voice settings field can be provided in the first
|
||||
* InitializeConnection message and then must either be
|
||||
* not provided or not changed.
|
||||
*/
|
||||
'voice_settings'?: VoiceSettings
|
||||
/**
|
||||
* The generator config field can be provided in the first
|
||||
* InitializeConnection message and then must either be not provided or
|
||||
* not changed.
|
||||
*/
|
||||
'generator_config'?: ChunkLengthScheduleOptions & PronunciationDictionaryLocatorOptions
|
||||
/**
|
||||
* Your ElevenLabs API key. This can only be included in the first
|
||||
* message and is not needed if present in the header.
|
||||
*/
|
||||
'xi-api-key'?: string
|
||||
/**
|
||||
* Your authorization bearer token. This can only be included in the
|
||||
* first message and is not needed if present in the header.
|
||||
*/
|
||||
'authorization'?: string
|
||||
}
|
||||
|
||||
export interface ElevenLabsWebSocketEventSendText {
|
||||
/**
|
||||
* The text to be sent to the API for audio generation. Should always
|
||||
* end with a single space string.
|
||||
*/
|
||||
text: string
|
||||
/**
|
||||
* This is an advanced setting that most users shouldn’t need to use.
|
||||
* It relates to our generation schedule.
|
||||
*
|
||||
* Use this to attempt to immediately trigger the generation of audio,
|
||||
* overriding the chunk_length_schedule. Unlike flush,
|
||||
* try_trigger_generation will only generate audio if our buffer
|
||||
* contains more than a minimum threshold of characters, this is to
|
||||
* ensure a higher quality response from our model.
|
||||
*
|
||||
* Note that overriding the chunk schedule to generate small amounts of
|
||||
* text may result in lower quality audio, therefore, only use this
|
||||
* parameter if you really need text to be processed immediately. We
|
||||
* generally recommend keeping the default value of false and adjusting
|
||||
* the chunk_length_schedule in the generation_config instead.
|
||||
*/
|
||||
try_trigger_generation?: boolean
|
||||
/**
|
||||
* The voice settings field can be provided in the first
|
||||
* InitializeConnection message and then must either be not
|
||||
* provided or not changed.
|
||||
*/
|
||||
voice_settings?: VoiceSettings
|
||||
/**
|
||||
* The generator config field can be provided in the first
|
||||
* InitializeConnection message and then must either be not provided or
|
||||
* not changed.
|
||||
*/
|
||||
generator_config?: ChunkLengthScheduleOptions
|
||||
/**
|
||||
* Flush forces the generation of audio. Set this value to true when you
|
||||
* have finished sending text, but want to keep the websocket connection
|
||||
* open.
|
||||
*
|
||||
* This is useful when you want to ensure that the last chunk of audio is
|
||||
* generated even when the length of text sent is smaller than the value
|
||||
* set in chunk_length_schedule (e.g. 120 or 50).
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
flush?: boolean
|
||||
}
|
||||
|
||||
export interface ElevenLabsWebSocketEventCloseConnection {
|
||||
/**
|
||||
* End the stream with an empty string
|
||||
*/
|
||||
text: string
|
||||
}
|
||||
|
||||
export interface ElevenLabsWebSocketEventAudioOutput {
|
||||
/**
|
||||
* A generated partial audio chunk, encoded using the selected output_format,
|
||||
* by default this is MP3 encoded as a base64 string.
|
||||
*/
|
||||
audio: string
|
||||
/**
|
||||
* Alignment information for the generated audio given the input normalized text sequence.
|
||||
*/
|
||||
normalizedAlignment?: {
|
||||
/**
|
||||
* A list of starting times (in milliseconds) for each character in the
|
||||
* normalized text as it corresponds to the audio. For instance, the
|
||||
* character ‘H’ starts at time 0 ms in the audio. Note these times are
|
||||
* relative to the returned chunk from the model, and not the full audio
|
||||
* response.
|
||||
*/
|
||||
char_start_times_ms?: number[]
|
||||
/**
|
||||
* A list of durations (in milliseconds) for each character in the
|
||||
* normalized text as it corresponds to the audio. For instance, the
|
||||
* character ‘H’ lasts for 3 ms in the audio. Note these times are
|
||||
* relative to the returned chunk from the model, and not the full
|
||||
* audio response.
|
||||
*/
|
||||
chars_durations_ms?: number[]
|
||||
/**
|
||||
* A list of characters in the normalized text sequence. For instance, the
|
||||
* first character is ‘H’. Note that this list may contain spaces,
|
||||
* punctuation, and other special characters. The length of this list should
|
||||
* be the same as the lengths of char_start_times_ms and chars_durations_ms.
|
||||
*/
|
||||
chars?: string[]
|
||||
}
|
||||
/**
|
||||
* Alignment information for the generated audio given the input text sequence.
|
||||
*/
|
||||
alignment?: {
|
||||
/**
|
||||
* A list of starting times (in milliseconds) for each character in the text
|
||||
* as it corresponds to the audio. For instance, the character ‘H’ starts at
|
||||
* time 0 ms in the audio. Note these times are relative to the returned
|
||||
* chunk from the model, and not the full audio response.
|
||||
*/
|
||||
char_start_times_ms?: number[]
|
||||
/**
|
||||
* A list of durations (in milliseconds) for each character in the text as
|
||||
* it corresponds to the audio. For instance, the character ‘H’ lasts for 3
|
||||
* ms in the audio. Note these times are relative to the returned chunk from
|
||||
* the model, and not the full audio response.
|
||||
*/
|
||||
chars_durations_ms?: number[]
|
||||
/**
|
||||
* A list of characters in the text sequence. For instance, the first character
|
||||
* is ‘H’. Note that this list may contain spaces, punctuation, and other
|
||||
* special characters. The length of this list should be the same as the
|
||||
* lengths of char_start_times_ms and chars_durations_ms.
|
||||
*/
|
||||
chars?: string[]
|
||||
}
|
||||
}
|
||||
|
||||
export interface ElevenLabsWebSocketEventFinalOutput {
|
||||
/**
|
||||
* Indicates if the generation is complete. If set to True, audio will be
|
||||
* null.
|
||||
*/
|
||||
isFinal?: boolean
|
||||
}
|
||||
@@ -1,28 +0,0 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ESNext",
|
||||
"lib": [
|
||||
"ESNext",
|
||||
"DOM",
|
||||
"DOM.Iterable",
|
||||
"DOM.AsyncIterable",
|
||||
"WebWorker"
|
||||
],
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"types": [
|
||||
"vite/client",
|
||||
"unplugin-vue-router/client"
|
||||
],
|
||||
"esModuleInterop": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"isolatedModules": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"skipLibCheck": true
|
||||
},
|
||||
"include": [
|
||||
"src/**/*.ts",
|
||||
"src/**/*.d.ts",
|
||||
"src/**/*.mts"
|
||||
]
|
||||
}
|
||||
@@ -1,35 +0,0 @@
|
||||
import {
|
||||
defineConfig,
|
||||
presetAttributify,
|
||||
presetIcons,
|
||||
presetTypography,
|
||||
presetWebFonts,
|
||||
presetWind3,
|
||||
transformerDirectives,
|
||||
transformerVariantGroup,
|
||||
} from 'unocss'
|
||||
|
||||
import { presetWebFontsFonts } from '../../uno.config'
|
||||
|
||||
export default defineConfig({
|
||||
presets: [
|
||||
presetWind3(),
|
||||
presetAttributify(),
|
||||
presetTypography(),
|
||||
presetWebFonts({
|
||||
fonts: presetWebFontsFonts('fontsource'),
|
||||
timeouts: {
|
||||
warning: 5000,
|
||||
failure: 10000,
|
||||
},
|
||||
}),
|
||||
presetIcons({
|
||||
scale: 1.2,
|
||||
}),
|
||||
],
|
||||
transformers: [
|
||||
transformerDirectives(),
|
||||
transformerVariantGroup(),
|
||||
],
|
||||
safelist: 'prose prose-sm m-auto text-left'.split(' '),
|
||||
})
|
||||
@@ -1,21 +0,0 @@
|
||||
import { resolve } from 'node:path'
|
||||
|
||||
import Vue from '@vitejs/plugin-vue'
|
||||
import Unocss from 'unocss/vite'
|
||||
import VueRouter from 'unplugin-vue-router/vite'
|
||||
|
||||
import { defineConfig } from 'vite'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
// https://github.com/posva/unplugin-vue-router
|
||||
VueRouter({
|
||||
extensions: ['.vue', '.md'],
|
||||
dts: resolve(import.meta.dirname, 'src', 'typed-router.d.ts'),
|
||||
}),
|
||||
Vue(),
|
||||
// https://github.com/antfu/unocss
|
||||
// see uno.config.ts for config
|
||||
Unocss(),
|
||||
],
|
||||
})
|
||||
Reference in New Issue
Block a user