🛠️ [Dependency] Update packages and switch to eslint-config-love (#82)

beefchimi · Apr 28, 2024 · c2f5c21 · c2f5c21
1 parent 8c75cbc
commit c2f5c21
Show file tree

Hide file tree

Showing 51 changed files with 4,555 additions and 4,490 deletions.
diff --git a/.changeset/chatty-pugs-refuse.md b/.changeset/chatty-pugs-refuse.md
@@ -0,0 +1,6 @@
+---
+"website": minor
+"earwurm": minor
+---
+
+Switched from local utilities package to beeftools.
diff --git a/.eslintrc b/.eslintrc
@@ -1,17 +1,17 @@
 {
   "env": {
     "browser": true,
-    "es2022": true
+    "es2022": true,
   },
-  "extends": ["standard-with-typescript", "plugin:prettier/recommended"],
+  "extends": ["love", "plugin:prettier/recommended"],
   "parserOptions": {
     "ecmaVersion": "latest",
     "sourceType": "module",
-    "project": "./tsconfig.json"
+    "project": "./tsconfig.json",
   },
   "rules": {
     "no-console": "error",
     "@typescript-eslint/explicit-function-return-type": "off",
-    "@typescript-eslint/strict-boolean-expressions": "off"
-  }
+    "@typescript-eslint/strict-boolean-expressions": "off",
+  },
 }
diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-20.10
+20.12
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
@@ -9,8 +9,7 @@
     "DavidAnson.vscode-markdownlint",
     "dbaeumer.vscode-eslint",
     "esbenp.prettier-vscode",
-    "Vue.volar",
-    "Vue.vscode-typescript-vue-plugin",
+    "vue.volar",
     "csstools.postcss",
     "stylelint.vscode-stylelint"
   ]

diff --git a/app/website/package.json b/app/website/package.json
@@ -12,8 +12,8 @@
   "private": true,
   "type": "module",
   "engines": {
-    "node": ">=20.10.0",
-    "pnpm": ">=8.15.0"
+    "node": ">=20.12.0",
+    "pnpm": ">=9.0.0"
   },
   "scripts": {
     "clean": "rm -rf dist && rm -rf *.tsbuildinfo",
@@ -26,21 +26,21 @@
     "type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false"
   },
   "dependencies": {
-    "@earwurm/utilities": "workspace:*",
+    "beeftools": "^0.0.5",
     "earwurm": "workspace:*",
-    "vue": "^3.4.15"
+    "vue": "^3.4.25"
   },
   "devDependencies": {
     "@earwurm/types": "workspace:*",
-    "@rushstack/eslint-patch": "^1.7.2",
-    "@tsconfig/node20": "^20.1.2",
-    "@vitejs/plugin-vue": "^5.0.3",
+    "@rushstack/eslint-patch": "^1.10.2",
+    "@tsconfig/node20": "^20.1.4",
+    "@vitejs/plugin-vue": "^5.0.4",
     "@vue/eslint-config-prettier": "^9.0.0",
-    "@vue/eslint-config-typescript": "^12.0.0",
+    "@vue/eslint-config-typescript": "^13.0.0",
     "@vue/tsconfig": "^0.5.1",
-    "eslint-plugin-vue": "^9.20.1",
-    "lightningcss": "^1.23.0",
+    "eslint-plugin-vue": "^9.25.0",
+    "lightningcss": "^1.24.1",
     "vite-plugin-svg-sprite": "^0.5.1",
-    "vue-tsc": "^1.8.27"
+    "vue-tsc": "^2.0.14"
   }
 }
