feat: Update npm packages (#622)

aeternity · Dec 20, 2023 · 254b2d0 · 254b2d0
1 parent 661b8fd
commit 254b2d0
Show file tree

Hide file tree

Showing 62 changed files with 2,210 additions and 1,750 deletions.
diff --git a/.stylelintrc.js b/.stylelintrc.js
@@ -1,19 +1,12 @@
 module.exports = {
   "defaultSeverity": "warning",
   extends: [
+    "stylelint-config-standard",
     "stylelint-config-recommended",
     "stylelint-config-html/vue",
     "stylelint-config-recommended-vue",
   ],
   "rules": {
-    "block-opening-brace-space-before": "always",
-    "selector-list-comma-newline-after": "always",
-    "block-opening-brace-newline-after": "always",
-    "block-closing-brace-newline-before": "always",
-    "block-closing-brace-newline-after": "always",
-    "declaration-block-trailing-semicolon": "always",
-    "declaration-colon-newline-after": "always-multi-line",
-    "declaration-block-semicolon-newline-after": "always",
     "declaration-block-no-duplicate-properties": true,
     "selector-pseudo-element-colon-notation": "single",
     "comment-whitespace-inside": null,

diff --git a/README.md b/README.md
@@ -31,7 +31,7 @@ user experience with Server Side Rendering enabled.
 
 ## Getting started
 
-First, download and install [Node.js](https://nodejs.org/en/download). Version 20.9.0
+First, download and install [Node.js](https://nodejs.org/en/download). Version 18
 or higher is required.
 
 Clone æScan repository

diff --git a/nuxt.config.ts b/nuxt.config.ts
@@ -42,9 +42,10 @@ export default defineNuxtConfig({
   postcss: {
     plugins: {
       autoprefixer: {},
-      'postcss-custom-media': {
-        importFrom: 'src/styles/settings/_variables.css',
+      '@csstools/postcss-global-data': {
+        files: ['src/styles/settings/_variables.css'],
       },
+      'postcss-custom-media': {},
       'postcss-import': {},
       'postcss-nested': {},
     },

diff --git a/package.json b/package.json
@@ -28,56 +28,58 @@
   "dependencies": {
     "@aeternity/aepp-sdk": "^13.2.2",
     "@download/blockies": "^1.0.3",
-    "@sentry/tracing": "^7.25.0",
-    "@sentry/vue": "^7.25.0",
-    "@vueuse/core": "^9.13.0",
-    "@vueuse/head": "^1.1.19",
-    "axios": "^1.2.1",
-    "bignumber.js": "9.1.1",
+    "@sentry/tracing": "^7.88.0",
+    "@sentry/vue": "^7.88.0",
+    "@vueuse/core": "^10.7.0",
+    "@vueuse/head": "^2.0.0",
+    "axios": "^1.6.2",
+    "bignumber.js": "9.1.2",
     "camelcase-keys-deep": "^0.1.0",
-    "chart.js": "^4.4.0",
+    "chart.js": "^4.4.1",
     "compression": "^1.7.4",
-    "core-js": "^3.26.1",
+    "core-js": "^3.34.0",
     "express": "^4.18.2",
-    "floating-vue": "^2.0.0-beta.20",
-    "luxon": "^3.2.1",
+    "floating-vue": "^2.0.0-beta.24",
+    "luxon": "^3.4.4",
     "memory-cache": "^0.2.0",
-    "pinia": "^2.0.32",
-    "swiper": "^8.4.5",
-    "vue": "^3.3.4",
-    "vue-chartjs": "^5.2.0",
+    "pinia": "^2.1.7",
+    "swiper": "^11.0.5",
+    "vue": "^3.3.11",
+    "vue-chartjs": "^5.3.0",
     "vue-multiselect": "^3.0.0-beta.1",
-    "vue-router": "^4.1.6"
+    "vue-router": "^4.2.5"
   },
   "devDependencies": {
-    "@nuxtjs/eslint-config-typescript": "^12.0.0",
-    "@nuxtjs/plausible": "^0.2.0",
-    "@pinia/nuxt": "^0.4.7",
-    "@vitejs/plugin-vue": "^4.0.0",
-    "autoprefixer": "^10.4.13",
-    "eslint": "^8.29.0",
-    "eslint-config-standard": "^17.0.0",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-n": "^15.6.0",
+    "@csstools/postcss-global-data": "^2.1.0",
+    "@nuxtjs/eslint-config-typescript": "^12.1.0",
+    "@nuxtjs/plausible": "^0.2.4",
+    "@pinia/nuxt": "^0.5.1",
+    "@vitejs/plugin-vue": "^4.5.2",
+    "autoprefixer": "^10.4.16",
+    "eslint": "^8.55.0",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-n": "^16.4.0",
     "eslint-plugin-nuxt": "^4.0.0",
-    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-prettier": "^5.0.1",
     "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-vue": "^9.8.0",
-    "nuxt": "^3.5.2",
-    "nuxt-simple-sitemap": "2.6.1",
-    "postcss": "^8.4.20",
-    "postcss-custom-media": "^8.0.2",
+    "eslint-plugin-vue": "^9.19.2",
+    "nuxt": "^3.8.2",
+    "nuxt-simple-sitemap": "4.1.17",
+    "postcss": "^8.4.32",
+    "postcss-custom-media": "^10.0.2",
     "postcss-html": "^1.5.0",
     "postcss-import": "^15.1.0",
-    "postcss-load-config": "^4.0.1",
-    "postcss-nested": "^6.0.0",
-    "prettier": "^2.8.1",
+    "postcss-load-config": "^5.0.2",
+    "postcss-nested": "^6.0.1",
+    "prettier": "^3.1.1",
     "rollup-plugin-ternary": "^2.0.1",
-    "stylelint": "^15.11.0",
-    "stylelint-config-recommended": "^13.0.0",
+    "stylelint": "^16.0.2",
+    "stylelint-config-recommended": "^14.0.0",
     "stylelint-config-recommended-vue": "^1.5.0",
-    "typescript": "^4.9.5",
-    "vite": "^4.0.1",
+    "stylelint-config-standard": "^35.0.0",
+    "typescript": "^5.3.3",
+    "vite": "^5.0.9",
     "vite-plugin-html": "^3.2.0"
   },
   "browserslist": [

diff --git a/src/app.vue b/src/app.vue
@@ -110,6 +110,7 @@ function logError(error) {
 </script>
 
 <style>
+/* stylelint-disable selector-id-pattern*/
 #__nuxt {
   height: 100%;
   display: flex;

diff --git a/src/components/AccountActivitiesPanel.vue b/src/components/AccountActivitiesPanel.vue
@@ -50,6 +50,7 @@ function loadNextActivities() {
 <style scoped>
 .account-activities-panel {
   padding: var(--space-4) var(--space-1);
+
   @media (--desktop) {
     padding: var(--space-4);
   }

diff --git a/src/components/AppHero.vue b/src/components/AppHero.vue
@@ -47,6 +47,7 @@ import MarketStats from '@/components/MarketStats'
     max-width: var(--container-width);
     margin: 0 auto;
     padding: 0 var(--space-3) 0;
+
     @media (--desktop) {
       padding: 0;
     }
@@ -55,6 +56,7 @@ import MarketStats from '@/components/MarketStats'
   &__heading {
     color: var(--color-white);
     margin-bottom: var(--space-2);
+
     @media (--desktop) {
       margin-bottom: var(--space-3);
     }
@@ -76,13 +78,15 @@ import MarketStats from '@/components/MarketStats'
   &__search-bar {
     margin-bottom: var(--space-4);
     width: 100%;
+
     @media (--desktop) {
       margin-bottom: 0;
     }
   }
 
   &__market-stats {
     margin-bottom: var(--space-6);
+
     @media (--desktop) {
       margin-bottom: var(--space-4);
     }

diff --git a/src/components/AppIcon.vue b/src/components/AppIcon.vue
@@ -28,10 +28,10 @@ watch(
 
 <style>
 .icon {
-  fill: currentColor;
+  fill: currentcolor;
 
   & *[stroke] {
-    stroke: currentColor;
+    stroke: currentcolor;
   }
 }
 </style>
diff --git a/src/components/AppPanel.vue b/src/components/AppPanel.vue
@@ -27,6 +27,7 @@
 
   &__header {
     padding: var(--space-1) 0 0 0;
+
     @media (--desktop) {
       display: flex;
       justify-content: space-between;

diff --git a/src/components/AppSelect.vue b/src/components/AppSelect.vue
@@ -91,13 +91,14 @@ const selectedValue = useVModel(props, 'modelValue', emit)
     color: var(--color-midnight);
     font-size: 12px;
     line-height: 20px;
+
     @media (--desktop) {
       font-size: 14px;
     }
   }
 
   &__content-wrapper {
-    box-shadow: 2px 2px 14px 5px rgba(78, 78, 86, 0.2);
+    box-shadow: 2px 2px 14px 5px rgb(78 78 86 / 20%);
     border-bottom-left-radius: 8px;
     border-bottom-right-radius: 8px;
   }
@@ -116,6 +117,7 @@ const selectedValue = useVModel(props, 'modelValue', emit)
     color: solid var(--color-midnight);
     font-size: 12px;
     line-height: 20px;
+
     @media (--desktop) {
       font-size: 14px;
     }
@@ -141,6 +143,7 @@ const selectedValue = useVModel(props, 'modelValue', emit)
   &__input {
     font-size: 12px;
     line-height: 20px;
+
     @media (--desktop) {
       font-size: 14px;
     }
@@ -158,7 +161,7 @@ const selectedValue = useVModel(props, 'modelValue', emit)
 
   &--active {
     .multiselect__tags {
-      box-shadow: 2px 2px 14px 5px rgba(78, 78, 86, 0.2);
+      box-shadow: 2px 2px 14px 5px rgb(78 78 86 / 20%);
       border-radius: 8px;
     }
   }

diff --git a/src/components/AppSwiper.vue b/src/components/AppSwiper.vue
@@ -19,7 +19,7 @@
 </template>
 
 <script setup>
-import { Pagination } from 'swiper'
+import { Pagination } from 'swiper/modules'
 import { Swiper, SwiperSlide } from 'swiper/vue'
 import 'swiper/css'
 import 'swiper/css/pagination'

diff --git a/src/components/AppTab.vue b/src/components/AppTab.vue
@@ -30,7 +30,7 @@ registerTab({
 
 <style scoped>
 .tab {
-  border-radius: 0 8px 8px 8px;
+  border-radius: 0 8px 8px;
   background: var(--color-white);
 }
 </style>
diff --git a/src/components/AppTitle.vue b/src/components/AppTitle.vue
@@ -8,6 +8,7 @@
 .title {
   color: var(--color-midnight);
   margin-bottom: var(--space-5);
+
   @media (--desktop) {
     margin-bottom: 0;
   }

diff --git a/src/components/ContractsChartPanel.vue b/src/components/ContractsChartPanel.vue
@@ -150,12 +150,14 @@ async function loadContractsStatistics({ interval, limit }) {
 
   &__chart-controls {
     display: none;
+
     @media (--desktop) {
       display: grid;
     }
 
     &--condensed {
       margin-top: var(--space-4);
+
       @media (--desktop) {
         display: none;
       }

diff --git a/src/components/CopyButton.vue b/src/components/CopyButton.vue
@@ -77,7 +77,7 @@ function stopCopySuccessAnimation() {
   margin: 0;
   padding: 0;
   text-transform: none;
-  -webkit-appearance: button;
+  appearance: button;
 
   &--light {
     color: var(--color-white);

diff --git a/src/components/DashboardAuctionsPanel.vue b/src/components/DashboardAuctionsPanel.vue
@@ -23,6 +23,7 @@ import AppPanel from '@/components/AppPanel'
 <style scoped>
 .dashboard-auctions-panel {
   padding: var(--space-3) var(--space-1);
+
   @media (--desktop) {
     padding: var(--space-4);
   }

diff --git a/src/components/DashboardKeyblockPanel.vue b/src/components/DashboardKeyblockPanel.vue
@@ -89,6 +89,7 @@ const {
 
   &__dashboard-panel-header {
     margin-bottom: var(--space-2);
+
     @media (--desktop) {
       margin-bottom: var(--space-4);
     }
@@ -102,13 +103,15 @@ const {
 
   &__keyblock-table-condensed {
     margin: var(--space-4) 0;
+
     @media (--desktop) {
       margin: 0;
     }
   }
 
   &__keyblock-sequence {
     margin-bottom: var(--space-3);
+
     @media (--desktop) {
       margin-bottom: var(--space-4);
     }
@@ -121,6 +124,7 @@ const {
     display: block;
 
     margin-bottom: var(--space-1);
+
     @media (--desktop) {
       margin-bottom: 0;
       display: none;

diff --git a/src/components/DashboardMicroblocksPanel.vue b/src/components/DashboardMicroblocksPanel.vue
@@ -59,6 +59,7 @@ const { selectedKeyblockMicroblocks, selectedMicroblockTransactionsCount } = sto
 
   &__dashboard-panel-header {
     margin-bottom: var(--space-2);
+
     @media (--desktop) {
       margin-bottom: var(--space-3);
     }
@@ -74,6 +75,7 @@ const { selectedKeyblockMicroblocks, selectedMicroblockTransactionsCount } = sto
     font-family: var(--font-monospaced);
     font-size: 14px;
     line-height: 20px;
+
     @media (--desktop) {
       margin-bottom: 0;
       display: none;
@@ -82,6 +84,7 @@ const { selectedKeyblockMicroblocks, selectedMicroblockTransactionsCount } = sto
 
   &__summary--desktop {
     display: none;
+
     @media (--desktop) {
       display: block;
     }

diff --git a/src/components/DashboardNamesPanel.vue b/src/components/DashboardNamesPanel.vue
@@ -22,6 +22,7 @@ import AppPanel from '@/components/AppPanel'
 <style scoped>
 .dashboard-names-panel {
   padding: var(--space-3) var(--space-1);
+
   @media (--desktop) {
     padding: var(--space-4);
   }

diff --git a/src/components/DashboardPanelHeader.vue b/src/components/DashboardPanelHeader.vue
@@ -68,6 +68,7 @@ defineProps({
     display: flex;
     flex-direction: column;
     flex-grow: 1;
+
     @media (--desktop) {
       flex-direction: row;
       align-items: center;
@@ -96,6 +97,7 @@ defineProps({
     line-height: 20px;
     font-weight: 500;
     white-space: nowrap;
+
     @media (--desktop) {
       font-size: 16px;
       line-height: 24px;

diff --git a/src/components/DashboardStateChannelsPanel.vue b/src/components/DashboardStateChannelsPanel.vue
@@ -22,6 +22,7 @@ import { stateChannelsHints } from '@/utils/hints/stateChannelsHints'
 .dashboard-state-channels-panel {
   width: 100%;
   padding: var(--space-3) var(--space-1);
+
   @media (--desktop) {
     padding: var(--space-4);
   }