⬇️ [Node] Downgrade to LTS

.changeset/few-clouds-boil.md

@@ -0,0 +1,6 @@
+---
+"website": patch
+"earwurm": patch
+---
+
+Downgrade to Node LTS.

.nvmrc

@@ -1 +1 @@
-22.4
+20.16

app/website/package.json

@@ -12,8 +12,8 @@
     "earwurm"
   ],
   "engines": {
-    "node": ">=22.4.0",
-    "pnpm": ">=9.6.0"
+    "node": ">=20.16.0",
+    "pnpm": ">=9.7.1"
   },
   "scripts": {
     "clean": "rm -rf dist && rm -rf *.tsbuildinfo",
@@ -26,17 +26,17 @@
     "type-check": "vue-tsc --noEmit -p tsconfig.json --composite false"
   },
   "dependencies": {
-    "beeftools": "^0.1.6",
+    "beeftools": "^0.1.7",
     "earwurm": "workspace:*",
-    "vue": "^3.4.34"
+    "vue": "^3.4.38"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^2.24.0",
+    "@antfu/eslint-config": "^2.26.0",
     "@earwurm/types": "workspace:*",
-    "@vitejs/plugin-vue": "^5.1.1",
-    "eslint": "^9.8.0",
+    "@vitejs/plugin-vue": "^5.1.2",
+    "eslint": "^9.9.0",
     "eslint-plugin-format": "^0.1.2",
-    "lightningcss": "^1.25.1",
+    "lightningcss": "^1.26.0",
     "vite-plugin-svg-sprite": "^0.5.2",
     "vue-tsc": "^2.0.29"
   }

app/website/src/components/SpeedSlider.vue

