Merge branch 'main' into dev-add-wifi-qr-code-generator

2025-05-08 07:11:03 -04:00 · 2023-09-03 21:51:27 +02:00 · 2023-09-03 21:51:27 +02:00 · e8c55065ad
commit e8c55065ad
parent 13b422eb7a 7ab9204e96
12 changed files with 151 additions and 153 deletions
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@ -31,6 +31,4 @@ jobs:
        run: pnpm typecheck

      - name: Build the app
-        env:
-          NODE_OPTIONS: --max-old-space-size=4096
        run: pnpm build
--- a/.github/workflows/e2e-tests.yml
+++ b/.github/workflows/e2e-tests.yml
@ -1,13 +1,13 @@
 name: E2E tests
-on: [deployment_status]
-
+on:
+  pull_request:
+  push:
+    branches:
+      - main
 jobs:
  test:
-    if: github.event.deployment_status.state == 'success'
    timeout-minutes: 60
    runs-on: ubuntu-latest
-    env:
-      BASE_URL: ${{ github.event.deployment_status.target_url }}
    strategy:
      matrix:
        shard: [1/3, 2/3, 3/3]
@ -28,6 +28,9 @@ jobs:
      - name: Install dependencies
        run: pnpm install

+      - name: Build app
+        run: pnpm build
+
      - name: Restore Playwright browsers from cache
        uses: actions/cache@v3
        with:
--- a/components.d.ts
+++ b/components.d.ts
@ -33,6 +33,7 @@ declare module '@vue/runtime-core' {
    CInputText: typeof import('./src/ui/c-input-text/c-input-text.vue')['default']
    'CInputText.demo': typeof import('./src/ui/c-input-text/c-input-text.demo.vue')['default']
    CKeyValueList: typeof import('./src/ui/c-key-value-list/c-key-value-list.vue')['default']
+    CKeyValueListItem: typeof import('./src/ui/c-key-value-list/c-key-value-list-item.vue')['default']
    CLabel: typeof import('./src/ui/c-label/c-label.vue')['default']
    CLink: typeof import('./src/ui/c-link/c-link.vue')['default']
    'CLink.demo': typeof import('./src/ui/c-link/c-link.demo.vue')['default']
--- a/package.json
+++ b/package.json
@ -21,11 +21,12 @@
  },
  "scripts": {
    "dev": "vite",
-    "build": "vue-tsc --noEmit && vite build",
+    "build": "vue-tsc --noEmit && NODE_OPTIONS=--max_old_space_size=4096 vite build",
    "preview": "vite preview --port 5050",
    "test": "npm run test:unit",
    "test:unit": "vitest --environment jsdom",
    "test:e2e": "playwright test",
+    "test:e2e:dev": "BASE_URL=http://localhost:5173 NO_WEB_SERVER=true playwright test",
    "coverage": "vitest run --coverage",
    "typecheck": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
    "lint": "eslint src --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --ignore-path .gitignore",
@ -74,7 +75,7 @@
    "plausible-tracker": "^0.3.8",
    "qrcode": "^1.5.1",
    "randombytes": "^2.1.0",
-    "sql-formatter": "^12.0.0",
+    "sql-formatter": "^13.0.0",
    "ua-parser-js": "^1.0.35",
    "unicode-emoji-json": "^0.4.0",
    "unplugin-auto-import": "^0.16.4",
@ -89,7 +90,7 @@
  "devDependencies": {
    "@antfu/eslint-config": "^0.41.0",
    "@iconify-json/mdi": "^1.1.50",
-    "@intlify/unplugin-vue-i18n": "^0.12.3",
+    "@intlify/unplugin-vue-i18n": "^0.13.0",
    "@playwright/test": "^1.32.3",
    "@rushstack/eslint-patch": "^1.2.0",
    "@tsconfig/node18": "^18.2.0",
@ -121,7 +122,7 @@
    "typescript": "~5.2.0",
    "unocss": "^0.55.0",
    "unocss-preset-scrollbar": "^0.2.1",
-    "unplugin-icons": "^0.16.5",
+    "unplugin-icons": "^0.17.0",
    "unplugin-vue-components": "^0.25.0",
    "vite": "^4.4.9",
    "vite-plugin-pwa": "^0.16.0",
--- a/playwright.config.ts
+++ b/playwright.config.ts
@ -2,6 +2,7 @@ import { defineConfig, devices } from '@playwright/test';

 const isCI = !!process.env.CI;
 const baseUrl = process.env.BASE_URL || 'http://localhost:5050';
+const useWebServer = process.env.NO_WEB_SERVER !== 'true';

 /**
 * See https://playwright.dev/docs/test-configuration.
@ -52,13 +53,13 @@ export default defineConfig({

  /* Run your local dev server before starting the tests */

-  ...(isCI
-    ? {}
-    : {
-        webServer: {
-          command: 'npm run preview',
-          url: 'http://127.0.0.1:5050',
-          reuseExistingServer: true,
-        },
-      }),
+  ...(useWebServer
+    && {
+      webServer: {
+        command: 'npm run preview',
+        url: 'http://127.0.0.1:5050',
+        reuseExistingServer: !isCI,
+      },
+    }
+  ),
 });
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -129,8 +129,8 @@ dependencies:
    specifier: ^2.1.0
    version: 2.1.0
  sql-formatter:
