Merge pull request BetterSEQTA#155 from BetterSEQTA/svelte

Change Settings UI to svelte under the hood

Author: SethBurkart123

.eslintrc.json

@@ -3,12 +3,12 @@
     "browser": true,
     "commonjs": true,
     "es2021": true,
-    "node": true // add this line to allow Node.js-specific globals
+    "node": true
   },
   "extends": "eslint:recommended",
   "parserOptions": {
     "ecmaVersion": "latest",
-    "sourceType": "module" // add this line to allow 'import' and 'export' statements
+    "sourceType": "module"
   },
   "rules": {
     // allow importing ts extensions

README.md

@@ -1,3 +1,8 @@
+# SVELTE BUILD - NOT STABLE
+Please don't use this in a production environment - it is quite buggy and is not fully completed as of yet. <br>
+
+# 
+
 <a href="https://chromewebstore.google.com/detail/betterseqta+/afdgaoaclhkhemfkkkonemoapeinchel">
   <img src="https://socialify.git.ci/betterseqta/betterseqta-plus/image?description=1&font=Inter&forks=1&issues=1&logo=data%3Aimage%2Fsvg%2Bxml%2C%253Csvg%20height%3D%27656pt%27%20fill%3D%27white%27%20preserveAspectRatio%3D%27xMidYMid%20meet%27%20viewBox%3D%270%200%20658%20656%27%20width%3D%27658pt%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%253E%253Cg%20transform%3D%27matrix(.1%200%200%20-.1%200%20656)%27%253E%253Cpath%20d%3D%27m2960%206499c-918-100-1726-561-2278-1299-196-262-374-609-475-925-171-533-203-1109-91-1655%20228-1115%201030-2032%202104-2408%20356-124%20680-177%201080-176%20269%201%20403%2014%20650%2064%20790%20159%201503%20624%201980%201290%20714%20998%20799%202342%20217%203420-488%20902-1361%201515-2382%201671-113%2017-196%2022-430%2024-159%202-328-1-375-6zm566-1443c476-99%20885-385%201134-791%20190-309%20282-696%20250-1045-22-240-73-420-180-635-78-156-159-275-274-401l-77-84h445%20446v-235-236l-1162%204-1163%203-100%2023c-449%20101-812%20337-1071%20697-77%20107-193%20335-233%20459-115%20358-116%20726-1%201078%20209%20644%20766%201101%201446%201187%20128%2016%20405%204%20540-24z%27%2F%253E%253Cpath%20d%3D%27m3065%204604c-250-36-396-89-576-209-280-187-470-478-535-821-25-135-16-395%2019-525%2095-351%20331-644%20651-806%2098-49%20225-93%20331-114%2092-18%20368-18%20460%200%20481%2095%20853%20444%20982%20921%2035%20129%2044%20389%2019%20524-36%20191-121%20387-228%20531-186%20249-476%20428-783%20485-65%2012-291%2021-340%2014z%27%2F%253E%253C%2Fg%253E%253C%2Fsvg%253E&name=1&owner=1&pattern=Signal&stargazers=1&theme=Dark" />
 </a>

package.json

@@ -1,16 +1,16 @@
 {
   "name": "betterseqtaplus",
-  "version": "3.3.2",
+  "version": "3.4.0",
   "type": "module",
   "description": "Enhance SEQTA Learn's usability and aesthetics! A fork of BetterSEQTA to continue development, while incorporating a plethora of new and improved features!",
   "browserslist": "> 0.5%, last 2 versions, not dead",
   "scripts": {
-    "dev": "MODE=chrome vite dev",
-    "dev:firefox": "MODE=firefox vite build --watch",
-    "build": "MODE=chrome vite build && MODE=firefox vite build",
-    "build:chrome": "MODE=chrome vite build",
-    "build:firefox": "MODE=firefox vite build",
-    "build:safari": "MODE=safari vite build",
+    "dev": "cross-env MODE=chrome vite dev",
+    "dev:firefox": "cross-env MODE=firefox vite build --watch",
+    "build": "cross-env MODE=chrome vite build && cross-env MODE=firefox vite build",
+    "build:chrome": "cross-env MODE=chrome vite build",
+    "build:firefox": "cross-env MODE=firefox vite build",
+    "build:safari": "cross-env MODE=safari vite build",
     "convert:safari": "xcrun safari-web-extension-converter dist/safari --project-location . --app-name $npm_package_name-safari",
     "release": "gh release create $npm_package_name@$npm_package_version ./dist/*.zip --generate-notes",
     "publish": "bun lib/publish.js --b",
@@ -31,66 +31,66 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@crxjs/vite-plugin": "^2.0.0-beta.23",
+    "@crxjs/vite-plugin": "2.0.0-beta.25",
     "@types/mime-types": "^2.1.4",
-    "@vitejs/plugin-react-swc": "^3.6.0",
-    "eslint": "^8.56.0",
+    "@vitejs/plugin-react-swc": "^3.7.0",
+    "cross-env": "^7.0.3",
+    "eslint": "^8.57.0",
     "glob": "^11.0.0",
     "mime-types": "^2.1.35",
-    "parcel": "^2.11.0",
-    "prettier": "^3.2.5",
+    "prettier": "^3.3.3",
     "process": "^0.11.10",
-    "sass": "^1.70.0",
+    "sass": "^1.78.0",
     "sass-loader": "^13.3.3",
     "semver": "^7.6.3",
-    "url": "^0.11.3"
+    "url": "^0.11.4"
   },
   "dependencies": {
     "@bedframe/cli": "^0.0.85",
-    "@blocknote/core": "^0.14.1",
-    "@blocknote/mantine": "^0.14.1",
-    "@blocknote/react": "^0.14.1",
+    "@codemirror/lang-css": "^6.3.0",
     "@codemirror/lang-less": "^6.0.2",
-    "@heroicons/react": "^2.1.3",
-    "@million/lint": "latest",
-    "@tailwindcss/forms": "^0.5.7",
+    "@codemirror/theme-one-dark": "^6.1.2",
+    "@sveltejs/vite-plugin-svelte": "^4.0.0",
+    "@tailwindcss/forms": "^0.5.9",
+    "@tsconfig/svelte": "^5.0.4",
+    "@types/chrome": "^0.0.270",
     "@types/color": "^3.0.6",
     "@types/dompurify": "^3.0.5",
-    "@types/lodash": "^4.17.4",
-    "@types/node": "^20.11.30",
-    "@types/react": "^18.2.55",
-    "@types/react-dom": "^18.2.19",
-    "@types/sortablejs": "^1.15.7",
+    "@types/lodash": "^4.17.7",
+    "@types/node": "^20.16.5",
+    "@types/react": "17",
+    "@types/react-dom": "17",
+    "@types/sortablejs": "^1.15.8",
     "@types/uuid": "^9.0.8",
     "@types/webextension-polyfill": "^0.10.7",
-    "@uiw/codemirror-extensions-color": "^4.21.25",
-    "@uiw/codemirror-theme-github": "^4.21.25",
-    "@uiw/react-codemirror": "^4.21.25",
-    "autoprefixer": "^10.4.17",
+    "@uiw/codemirror-extensions-color": "^4.23.3",
+    "@uiw/codemirror-theme-github": "^4.23.3",
+    "@vitejs/plugin-react": "^4.3.1",
+    "autoprefixer": "^10.4.20",
     "classnames": "^2.5.1",
+    "codemirror": "^6.0.1",
     "color": "^4.2.3",
-    "dompurify": "^3.0.8",
-    "framer-motion": "^11.0.25",
+    "dompurify": "^3.1.6",
+    "embla-carousel-autoplay": "^8.3.1",
+    "embla-carousel-svelte": "^8.3.1",
+    "fuse.js": "^7.0.0",
+    "idb": "^8.0.0",
     "kolorist": "^1.8.0",
     "localforage": "^1.10.0",
     "lodash": "^4.17.21",
-    "million": "latest",
-    "motion": "^10.17.0",
+    "million": "^3.1.11",
+    "motion": "^10.18.0",
+    "postcss": "^8.4.45",
     "publish-browser-extension": "^2.2.1",
-    "react": "^18.2.0",
-    "react-best-gradient-color-picker": "3.0.5",
-    "react-dom": "^18.2.0",
-    "react-error-boundary": "^4.0.13",
-    "react-router-dom": "^6.22.0",
-    "react-toastify": "^10.0.5",
-    "rimraf": "^5.0.5",
-    "sortablejs": "^1.15.2",
-    "swiper": "latest",
-    "tailwindcss": "^3.4.1",
-    "ts-loader": "^9.5.1",
-    "typescript": "^5.3.3",
+    "react": "17",
+    "react-best-gradient-color-picker": "^3.0.10",
+    "react-dom": "17",
+    "sortablejs": "^1.15.3",
+    "svelte": "^5.1.9",
+    "tailwindcss": "^3.4.11",
+    "typescript": "^5.6.2",
     "uuid": "^9.0.1",
-    "vite": "^5.4.2",
+    "vite": "^5.4.4",
     "webextension-polyfill": "^0.10.0"
   }
 }

postcss.config.js

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}