@@ -70,21 +70,15 @@ const stripes = computed(() => {
 <style scoped>
 .SpeedSlider {
   /* Webkit does not like `height > 100%` for inputs. */
-  --speed-slider-track-height: calc(
-    var(--row-height) - var(--action-padding) * 2
-  );
-  --speed-slider-progress-height: calc(
-    var(--row-height) - var(--action-padding) * 2 - var(--app-border-width) * 4
-  );
+  --speed-slider-track-height: calc(var(--row-height) - var(--action-padding) * 2);
+  --speed-slider-progress-height: calc(var(--row-height) - var(--action-padding) * 2 - var(--app-border-width) * 4);
 
   --speed-slider-track-stop-1: calc(50% - var(--app-border-width));
   --speed-slider-track-stop-2: calc(50% + var(--app-border-width));
 
   --slider-progress: 0;
   --slider-percent: calc(var(--slider-progress) * 1%);
-  --slider-offset: calc(
-    var(--row-height) * (0.5 - var(--slider-progress) / 100)
-  );
+  --slider-offset: calc(var(--row-height) * (0.5 - var(--slider-progress) / 100));
 
   display: grid;
   flex: 1 1 auto;
@@ -133,7 +127,6 @@ const stripes = computed(() => {
 
 @mixin input-track {
   height: var(--speed-slider-track-height);
-  /* prettier-ignore */
   background: linear-gradient(
     transparent 0% var(--speed-slider-track-stop-1),
     currentColor var(--speed-slider-track-stop-1) var(--speed-slider-track-stop-2),

app/website/src/components/VolumeManager.vue

@@ -57,15 +57,11 @@ const progress = computed(() => {
 
 <style scoped>
 .VolumeManager {
-  --volume-manager-track-height: calc(
-    var(--row-height) - var(--action-padding) * 2
-  );
+  --volume-manager-track-height: calc(var(--row-height) - var(--action-padding) * 2);
 
   --slider-progress: 0;
   --slider-percent: calc(var(--slider-progress) * 1%);
-  --slider-offset: calc(
-    var(--row-height) * (0.5 - var(--slider-progress) / 100)
-  );
+  --slider-offset: calc(var(--row-height) * (0.5 - var(--slider-progress) / 100));
 
   display: grid;
   align-items: center;

app/website/src/components/VolumeStack.vue

@@ -53,18 +53,14 @@ const progress = computed(() => {
 
 <style scoped>
 .VolumeStack {
-  --volume-stack-track-height: calc(
-    var(--row-height) - var(--action-padding) * 2
-  );
+  --volume-stack-track-height: calc(var(--row-height) - var(--action-padding) * 2);
 
   --volume-stack-track-stop-1: calc(50% - var(--app-border-width) / 2);
   --volume-stack-track-stop-2: calc(50% + var(--app-border-width) / 2);
 
   --slider-progress: 0;
   --slider-percent: calc(var(--slider-progress) * 1%);
-  --slider-offset: calc(
-    var(--row-height) * (0.5 - var(--slider-progress) / 100)
-  );
+  --slider-offset: calc(var(--row-height) * (0.5 - var(--slider-progress) / 100));
 
   position: relative;
   z-index: 1;
@@ -84,7 +80,6 @@ const progress = computed(() => {
 
 @mixin input-track {
   height: var(--volume-stack-track-height);
-  /* prettier-ignore */
   background: linear-gradient(
     transparent 0% var(--volume-stack-track-stop-1),
     var(--color-primary) var(--volume-stack-track-stop-1) var(--volume-stack-track-stop-2),

app/website/src/primitives/MotionSlideReveal.vue

@@ -22,12 +22,7 @@ defineProps<MotionSlideRevealProps>();
 .slideReveal-enter-active,
 .slideReveal-leave-active {
   --clip-path-x: 100%;
-  clip-path: polygon(
-    0 0,
-    var(--clip-path-x) 0,
-    var(--clip-path-x) 100%,
-    0 100%
-  );
+  clip-path: polygon(0 0, var(--clip-path-x) 0, var(--clip-path-x) 100%, 0 100%);
   transition: clip-path var(--duration-slow) var(--easing-cubic);
 
   /* Nested <LabelAction />
@@ -61,12 +56,7 @@ defineProps<MotionSlideRevealProps>();
 .slideReverse-enter-active,
 .slideReverse-leave-active {
   --clip-path-x: 0%;
-  clip-path: polygon(
-    var(--clip-path-x) 0,
-    100% 0,
-    100% 100%,
-    var(--clip-path-x) 100%
-  );
+  clip-path: polygon(var(--clip-path-x) 0, 100% 0, 100% 100%, var(--clip-path-x) 100%);
   transition: clip-path var(--duration-slow) var(--easing-cubic);
 
   /* Nested <LabelAction />

app/website/src/primitives/ProgressBar.vue

@@ -61,8 +61,7 @@ const progress = computed(() => calcProgress(value, {min, max, round: true}));
 
 .pattern-diagonal--animated {
   /* Custom class for unique duration and easing. */
-  animation: anim-svg-diagonal calc(var(--progress-pattern-speed, 0) * 1ms)
-    infinite steps(4);
+  animation: anim-svg-diagonal calc(var(--progress-pattern-speed, 0) * 1ms) infinite steps(4);
 }
 
 .Progress {

app/website/src/styles/design-system.css

@@ -43,9 +43,7 @@
   --app-border-width: 0.2rem;
 
   --app-max-width: 84rem;
-  --app-full-width-mobile: calc(
-    var(--breakpoint-mobile-begin) - var(--app-padding) * 2
-  );
+  --app-full-width-mobile: calc(var(--breakpoint-mobile-begin) - var(--app-padding) * 2);
 
   /* Paired with inset border gives the appearance of 4px padding. */
   --action-padding: 0.6rem;

app/website/src/styles/keyframes.css

@@ -3,8 +3,7 @@
     background-position: 0 0;
   }
   to {
-    background-position: var(--pattern-diagonal-size)
-      var(--pattern-diagonal-size);
+    background-position: var(--pattern-diagonal-size) var(--pattern-diagonal-size);
   }
 }
 
@@ -13,7 +12,6 @@
     background-position: 0 0;
   }
   to {
-    background-position: var(--pattern-halftone-size)
-      var(--pattern-halftone-size);
+    background-position: var(--pattern-halftone-size) var(--pattern-halftone-size);
   }
 }

app/website/src/styles/mixin.css

@@ -183,6 +183,5 @@
 @mixin pattern-halftone-dense {
   background-image: var(--pattern-halftone-dense-url);
   background-repeat: repeat;
-  background-size: var(--pattern-halftone-dense-size)
-    var(--pattern-halftone-dense-size);
+  background-size: var(--pattern-halftone-dense-size) var(--pattern-halftone-dense-size);
 }

app/website/src/styles/reset.css

@@ -3,9 +3,7 @@
  * https://github.com/elad2412/the-new-css-reset
 */
 
-*:where(
-    :not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)
-  ) {
+*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
   all: unset;
   display: revert;
 }
@@ -85,8 +83,7 @@ meter {
 /* --- Custom resets --- */
 
 html {
-  font-family: Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic',
-    source-sans-pro, sans-serif;
+  font-family: Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic', source-sans-pro, sans-serif;
   font-size: 10px;
   font-display: swap;
   line-height: 1;
@@ -105,8 +102,7 @@ body {
 }
 
 code {
-  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas,
-    'DejaVu Sans Mono', monospace;
+  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
 }
 
 svg:not(:root) {

app/website/src/views/HomeView.vue

@@ -49,10 +49,7 @@ const entries = [column1, column2];
 .Stacks {
   display: grid;
   gap: var(--app-spacing);
-  grid-template-columns: repeat(
-    auto-fit,
-    minmax(var(--app-full-width-mobile), 1fr)
-  );
+  grid-template-columns: repeat(auto-fit, minmax(var(--app-full-width-mobile), 1fr));
 
   @media (min-width: 1440px) and (min-height: 1280px) {
     gap: var(--row-height);

package.json

@@ -2,7 +2,7 @@
   "name": "earwurm-monorepo",
   "version": "0.0.0",
   "private": true,
-  "packageManager": "pnpm@9.6.0",
+  "packageManager": "pnpm@9.7.1",
   "description": "Monorepo for the Earwurm TypeScript project",
   "author": "Curtis Dulmage",
   "license": "ISC",
@@ -16,8 +16,8 @@
   },
   "keywords": [],
   "engines": {
-    "node": ">=22.4.0",
-    "pnpm": ">=9.6.0"
+    "node": ">=20.16.0",
+    "pnpm": ">=9.7.1"
   },
   "scripts": {
     "clean": "pnpm -r clean && rm -rf coverage",

pkg/earwurm/package.json

@@ -38,8 +38,8 @@
     "dist"
   ],
   "engines": {
-    "node": ">=22.4.0",
-    "pnpm": ">=9.6.0"
+    "node": ">=20.16.0",
+    "pnpm": ">=9.7.1"
   },
   "scripts": {
     "clean": "rm -rf dist",
@@ -48,18 +48,18 @@
     "start": "pnpm build:only --watch"
   },
   "peerDependencies": {
-    "beeftools": "^0.1.6",
-    "emitten": "^0.6.7"
+    "beeftools": "^0.1.7",
+    "emitten": "^0.6.8"
   },
   "dependencies": {
-    "beeftools": "^0.1.6",
-    "emitten": "^0.6.7"
+    "beeftools": "^0.1.7",
+    "emitten": "^0.6.8"
   },
   "devDependencies": {
     "@earwurm/helpers": "workspace:*",
     "@earwurm/mocks": "workspace:*",
     "@earwurm/types": "workspace:*",
-    "vite": "^5.3.5",
-    "vite-plugin-dts": "^3.9.1"
+    "vite": "^5.4.1",
+    "vite-plugin-dts": "^4.0.3"
   }
 }

pkg/helpers/package.json

@@ -4,8 +4,8 @@
   "private": true,
   "license": "ISC",
   "engines": {
-    "node": ">=22.4.0",
-    "pnpm": ">=9.6.0"
+    "node": ">=20.16.0",
+    "pnpm": ">=9.7.1"
   },
   "dependencies": {},
   "devDependencies": {

pkg/mocks/package.json

@@ -4,11 +4,11 @@
   "private": true,
   "license": "ISC",
   "engines": {
-    "node": ">=22.4.0",
-    "pnpm": ">=9.6.0"
+    "node": ">=20.16.0",
+    "pnpm": ">=9.7.1"
   },
   "dependencies": {
-    "beeftools": "^0.1.6"
+    "beeftools": "^0.1.7"
   },
   "devDependencies": {}
 }

pkg/types/package.json

@@ -4,8 +4,8 @@
   "private": true,
   "license": "ISC",
   "engines": {
-    "node": ">=22.4.0",
-    "pnpm": ">=9.6.0"
+    "node": ">=20.16.0",
+    "pnpm": ">=9.7.1"
   },
   "dependencies": {},
   "devDependencies": {}