-    specifier: ^12.0.0
-    version: 12.0.0
+    specifier: ^13.0.0
+    version: 13.0.0
  ua-parser-js:
    specifier: ^1.0.35
    version: 1.0.35
@ -170,8 +170,8 @@ devDependencies:
    specifier: ^1.1.50
    version: 1.1.50
  '@intlify/unplugin-vue-i18n':
-    specifier: ^0.12.3
-    version: 0.12.3(rollup@2.79.1)(vue-i18n@9.2.2)
+    specifier: ^0.13.0
+    version: 0.13.0(rollup@2.79.1)(vue-i18n@9.2.2)
  '@playwright/test':
    specifier: ^1.32.3
    version: 1.32.3
@ -266,8 +266,8 @@ devDependencies:
    specifier: ^0.2.1
    version: 0.2.1(unocss@0.55.0)
  unplugin-icons:
-    specifier: ^0.16.5
-    version: 0.16.5(@vue/compiler-sfc@3.2.47)
+    specifier: ^0.17.0
+    version: 0.17.0(@vue/compiler-sfc@3.2.47)
  unplugin-vue-components:
    specifier: ^0.25.0
    version: 0.25.0(rollup@2.79.1)(vue@3.3.4)
@ -417,6 +417,10 @@ packages:
    resolution: {integrity: sha512-dlR6LdS+0SzOAPx/TPRhnoi7hE251OVeT2Snw0RguNbBSbjUHdWr0l3vcUUDg26rEysT89kCbtw1lVorBXLLCg==}
    dev: true

+  /@antfu/utils@0.7.6:
+    resolution: {integrity: sha512-pvFiLP2BeOKA/ZOS6jxx4XhKzdVLHDhGlFEaZ2flWWYf2xOqVniqpk38I04DFRyz+L0ASggl7SkItTc+ZLju4w==}
+    dev: true
+
  /@apideck/better-ajv-errors@0.3.6(ajv@8.12.0):
    resolution: {integrity: sha512-P+ZygBLZtkp0qqOAJJVX4oX/sFo5JR3eBWwwuqHHhK0GIgQOKWrAfiAaWX0aArHkRWHMuggFEgAZNxVPwPZYaA==}
    engines: {node: '>=10'}
@ -486,7 +490,7 @@ packages:
      '@babel/helper-compilation-targets': 7.22.5(@babel/core@7.22.5)
      '@babel/helper-module-transforms': 7.22.5
      '@babel/helpers': 7.22.5
-      '@babel/parser': 7.22.5
+      '@babel/parser': 7.22.10
      '@babel/template': 7.22.5
      '@babel/traverse': 7.22.5
      '@babel/types': 7.22.5
@ -2091,8 +2095,21 @@ packages:
      - supports-color
    dev: true