diff --git a/app/website/src/components/DragHandle.vue b/app/website/src/components/DragHandle.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {classNames} from '@/helpers';
+import {clx} from 'beeftools';
 
 export interface DragHandleProps {
   invert?: boolean;
@@ -9,7 +9,7 @@ defineProps<DragHandleProps>();
 </script>
 
 <template>
-  <div :class="classNames('DragHandle', {invert})">
+  <div :class="clx('DragHandle', {invert})">
     <div class="Column">
       <div class="Dot" />
     </div>

diff --git a/app/website/src/components/IconAction.vue b/app/website/src/components/IconAction.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {classNames} from '@/helpers';
+import {clx} from 'beeftools';
 import {
   MotionFadeScale,
   SquareAction,
@@ -29,7 +29,7 @@ defineEmits<IconActionEmits>();
 <template>
   <SquareAction
     :classes="
-      classNames('IconAction', {
+      clx('IconAction', {
         hasLabel: label?.length,
         disabled,
         filledLabel,

diff --git a/app/website/src/components/MuteBar.vue b/app/website/src/components/MuteBar.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import {computed} from 'vue';
-import {arrayOfLength} from '@earwurm/utilities';
-import {classNames} from '@/helpers';
+import {arrayOfLength, clx} from 'beeftools';
 
 export interface MuteBarProps {
   count?: number;
@@ -16,7 +15,7 @@ const barItems = computed(() => arrayOfLength(Math.max(count + 1, 1)));
 </script>
 
 <template>
-  <ul :class="classNames('MuteBar', {collapsed})">
+  <ul :class="clx('MuteBar', {collapsed})">
     <li v-for="bar in barItems" :key="`MuteBar-Item-${bar}`" class="Item" />
   </ul>
 </template>

diff --git a/app/website/src/components/SpeedSlider.vue b/app/website/src/components/SpeedSlider.vue
@@ -1,9 +1,8 @@
 <script setup lang="ts">
 import {computed} from 'vue';
+import {calcProgress, clx} from 'beeftools';
 import {tokens} from 'earwurm';
-import {calcProgress} from '@earwurm/utilities';
 
-import {classNames} from '@/helpers';
 import {InputRange, type InputRangeProps} from '@/primitives';
 import {MuteBar} from '@/components';
 
@@ -37,7 +36,7 @@ const stripes = computed(() => {
 
 <template>
   <div
-    :class="classNames('SpeedSlider', {disabled})"
+    :class="clx('SpeedSlider', {disabled})"
     :style="{'--slider-progress': progress}"
   >
     <div class="BackgroundStripes">

diff --git a/app/website/src/components/StackLabel.vue b/app/website/src/components/StackLabel.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {classNames} from '@/helpers';
+import {clx} from 'beeftools';
 
 export interface StackLabelProps {
   label: string;
@@ -11,8 +11,8 @@ defineProps<StackLabelProps>();
 </script>
 
 <template>
-  <div :class="classNames('StackLabel', {populated})">
-    <p :class="classNames('Text', {truncate})">{{ label }}</p>
+  <div :class="clx('StackLabel', {populated})">
+    <p :class="clx('Text', {truncate})">{{ label }}</p>
   </div>
 </template>
 

diff --git a/app/website/src/components/VolumeManager.vue b/app/website/src/components/VolumeManager.vue
@@ -1,8 +1,7 @@
 <script setup lang="ts">
 import {computed} from 'vue';
-import {calcProgress} from '@earwurm/utilities';
+import {calcProgress, clx} from 'beeftools';
 
-import {classNames} from '@/helpers';
 import {InputRange, type InputRangeProps} from '@/primitives';
 import {DragHandle, MuteBar} from '@/components';
 
@@ -27,7 +26,7 @@ const progress = computed(() => {
 
 <template>
   <div class="VolumeManager" :style="{'--slider-progress': progress}">
-    <div :class="classNames('MuteBarWrapper', {show: disabled})">
+    <div :class="clx('MuteBarWrapper', {show: disabled})">
       <MuteBar :count="MUTE_BAR_COUNT" />
     </div>
 

diff --git a/app/website/src/components/VolumeSound.vue b/app/website/src/components/VolumeSound.vue
@@ -1,8 +1,7 @@
 <script setup lang="ts">
 import {computed, ref} from 'vue';
-import {arrayOfLength, clamp, roundNumber} from '@earwurm/utilities';
+import {arrayOfLength, clamp, clx, roundNumber} from 'beeftools';
 
-import {classNames} from '@/helpers';
 import {MuteBar} from '@/components';
 
 export interface VolumeSoundProps {
@@ -52,8 +51,8 @@ function handleChange(volume: number) {
 </script>
 
 <template>
-  <div :class="classNames('VolumeSound', {disabled})">
-    <div :class="classNames('MuteBarWrapper', {show: disabled})">
+  <div :class="clx('VolumeSound', {disabled})">
+    <div :class="clx('MuteBarWrapper', {show: disabled})">
       <MuteBar :count="TICK_LENGTH" />
     </div>
 
@@ -66,7 +65,7 @@ function handleChange(volume: number) {
         <button
           type="button"
           :class="
-            classNames(
+            clx(
               'Action',
               interactIndex !== undefined
                 ? {

diff --git a/app/website/src/components/VolumeStack.vue b/app/website/src/components/VolumeStack.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import {computed} from 'vue';
-
-import {calcProgress} from '@earwurm/utilities';
+import {calcProgress} from 'beeftools';
 
 import {InputRange, type InputRangeProps} from '@/primitives';
 import {MuteBar} from '@/components';

diff --git a/app/website/src/helpers/classNames.ts b/app/website/src/helpers/classNames.ts
diff --git a/app/website/src/helpers/index.ts b/app/website/src/helpers/index.ts
@@ -1,5 +1,2 @@
 export {assertSynthType, assertSynthValues, filterSynthValues} from './app';
-
-export {classNames, variationName} from './classNames';
-
 export {toValue, tryOnScopeDispose} from './vue';
diff --git a/app/website/src/hooks/useMediaQuery.ts b/app/website/src/hooks/useMediaQuery.ts
@@ -1,5 +1,5 @@
 import {ref, watchEffect} from 'vue';
-import {supportMatchMedia} from '@earwurm/utilities';
+import {supportMatchMedia} from 'beeftools';
 
 import type {MaybeRefOrGetter} from '@/types';
 import {toValue, tryOnScopeDispose} from '@/helpers';

diff --git a/app/website/src/hooks/useMetronome.ts b/app/website/src/hooks/useMetronome.ts
@@ -1,5 +1,5 @@
 import {computed, ref} from 'vue';
-import {clamp} from '@earwurm/utilities';
+import {clamp} from 'beeftools';
 
 // TODO: `volume` range may actually need to be `0-100`.
 const INITIAL_VOLUME = 1;

diff --git a/app/website/src/primitives/ProgressBar.vue b/app/website/src/primitives/ProgressBar.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import {computed} from 'vue';
-import {clamp, calcProgress} from '@earwurm/utilities';
-import {classNames} from '@/helpers';
+import {calcProgress, clamp, clx} from 'beeftools';
 
 export interface ProgressBarProps {
   id: string;
@@ -19,7 +18,7 @@ const progress = computed(() => calcProgress(value, {min, max, round: true}));
 <template>
   <div
     :class="
-      classNames('ProgressBar', 'pattern-diagonal', {
+      clx('ProgressBar', 'pattern-diagonal', {
         'pattern-diagonal--animated': speed,
         disabled,
       })

diff --git a/app/website/src/primitives/SquareAction.vue b/app/website/src/primitives/SquareAction.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {classNames} from '@/helpers';
+import {clx} from 'beeftools';
 
 export interface SquareActionProps {
   classes?: string;
@@ -24,7 +24,7 @@ defineEmits<SquareActionEmits>();
   <a
     v-if="url?.length"
     :href="url"
-    :class="classNames('SquareAction', 'link', {disabled}, classes)"
+    :class="clx('SquareAction', 'link', {disabled}, classes)"
     :target="external ? '_blank' : undefined"
     :rel="external ? 'noopener noreferrer' : undefined"
   >
@@ -34,7 +34,7 @@ defineEmits<SquareActionEmits>();
   <button
     v-else
     type="button"
-    :class="classNames('SquareAction', 'button', classes)"
+    :class="clx('SquareAction', 'button', classes)"
     :aria-label="a11y"
     :aria-pressed="pressed ? true : undefined"
     :disabled="disabled"

diff --git a/app/website/src/store/useDebugManager.ts b/app/website/src/store/useDebugManager.ts
@@ -8,7 +8,7 @@ type ErrorResponse = Parameters<ManagerEventMap['error']>[0];
 const MAX_HISTORY_LENGTH = 44;
 
 // TODO: Consider enabling a auto-suspension option.
-// import {clamp, timeMeasurement} from '@earwurm/utilities';
+// import {clamp, timeMeasurement} from 'beeftools';
 // const safeAutoSuspend = clamp(0, autoSuspend, timeMeasurement.msPerMin);
 
 const {manager, activeStacks} = useEarwurmStore();

diff --git a/package.json b/package.json
@@ -15,10 +15,10 @@
   },
   "private": true,
   "engines": {
-    "node": ">=20.10.0",
-    "pnpm": ">=8.15.0"
+    "node": ">=20.12.0",
+    "pnpm": ">=9.0.0"
   },
-  "packageManager": "pnpm@8.15.0",
+  "packageManager": "pnpm@9.0.6",
   "scripts": {
     "clean": "pnpm -r clean && rm -rf coverage",
     "nuke": "pnpm clean && ./scripts/nuke.sh",
@@ -39,21 +39,16 @@
   "devDependencies": {
     "@changesets/changelog-github": "^0.5.0",
     "@changesets/cli": "^2.27.1",
-    "@types/node": "^20.11.8",
-    "@typescript-eslint/eslint-plugin": "^6.19.1",
-    "@vitest/coverage-v8": "^1.2.2",
-    "@vitest/ui": "^1.2.2",
-    "eslint": "^8.56.0",
+    "@types/node": "^20.12.7",
+    "@vitest/coverage-v8": "^1.5.2",
+    "@vitest/ui": "^1.5.2",
+    "eslint-config-love": "^47.0.0",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-config-standard-with-typescript": "^43.0.1",
     "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-n": "^16.6.2",
     "eslint-plugin-prettier": "^5.1.3",
-    "eslint-plugin-promise": "^6.1.1",
-    "happy-dom": "^13.3.1",
-    "prettier": "^3.2.4",
-    "typescript": "^5.3.3",
-    "vite": "^5.0.12",
-    "vitest": "^1.2.2"
+    "happy-dom": "^14.7.1",
+    "prettier": "^3.2.5",
+    "vite": "^5.2.10",
+    "vitest": "^1.5.2"
   }
 }