build: ⬆️ update vuedsfr

frontend/.eslintrc-auto-import.json

@@ -290,13 +290,18 @@
     "watchTriggerable": true,
     "watchWithFilter": true,
     "whenever": true,
-    "OhVueIcon": true,
-    "addIcons": true,
     "injectLocal": true,
     "provideLocal": true,
     "useClipboardItems": true,
     "useScheme": true,
     "useTabs": true,
-    "useStore": true
+    "useStore": true,
+    "DirectiveBinding": true,
+    "MaybeRef": true,
+    "MaybeRefOrGetter": true,
+    "onWatcherCleanup": true,
+    "useId": true,
+    "useModel": true,
+    "useTemplateRef": true
   }
 }

frontend/package.json

@@ -16,7 +16,7 @@
   },
   "dependencies": {
     "@gouvfr/dsfr": "~1.12.1",
-    "@gouvminint/vue-dsfr": "^5.8.0",
+    "@gouvminint/vue-dsfr": "^7.0.0",
     "axios": "^1.6.7",
     "luxon": "^3.4.4",
     "oidc-client-ts": "^3.0.1",

frontend/src/auto-imports.d.ts

@@ -6,8 +6,6 @@
 export {}
 declare global {
   const EffectScope: (typeof import("vue"))["EffectScope"];
-  const OhVueIcon: (typeof import("oh-vue-icons"))["OhVueIcon"];
-  const addIcons: (typeof import("oh-vue-icons"))["addIcons"];
   const asyncComputed: (typeof import("@vueuse/core"))["asyncComputed"];
   const autoResetRef: (typeof import("@vueuse/core"))["autoResetRef"];
   const computed: (typeof import("vue"))["computed"];
@@ -67,6 +65,7 @@ declare global {
   const onStartTyping: (typeof import("@vueuse/core"))["onStartTyping"];
   const onUnmounted: (typeof import("vue"))["onUnmounted"];
   const onUpdated: (typeof import("vue"))["onUpdated"];
+  const onWatcherCleanup: (typeof import("vue"))["onWatcherCleanup"];
   const pausableWatch: (typeof import("@vueuse/core"))["pausableWatch"];
   const provide: (typeof import("vue"))["provide"];
   const provideLocal: (typeof import("@vueuse/core"))["provideLocal"];
@@ -176,6 +175,7 @@ declare global {
   const useGamepad: (typeof import("@vueuse/core"))["useGamepad"];
   const useGeolocation: (typeof import("@vueuse/core"))["useGeolocation"];
   const useHead: (typeof import("@vueuse/head"))["useHead"];
+  const useId: (typeof import("vue"))["useId"];
   const useIdle: (typeof import("@vueuse/core"))["useIdle"];
   const useImage: (typeof import("@vueuse/core"))["useImage"];
   const useInfiniteScroll: (typeof import("@vueuse/core"))["useInfiniteScroll"];
@@ -192,6 +192,7 @@ declare global {
   const useMediaQuery: (typeof import("@vueuse/core"))["useMediaQuery"];
   const useMemoize: (typeof import("@vueuse/core"))["useMemoize"];
   const useMemory: (typeof import("@vueuse/core"))["useMemory"];
+  const useModel: (typeof import("vue"))["useModel"];
   const useMounted: (typeof import("@vueuse/core"))["useMounted"];
   const useMouse: (typeof import("@vueuse/core"))["useMouse"];
   const useMouseInElement: (typeof import("@vueuse/core"))["useMouseInElement"];
@@ -245,6 +246,7 @@ declare global {
   const useSupported: (typeof import("@vueuse/core"))["useSupported"];
   const useSwipe: (typeof import("@vueuse/core"))["useSwipe"];
   const useTabs: (typeof import("@gouvminint/vue-dsfr"))["useTabs"];
+  const useTemplateRef: (typeof import("vue"))["useTemplateRef"];
   const useTemplateRefsList: (typeof import("@vueuse/core"))["useTemplateRefsList"];
   const useTextDirection: (typeof import("@vueuse/core"))["useTextDirection"];
   const useTextSelection: (typeof import("@vueuse/core"))["useTextSelection"];
@@ -300,12 +302,15 @@ declare global {
     Component,
     ComponentPublicInstance,
     ComputedRef,
+    DirectiveBinding,
     ExtractDefaultPropTypes,
     ExtractPropTypes,
     ExtractPublicPropTypes,
     InjectionKey,
     PropType,
     Ref,
+    MaybeRef,
+    MaybeRefOrGetter,
     VNode,
     WritableComputedRef,
   } from "vue";
@@ -317,8 +322,6 @@ declare module "vue" {
   interface GlobalComponents {}
   interface ComponentCustomProperties {
     readonly EffectScope: UnwrapRef<(typeof import("vue"))["EffectScope"]>;
-    readonly OhVueIcon: UnwrapRef<(typeof import("oh-vue-icons"))["OhVueIcon"]>;
-    readonly addIcons: UnwrapRef<(typeof import("oh-vue-icons"))["addIcons"]>;
     readonly computed: UnwrapRef<(typeof import("vue"))["computed"]>;
     readonly createApp: UnwrapRef<(typeof import("vue"))["createApp"]>;
     readonly customRef: UnwrapRef<(typeof import("vue"))["customRef"]>;
@@ -376,118 +379,9 @@ declare module "vue" {
     >;
     readonly onUnmounted: UnwrapRef<(typeof import("vue"))["onUnmounted"]>;
     readonly onUpdated: UnwrapRef<(typeof import("vue"))["onUpdated"]>;
-    readonly provide: UnwrapRef<(typeof import("vue"))["provide"]>;
-    readonly reactive: UnwrapRef<(typeof import("vue"))["reactive"]>;
-    readonly readonly: UnwrapRef<(typeof import("vue"))["readonly"]>;
-    readonly ref: UnwrapRef<(typeof import("vue"))["ref"]>;
-    readonly resolveComponent: UnwrapRef<
-      (typeof import("vue"))["resolveComponent"]
-    >;
-    readonly shallowReactive: UnwrapRef<
-      (typeof import("vue"))["shallowReactive"]
-    >;
-    readonly shallowReadonly: UnwrapRef<
-      (typeof import("vue"))["shallowReadonly"]
-    >;
-    readonly shallowRef: UnwrapRef<(typeof import("vue"))["shallowRef"]>;
-    readonly toRaw: UnwrapRef<(typeof import("vue"))["toRaw"]>;
-    readonly toRef: UnwrapRef<(typeof import("vue"))["toRef"]>;
-    readonly toRefs: UnwrapRef<(typeof import("vue"))["toRefs"]>;
-    readonly toValue: UnwrapRef<(typeof import("vue"))["toValue"]>;
-    readonly triggerRef: UnwrapRef<(typeof import("vue"))["triggerRef"]>;
-    readonly unref: UnwrapRef<(typeof import("vue"))["unref"]>;
-    readonly useAttrs: UnwrapRef<(typeof import("vue"))["useAttrs"]>;
-    readonly useCssModule: UnwrapRef<(typeof import("vue"))["useCssModule"]>;
-    readonly useCssVars: UnwrapRef<(typeof import("vue"))["useCssVars"]>;
-    readonly useLink: UnwrapRef<(typeof import("vue-router"))["useLink"]>;
-    readonly useRoute: UnwrapRef<(typeof import("vue-router"))["useRoute"]>;
-    readonly useRouter: UnwrapRef<(typeof import("vue-router"))["useRouter"]>;
-    readonly useScheme: UnwrapRef<
-      (typeof import("@gouvminint/vue-dsfr"))["useScheme"]
+    readonly onWatcherCleanup: UnwrapRef<
+      (typeof import("vue"))["onWatcherCleanup"]
     >;
-    readonly useSlots: UnwrapRef<(typeof import("vue"))["useSlots"]>;
-    readonly useSnackbarStore: UnwrapRef<
-      (typeof import("./stores/snackbar"))["useSnackbarStore"]
-    >;
-    readonly useStore: UnwrapRef<
-      (typeof import("./stores/result"))["useStore"]
-    >;
-    readonly useTabs: UnwrapRef<
-      (typeof import("@gouvminint/vue-dsfr"))["useTabs"]
-    >;
-    readonly watch: UnwrapRef<(typeof import("vue"))["watch"]>;
-    readonly watchEffect: UnwrapRef<(typeof import("vue"))["watchEffect"]>;
-    readonly watchPostEffect: UnwrapRef<
-      (typeof import("vue"))["watchPostEffect"]
-    >;
-    readonly watchSyncEffect: UnwrapRef<
-      (typeof import("vue"))["watchSyncEffect"]
-    >;
-  }
-}
-declare module "@vue/runtime-core" {
-  interface GlobalComponents {}
-  interface ComponentCustomProperties {
-    readonly EffectScope: UnwrapRef<(typeof import("vue"))["EffectScope"]>;
-    readonly OhVueIcon: UnwrapRef<(typeof import("oh-vue-icons"))["OhVueIcon"]>;
-    readonly addIcons: UnwrapRef<(typeof import("oh-vue-icons"))["addIcons"]>;
-    readonly computed: UnwrapRef<(typeof import("vue"))["computed"]>;
-    readonly createApp: UnwrapRef<(typeof import("vue"))["createApp"]>;
-    readonly customRef: UnwrapRef<(typeof import("vue"))["customRef"]>;
-    readonly defineAsyncComponent: UnwrapRef<
-      (typeof import("vue"))["defineAsyncComponent"]
-    >;
-    readonly defineComponent: UnwrapRef<
-      (typeof import("vue"))["defineComponent"]
-    >;
-    readonly effectScope: UnwrapRef<(typeof import("vue"))["effectScope"]>;
-    readonly getCurrentInstance: UnwrapRef<
-      (typeof import("vue"))["getCurrentInstance"]
-    >;
-    readonly getCurrentScope: UnwrapRef<
-      (typeof import("vue"))["getCurrentScope"]
-    >;
-    readonly h: UnwrapRef<(typeof import("vue"))["h"]>;
-    readonly inject: UnwrapRef<(typeof import("vue"))["inject"]>;
-    readonly isProxy: UnwrapRef<(typeof import("vue"))["isProxy"]>;
-    readonly isReactive: UnwrapRef<(typeof import("vue"))["isReactive"]>;
-    readonly isReadonly: UnwrapRef<(typeof import("vue"))["isReadonly"]>;
-    readonly isRef: UnwrapRef<(typeof import("vue"))["isRef"]>;
-    readonly markRaw: UnwrapRef<(typeof import("vue"))["markRaw"]>;
-    readonly nextTick: UnwrapRef<(typeof import("vue"))["nextTick"]>;
-    readonly onActivated: UnwrapRef<(typeof import("vue"))["onActivated"]>;
-    readonly onBeforeMount: UnwrapRef<(typeof import("vue"))["onBeforeMount"]>;
-    readonly onBeforeRouteLeave: UnwrapRef<
-      (typeof import("vue-router"))["onBeforeRouteLeave"]
-    >;
-    readonly onBeforeRouteUpdate: UnwrapRef<
-      (typeof import("vue-router"))["onBeforeRouteUpdate"]
-    >;
-    readonly onBeforeUnmount: UnwrapRef<
-      (typeof import("vue"))["onBeforeUnmount"]
-    >;
-    readonly onBeforeUpdate: UnwrapRef<
-      (typeof import("vue"))["onBeforeUpdate"]
-    >;
-    readonly onDeactivated: UnwrapRef<(typeof import("vue"))["onDeactivated"]>;
-    readonly onErrorCaptured: UnwrapRef<
-      (typeof import("vue"))["onErrorCaptured"]
-    >;
-    readonly onMounted: UnwrapRef<(typeof import("vue"))["onMounted"]>;
-    readonly onRenderTracked: UnwrapRef<
-      (typeof import("vue"))["onRenderTracked"]
-    >;
-    readonly onRenderTriggered: UnwrapRef<
-      (typeof import("vue"))["onRenderTriggered"]
-    >;
-    readonly onScopeDispose: UnwrapRef<
-      (typeof import("vue"))["onScopeDispose"]
-    >;
-    readonly onServerPrefetch: UnwrapRef<
-      (typeof import("vue"))["onServerPrefetch"]
-    >;
-    readonly onUnmounted: UnwrapRef<(typeof import("vue"))["onUnmounted"]>;
-    readonly onUpdated: UnwrapRef<(typeof import("vue"))["onUpdated"]>;
     readonly provide: UnwrapRef<(typeof import("vue"))["provide"]>;
     readonly reactive: UnwrapRef<(typeof import("vue"))["reactive"]>;
     readonly readonly: UnwrapRef<(typeof import("vue"))["readonly"]>;
@@ -511,7 +405,9 @@ declare module "@vue/runtime-core" {
     readonly useAttrs: UnwrapRef<(typeof import("vue"))["useAttrs"]>;
     readonly useCssModule: UnwrapRef<(typeof import("vue"))["useCssModule"]>;
     readonly useCssVars: UnwrapRef<(typeof import("vue"))["useCssVars"]>;
+    readonly useId: UnwrapRef<(typeof import("vue"))["useId"]>;
     readonly useLink: UnwrapRef<(typeof import("vue-router"))["useLink"]>;
+    readonly useModel: UnwrapRef<(typeof import("vue"))["useModel"]>;
     readonly useRoute: UnwrapRef<(typeof import("vue-router"))["useRoute"]>;
     readonly useRouter: UnwrapRef<(typeof import("vue-router"))["useRouter"]>;
     readonly useScheme: UnwrapRef<
@@ -527,6 +423,9 @@ declare module "@vue/runtime-core" {
     readonly useTabs: UnwrapRef<
       (typeof import("@gouvminint/vue-dsfr"))["useTabs"]
     >;
+    readonly useTemplateRef: UnwrapRef<
+      (typeof import("vue"))["useTemplateRef"]
+    >;
     readonly watch: UnwrapRef<(typeof import("vue"))["watch"]>;
     readonly watchEffect: UnwrapRef<(typeof import("vue"))["watchEffect"]>;
     readonly watchPostEffect: UnwrapRef<

frontend/src/components.d.ts

@@ -21,6 +21,7 @@ declare module "vue" {
     DsfrModal: (typeof import("@gouvminint/vue-dsfr"))["DsfrModal"];
     DsfrPicture: (typeof import("@gouvminint/vue-dsfr"))["DsfrPicture"];
     DsfrRadioButton: (typeof import("@gouvminint/vue-dsfr"))["DsfrRadioButton"];
+    DsfrRadioButtonSet: (typeof import("@gouvminint/vue-dsfr"))["DsfrRadioButtonSet"];
     DsfrSelect: (typeof import("@gouvminint/vue-dsfr"))["DsfrSelect"];
     DsfrTag: (typeof import("@gouvminint/vue-dsfr"))["DsfrTag"];
     HeaderMain: (typeof import("./components/HeaderMain.vue"))["default"];
@@ -34,6 +35,6 @@ declare module "vue" {
     SnackbarAlert: (typeof import("./components/SnackbarAlert.vue"))["default"];
     StepsGuide: (typeof import("./components/StepsGuide.vue"))["default"];
     User: (typeof import("./components/authentication/User.vue"))["default"];
-    VIcon: (typeof import("oh-vue-icons"))["OhVueIcon"];
+    VIcon: (typeof import("@gouvminint/vue-dsfr"))["VIcon"];
   }
 }

frontend/src/main.ts

@@ -1,5 +1,7 @@
 import "@gouvfr/dsfr/dist/dsfr.min.css";
 import "@gouvfr/dsfr/dist/utility/icons/icons.min.css"; // Facultatif : Si des icônes sont utilisées avec <span class="fr-icon-..." />
+import "@gouvfr/dsfr/dist/component/component.main.min.css";
+import "@gouvfr/dsfr/dist/utility/utility.main.min.css";
 import "@gouvminint/vue-dsfr/styles"; // Import des styles globaux
 import "uno.css";
 import "@/main.css";
@@ -9,7 +11,6 @@ import { createApp } from "vue";
 import { createPinia } from "pinia";
 import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
 
-import * as icons from "./icons";
 import App from "./App.vue";
 import router from "@/router/index";
 // import function to register Swiper custom elements
@@ -23,9 +24,6 @@ pinia.use(piniaPluginPersistedstate);
 // the FastAPI backend
 axios.defaults.baseURL = "/api/";
 
-// Register all icons
-addIcons(...Object.values(icons));
-
 const app = createApp(App);
 
 app.use(pinia).use(router).mount("#app");

frontend/vite.config.ts

@@ -7,7 +7,6 @@ import AutoImport from "unplugin-auto-import/vite";
 import Components from "unplugin-vue-components/vite";
 import {
   vueDsfrAutoimportPreset,
-  ohVueIconAutoimportPreset,
   vueDsfrComponentResolver,
 } from "@gouvminint/vue-dsfr";
 
@@ -20,13 +19,7 @@ export default defineConfig({
     // https://github.com/antfu/unplugin-auto-import
     AutoImport({
       include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/],
-      imports: [
-        "vue",
-        "vue-router",
-        // 'vue-i18n',
-        vueDsfrAutoimportPreset,
-        ohVueIconAutoimportPreset,
-      ],
+      imports: ["vue", "vue-router", vueDsfrAutoimportPreset],
       dts: "src/auto-imports.d.ts",
       dirs: ["src/composables", "src/stores"],
       vueTemplate: true,