-  /@intlify/bundle-utils@7.0.2(vue-i18n@9.2.2):
-    resolution: {integrity: sha512-8wbx9xhbawBFTE5LPTECiK26RRqrNS31jyWSur72ZXZZ4it5jiZTcG6eUJlNirr4+jXYio2DGY299JsGVT4cpw==}
+  /@iconify/utils@2.1.9:
+    resolution: {integrity: sha512-mo+A4n3MwLlWlg1SoSO+Dt6pOPWKElk9sSJ6ZpuzbB9OcjxN8RUWxU3ulPwB1nglErWKRam2x4BAohbYF7FiFA==}
+    dependencies:
+      '@antfu/install-pkg': 0.1.1
+      '@antfu/utils': 0.7.6
+      '@iconify/types': 2.0.0
+      debug: 4.3.4
+      kolorist: 1.8.0
+      local-pkg: 0.4.3
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@intlify/bundle-utils@7.1.0(vue-i18n@9.2.2):
+    resolution: {integrity: sha512-Q88Wl2T8oaRXls8Yr6l807jZM88mceJvK7QS6gKdU8/pf3gTpU9XmcYORDgAv6h5WKQMoaFjNVf5+SWLfTAysA==}
    engines: {node: '>= 14.16'}
    peerDependencies:
      petite-vue-i18n: '*'
@ -2103,17 +2120,17 @@ packages:
      vue-i18n:
        optional: true
    dependencies:
-      '@intlify/message-compiler': 9.3.0-beta.24
-      '@intlify/shared': 9.3.0-beta.24
+      '@intlify/message-compiler': 9.3.0-beta.27
+      '@intlify/shared': 9.3.0-beta.27
      acorn: 8.10.0
      escodegen: 2.0.0
      estree-walker: 2.0.2
-      jsonc-eslint-parser: 1.4.1
+      jsonc-eslint-parser: 2.3.0
      magic-string: 0.30.2
      mlly: 1.4.0
      source-map-js: 1.0.2
      vue-i18n: 9.2.2(vue@3.3.4)
-      yaml-eslint-parser: 0.3.2
+      yaml-eslint-parser: 1.2.2
    dev: true

  /@intlify/core-base@9.2.2:
@ -2138,11 +2155,11 @@ packages:
      '@intlify/shared': 9.2.2
      source-map: 0.6.1

-  /@intlify/message-compiler@9.3.0-beta.24:
-    resolution: {integrity: sha512-prhHATkgp0mpPqoVgiAtLmUc1JMvs8fMH6w53AVEBn+VF87dLhzanfmWY5FoZWORG51ag54gBDBOoM/VFv3m3A==}
+  /@intlify/message-compiler@9.3.0-beta.27:
+    resolution: {integrity: sha512-GC8rSbd7V67Zu+a9Z0bpV4riBek11YCURJU50YaEhV4Ub2JHEPtoYxK5r2eIsq/kp+M2hJyGLiC4NJUrGa2VwQ==}
    engines: {node: '>= 16'}
    dependencies:
-      '@intlify/shared': 9.3.0-beta.24
+      '@intlify/shared': 9.3.0-beta.27
      source-map-js: 1.0.2
    dev: true

@ -2150,13 +2167,18 @@ packages:
    resolution: {integrity: sha512-wRwTpsslgZS5HNyM7uDQYZtxnbI12aGiBZURX3BTR9RFIKKRWpllTsgzHWvj3HKm3Y2Sh5LPC1r0PDCKEhVn9Q==}
    engines: {node: '>= 14'}

-  /@intlify/shared@9.3.0-beta.24:
-    resolution: {integrity: sha512-AKxJ8s7eKIQWkNaf4wyyoLRwf4puCuQgjSChlDJm5JBEt6T8HGgnYTJLRXu6LD/JACn3Qwu6hM/XRX1c9yvjmQ==}
+  /@intlify/shared@9.3.0-beta.14-77e850b:
+    resolution: {integrity: sha512-aHZYRM0sJN+YSUnoC5Dv4L1TFYtP23kdTkrK5cHSEqUbI5UXc8FbnXPal0lJliMhO0ED7Ic7aEOeQX84BM3xCQ==}
+    engines: {node: '>= 14'}
+    dev: true
+
+  /@intlify/shared@9.3.0-beta.27:
+    resolution: {integrity: sha512-hPMsmVCs+ZUVHHU5VORG6LopzXZT7zmyVNqc9OQG80YpA/N4lT/pkJ4B6DTNIsv2C7mwfGM7RdK+0qPki43YgA==}
    engines: {node: '>= 16'}
    dev: true

-  /@intlify/unplugin-vue-i18n@0.12.3(rollup@2.79.1)(vue-i18n@9.2.2):
-    resolution: {integrity: sha512-0riPtSfTM58JmGNMmJho/aHD2z3K24BESYAmkLvKlo61/LbaPvnjYU1DbSbJEm6bSjE2oEjUj+di3QaYxXei/w==}
+  /@intlify/unplugin-vue-i18n@0.13.0(rollup@2.79.1)(vue-i18n@9.2.2):
+    resolution: {integrity: sha512-Mm9NhcvbsSZ5FXXnCpL/XFCk1hPp809hxErNmnwqGp21JjYOKGp3wpQSrpvGk33ZrHZbhPqAu70IEVEAxVZ5+A==}
    engines: {node: '>= 14.16'}
    peerDependencies:
      petite-vue-i18n: '*'
@ -2170,8 +2192,8 @@ packages:
      vue-i18n-bridge:
        optional: true
    dependencies:
-      '@intlify/bundle-utils': 7.0.2(vue-i18n@9.2.2)
-      '@intlify/shared': 9.3.0-beta.24
+      '@intlify/bundle-utils': 7.1.0(vue-i18n@9.2.2)
+      '@intlify/shared': 9.3.0-beta.14-77e850b
      '@rollup/pluginutils': 5.0.2(rollup@2.79.1)
      '@vue/compiler-sfc': 3.3.4
      debug: 4.3.4
@ -3247,7 +3269,7 @@ packages:
    dependencies:
      '@unhead/dom': 0.5.1
      '@unhead/schema': 0.5.1
-      '@vueuse/shared': 10.4.0(vue@3.3.4)
+      '@vueuse/shared': 10.4.1(vue@3.3.4)
      unhead: 0.5.1
      vue: 3.3.4
    transitivePeerDependencies:
@ -3829,8 +3851,8 @@ packages:
      - vue
    dev: false

-  /@vueuse/shared@10.4.0(vue@3.3.4):
-    resolution: {integrity: sha512-52asvLf5cbAS/h6xWjqoY4MgjxmFjnVNf/nA8BP7RbeIrIGcf+BZbeOcVo+92byqArXEJiBxptXpufQvbwJL/w==}
+  /@vueuse/shared@10.4.1(vue@3.3.4):
+    resolution: {integrity: sha512-vz5hbAM4qA0lDKmcr2y3pPdU+2EVw/yzfRsBdu+6+USGa4PxqSQRYIUC9/NcT06y+ZgaTsyURw2I9qOFaaXHAg==}
    dependencies:
      vue-demi: 0.14.5(vue@3.3.4)
    transitivePeerDependencies:
@ -3850,20 +3872,12 @@ packages:
    resolution: {integrity: sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==}
    dev: true

-  /acorn-jsx@5.3.2(acorn@7.4.1):
+  /acorn-jsx@5.3.2(acorn@8.10.0):
    resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
    peerDependencies:
      acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
    dependencies:
-      acorn: 7.4.1
-    dev: true
-
-  /acorn-jsx@5.3.2(acorn@8.9.0):
-    resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
-    peerDependencies:
-      acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
-    dependencies:
-      acorn: 8.9.0
+      acorn: 8.10.0
    dev: true

  /acorn-walk@8.2.0:
@ -3871,15 +3885,10 @@ packages:
    engines: {node: '>=0.4.0'}
    dev: true

-  /acorn@7.4.1:
-    resolution: {integrity: sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==}
-    engines: {node: '>=0.4.0'}
-    dev: true
-
  /acorn@8.10.0:
    resolution: {integrity: sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==}
    engines: {node: '>=0.4.0'}
-    dev: true
+    hasBin: true

  /acorn@8.9.0:
    resolution: {integrity: sha512-jaVNAFBHNLXspO543WnNNPZFRtavh3skAkITqD0/2aeMkKZTN+254PyhwxFYrk3vQ1xfY+2wbesJMs/JC8/PwQ==}
@ -4901,6 +4910,7 @@ packages:
  /escodegen@2.0.0:
    resolution: {integrity: sha512-mmHKys/C8BFUGI+MAWNcSYoORYLMdPzjrknd2Vc+bUsjN5bXcr8EhrNB+UTqfL1y3I9c4fw2ihgtMPQLBRiQxw==}
    engines: {node: '>=6.0'}
+    hasBin: true
    dependencies:
      esprima: 4.0.1
      estraverse: 5.3.0
@ -5179,18 +5189,6 @@ packages:
      estraverse: 5.3.0
    dev: true

-  /eslint-utils@2.1.0:
-    resolution: {integrity: sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg==}
-    engines: {node: '>=6'}
-    dependencies:
-      eslint-visitor-keys: 1.3.0
-    dev: true
-
-  /eslint-visitor-keys@1.3.0:
-    resolution: {integrity: sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==}
-    engines: {node: '>=4'}
-    dev: true
-
  /eslint-visitor-keys@3.4.3:
    resolution: {integrity: sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==}
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@ -5241,27 +5239,19 @@ packages:
      - supports-color
    dev: true

-  /espree@6.2.1:
-    resolution: {integrity: sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==}
-    engines: {node: '>=6.0.0'}
-    dependencies:
-      acorn: 7.4.1
-      acorn-jsx: 5.3.2(acorn@7.4.1)
-      eslint-visitor-keys: 1.3.0
-    dev: true
-
  /espree@9.6.1:
    resolution: {integrity: sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==}
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
    dependencies:
-      acorn: 8.9.0
-      acorn-jsx: 5.3.2(acorn@8.9.0)
+      acorn: 8.10.0
+      acorn-jsx: 5.3.2(acorn@8.10.0)
      eslint-visitor-keys: 3.4.3
    dev: true

  /esprima@4.0.1:
    resolution: {integrity: sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==}
    engines: {node: '>=4'}
+    hasBin: true
    dev: true

  /esquery@1.5.0:
@ -5575,6 +5565,11 @@ packages:
    resolution: {integrity: sha512-I0UBV/XOz1XkIJHEUDMZAbzCThU/H8DxmSfmdGcKPnVhu2VfFqr34jr9777IyaTYvxjedWhqVIilEDsCdP5G6g==}
    dev: true

+  /get-stdin@8.0.0:
+    resolution: {integrity: sha512-sY22aA6xchAzprjyqmSEQv4UbAAzRN0L2dQB0NlN5acTTK9Don6nhoc3eAbUnpZiCANAMfd/+40kVdKfFygohg==}
+    engines: {node: '>=10'}
+    dev: false
+
  /get-stream@6.0.1:
    resolution: {integrity: sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==}
    engines: {node: '>=10'}
@ -6228,6 +6223,7 @@ packages:

  /js-yaml@3.14.1:
    resolution: {integrity: sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==}
+    hasBin: true
    dependencies:
      argparse: 1.0.10
      esprima: 4.0.1
@ -6235,6 +6231,7 @@ packages:

  /js-yaml@4.1.0:
    resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==}
+    hasBin: true
    dependencies:
      argparse: 2.0.1
    dev: true
@ -6326,17 +6323,6 @@ packages:
    resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==}
    engines: {node: '>=6'}

-  /jsonc-eslint-parser@1.4.1:
-    resolution: {integrity: sha512-hXBrvsR1rdjmB2kQmUjf1rEIa+TqHBGMge8pwi++C+Si1ad7EjZrJcpgwym+QGK/pqTx+K7keFAtLlVNdLRJOg==}
-    engines: {node: '>=8.10.0'}
-    dependencies:
-      acorn: 7.4.1
-      eslint-utils: 2.1.0
-      eslint-visitor-keys: 1.3.0
-      espree: 6.2.1
-      semver: 6.3.1
-    dev: true
-
  /jsonc-eslint-parser@2.3.0:
    resolution: {integrity: sha512-9xZPKVYp9DxnM3sd1yAsh/d59iIaswDkai8oTxbursfKYbg/ibjX0IzFt35+VZ8iEW453TVTXztnRvYUQlAfUQ==}
    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@ -6668,7 +6654,7 @@ packages:
  /mlly@1.4.0:
    resolution: {integrity: sha512-ua8PAThnTwpprIaU47EPeZ/bPUVp2QYBbWMphUQpVdBI3Lgqzm5KZQ45Agm3YJedHXaIHl6pBGabaLSUPPSptg==}
    dependencies:
-      acorn: 8.9.0
+      acorn: 8.10.0
      pathe: 1.1.1
      pkg-types: 1.0.3
      ufo: 1.1.2
@ -6732,6 +6718,7 @@ packages:

  /nearley@2.20.1:
    resolution: {integrity: sha512-+Mc8UaAebFzgV+KpI5n7DasuuQCHA89dmwm7JXw3TV43ukfNQ9DnBH3Mdb2g/I4Fdxc26pwimBWvjIw0UAILSQ==}
+    hasBin: true
    dependencies:
      commander: 2.20.3
      moo: 0.5.2
@ -7095,6 +7082,7 @@ packages:
  /pify@4.0.1:
    resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
    engines: {node: '>=6'}
+    requiresBuild: true
    dev: true
    optional: true

@ -7358,6 +7346,7 @@ packages:

  /prr@1.0.1:
    resolution: {integrity: sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==}
+    requiresBuild: true
    dev: true
    optional: true

@ -7634,10 +7623,12 @@ packages:

  /safer-buffer@2.1.2:
    resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
+    requiresBuild: true
    dev: true

  /sax@1.2.4:
    resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
+    requiresBuild: true
    dev: true
    optional: true

@ -7835,10 +7826,12 @@ packages:
    resolution: {integrity: sha512-VE0SOVEHCk7Qc8ulkWw3ntAzXuqf7S2lvwQaDLRnUeIEaKNQJzV6BwmLKhOqT61aGhfUMrXeaBk+oDGCzvhcug==}
    dev: false

-  /sql-formatter@12.0.0:
-    resolution: {integrity: sha512-LR2m7BEvkyNAPzmcSCZ2b4Qzm5ySiiXS9Juc73VguTqCWIbYv7ZFV4LaDM7jNNZqHPfrqFssO7WWpITsAuLOuQ==}
+  /sql-formatter@13.0.0:
+    resolution: {integrity: sha512-V21cVvge4rhn9Fa7K/fTKcmPM+x1yee6Vhq8ZwgaWh3VPBqApgsaoFB5kLAhiqRo5AmSaRyLU7LIdgnNwH01/w==}
+    hasBin: true
    dependencies:
      argparse: 2.0.1
+      get-stdin: 8.0.0
      nearley: 2.20.1
    dev: false

@ -7953,7 +7946,7 @@ packages:
  /strip-literal@1.0.1:
    resolution: {integrity: sha512-QZTsipNpa2Ppr6v1AmJHESqJ3Uz247MUS0OjrnnZjFAvEoWqxuyFuXn2xLgMtRnijJShAa1HL0gtJyUs7u7n3Q==}
    dependencies:
-      acorn: 8.9.0
+      acorn: 8.10.0

  /supports-color@5.5.0:
    resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
@ -8323,7 +8316,7 @@ packages:
      pkg-types: 1.0.3
      scule: 1.0.0
      strip-literal: 1.0.1
-      unplugin: 1.3.1
+      unplugin: 1.4.0
    transitivePeerDependencies:
      - rollup
    dev: false
@ -8423,8 +8416,8 @@ packages:
      - rollup
    dev: false

-  /unplugin-icons@0.16.5(@vue/compiler-sfc@3.2.47):
-    resolution: {integrity: sha512-laCCqMWfng1XZgB9yowGfjBdDhtmz8t8zVnhzRNEMhBNdy26QrVewVmdXk/zsiAQYnEWvIxTjvW1nQXrxdd2+w==}
+  /unplugin-icons@0.17.0(@vue/compiler-sfc@3.2.47):
+    resolution: {integrity: sha512-gMv66eY/Hj64heM55XrfDH3LUCWI51mtkBVUPVl9VkpvLgAYhdVe9nRuzu6p+idmCLSQVq7xiPxQcD4aXCgW5A==}
    peerDependencies:
      '@svgr/core': '>=7.0.0'
      '@svgx/core': ^1.0.1
@ -8444,8 +8437,8 @@ packages:
        optional: true
    dependencies:
      '@antfu/install-pkg': 0.1.1
-      '@antfu/utils': 0.7.5
-      '@iconify/utils': 2.1.7
+      '@antfu/utils': 0.7.6
+      '@iconify/utils': 2.1.9
      '@vue/compiler-sfc': 3.2.47
      debug: 4.3.4
      kolorist: 1.8.0
@ -8495,11 +8488,10 @@ packages:
  /unplugin@1.4.0:
    resolution: {integrity: sha512-5x4eIEL6WgbzqGtF9UV8VEC/ehKptPXDS6L2b0mv4FRMkJxRtjaJfOWDd6a8+kYbqsjklix7yWP0N3SUepjXcg==}
    dependencies:
-      acorn: 8.9.0
+      acorn: 8.10.0
      chokidar: 3.5.3
      webpack-sources: 3.2.3
      webpack-virtual-modules: 0.5.0
-    dev: true

  /upath@1.2.0:
    resolution: {integrity: sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==}
@ -9219,14 +9211,6 @@ packages:
  /yallist@4.0.0:
    resolution: {integrity: sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==}

-  /yaml-eslint-parser@0.3.2:
-    resolution: {integrity: sha512-32kYO6kJUuZzqte82t4M/gB6/+11WAuHiEnK7FreMo20xsCKPeFH5tDBU7iWxR7zeJpNnMXfJyXwne48D0hGrg==}
-    dependencies:
-      eslint-visitor-keys: 1.3.0
-      lodash: 4.17.21
-      yaml: 1.10.2
-    dev: true
-
  /yaml-eslint-parser@1.2.2:
    resolution: {integrity: sha512-pEwzfsKbTrB8G3xc/sN7aw1v6A6c/pKxLAkjclnAyo5g5qOh6eL9WGu0o3cSDQZKrTNk4KL4lQSwZW+nBkANEg==}
    engines: {node: ^14.17.0 || >=16.0.0}
@ -9236,11 +9220,6 @@ packages:
      yaml: 2.2.1
    dev: true

-  /yaml@1.10.2:
-    resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==}
-    engines: {node: '>= 6'}
-    dev: true
-
  /yaml@2.2.1:
    resolution: {integrity: sha512-e0WHiYql7+9wr4cWMx3TVQrNwejKaEe7/rHNmQmqRjazfOP5W8PB6Jpebb5o6fIapbz9o9+2ipcaTM2ZwDI6lw==}
    engines: {node: '>= 14'}
--- a/src/tools/bcrypt/bcrypt.vue
+++ b/src/tools/bcrypt/bcrypt.vue
@ -45,7 +45,7 @@ const compareMatch = computed(() => compareSync(compareString.value, compareHash
        <c-input-text v-model:value="compareString" placeholder="Your string to compare..." raw-text />
      </n-form-item>
      <n-form-item label="Your hash: " label-placement="left">
-        <c-input-text v-model:value="compareHash" placeholder="Your hahs to compare..." raw-text />
+        <c-input-text v-model:value="compareHash" placeholder="Your hash to compare..." raw-text />
      </n-form-item>
      <n-form-item label="Do they match ? " label-placement="left" :show-feedback="false">
        <div class="compare-result" :class="{ positive: compareMatch }">
--- a/src/tools/iban-validator-and-parser/iban-validator-and-parser.e2e.spec.ts
+++ b/src/tools/iban-validator-and-parser/iban-validator-and-parser.e2e.spec.ts
@ -1,14 +1,15 @@
 import { type Page, expect, test } from '@playwright/test';
-import _ from 'lodash';

 async function extractIbanInfo({ page }: { page: Page }) {
-  const tdHandles = await page.locator('table tr td').elementHandles();
-  const tdTextContents = await Promise.all(tdHandles.map(el => el.textContent()));
+  const itemsLines = await page
+    .locator('.c-key-value-list__item').all();

-  return _.chain(tdTextContents)
-    .map(tdTextContent => tdTextContent?.trim().replace(' Copy to clipboard', ''))
-    .chunk(2)
-    .value();
+  return await Promise.all(
+    itemsLines.map(async item => [
+      (await item.locator('.c-key-value-list__key').textContent() ?? '').trim(),
+      (await item.locator('.c-key-value-list__value').textContent() ?? '').trim(),
+    ]),
+  );
 }

 test.describe('Tool - Iban validator and parser', () => {
@ -41,7 +42,7 @@ test.describe('Tool - Iban validator and parser', () => {

    expect(ibanInfo).toEqual([
      ['Is IBAN valid ?', 'No'],
-      ['IBAN errors', 'Wrong account bank branch checksumWrong IBAN checksum Copy to clipboard'],
+      ['IBAN errors', 'Wrong account bank branch checksum Wrong IBAN checksum'],
      ['Is IBAN a QR-IBAN ?', 'No'],
      ['Country code', 'N/A'],
      ['BBAN', 'N/A'],
--- a/src/tools/iban-validator-and-parser/iban-validator-and-parser.vue
+++ b/src/tools/iban-validator-and-parser/iban-validator-and-parser.vue
@ -60,7 +60,7 @@ const ibanExamples = [
  <div>
    <c-input-text v-model:value="rawIban" placeholder="Enter an IBAN to check for validity..." test-id="iban-input" />

-    <c-key-value-list :items="ibanInfo" my-5 />
+    <c-key-value-list :items="ibanInfo" my-5 data-test-id="iban-info" />

    <c-card title="Valid IBAN examples">
      <div v-for="iban in ibanExamples" :key="iban">
--- a/src/ui/c-key-value-list/c-key-value-list-item.vue
+++ b/src/ui/c-key-value-list/c-key-value-list-item.vue
@ -0,0 +1,27 @@
+<script lang="ts" setup>
+import _ from 'lodash';
+import type { CKeyValueListItem } from './c-key-value-list.types';
+
+const props = defineProps<{ item: CKeyValueListItem }>();
+const { item } = toRefs(props);
+</script>
+
+<template>
+  <div v-if="_.isArray(item.value)">
+    <div v-for="value in item.value" :key="value">
+      <c-text-copyable :value="value" :show-icon="item.showCopyButton ?? true" />
+    </div>
+  </div>
+  <div v-else-if="_.isBoolean(item.value)">
+    <c-text-copyable :value="item.value ? 'true' : 'false'" :displayed-value="item.value ? 'Yes' : 'No'" :show-icon="item.showCopyButton ?? true" />
+  </div>
+  <div v-else-if="_.isNumber(item.value)" font-mono>
+    <c-text-copyable :value="String(item.value)" :show-icon="item.showCopyButton ?? true" />
+  </div>
+  <div v-else-if="_.isNil(item.value) || item.value === ''" op-70>
+    {{ item.placeholder ?? 'N/A' }}
+  </div>
+  <div v-else>
+    <c-text-copyable :value="item.value" :show-icon="item.showCopyButton ?? true" />
+  </div>
+</template>
--- a/src/ui/c-key-value-list/c-key-value-list.vue
+++ b/src/ui/c-key-value-list/c-key-value-list.vue
@ -9,29 +9,13 @@ const formattedItems = computed(() => items.value.filter(item => !_.isNil(item.v
 </script>

 <template>
-  <table border-collapse table-fixed>
-    <tr v-for="item in formattedItems" :key="item.label">
-      <td py-1 pr-2 text-right font-bold>
+  <div my-5>
+    <div v-for="item in formattedItems" :key="item.label" flex gap-2 py-1 class="c-key-value-list__item">
+      <div flex-basis-180px text-right font-bold class="c-key-value-list__key">
        {{ item.label }}
-      </td>
+      </div>

-      <td v-if="_.isArray(item.value)">
-        <div v-for="value in item.value" :key="value">
-          <c-text-copyable :value="value" :show-icon="item.showCopyButton ?? true" />
-        </div>
-      </td>
-      <td v-else-if="_.isBoolean(item.value)">
-        <c-text-copyable :value="item.value ? 'true' : 'false'" :displayed-value="item.value ? 'Yes' : 'No'" :show-icon="item.showCopyButton ?? true" />
-      </td>
-      <td v-else-if="_.isNumber(item.value)" font-mono>
-        <c-text-copyable :value="String(item.value)" :show-icon="item.showCopyButton ?? true" />
-      </td>
-      <td v-else-if="_.isNil(item.value) || item.value === ''" op-70>
-        {{ item.placeholder ?? 'N/A' }}
-      </td>
-      <td v-else>
-        <c-text-copyable :value="item.value" :show-icon="item.showCopyButton ?? true" />
-      </td>
-    </tr>
-  </table>
+      <c-key-value-list-item :item="item" class="c-key-value-list__value" />
+    </div>
+  </div>
 </template>
--- a/src/ui/c-tooltip/c-tooltip.vue
+++ b/src/ui/c-tooltip/c-tooltip.vue
@ -19,7 +19,10 @@ const isTargetHovered = useElementHover(targetRef);
        'op-100 scale-100': isTargetHovered,
      }"
    >
-      <slot name="tooltip">
+      <slot
+        v-if="isTargetHovered"
+        name="tooltip"
+      >
        {{ tooltip }}
      </slot>
    </div>