refactor(DsfrHighlight): ♻️ améliore defineSlots et met à jour imports Storybook

- migre vers le format Storybook 9
- améliore la documentation des slots avec JSDoc

- ajoute defineSlots avec JSDoc pour le slot default dans DsfrHighlight.vue
- supprime le commentaire HTML pour le slot
- met à jour les imports avec Meta/StoryObj depuis @storybook/vue3-vite
- corrige l'import depuis @storybook/test au lieu de storybook/test
- ajoute satisfies Meta<typeof DsfrHighlight> et export default meta
- échappe les apostrophes dans les descriptions françaises

Author: laruiss

src/components/DsfrHighlight/DsfrHighlight.stories.ts

@@ -1,11 +1,12 @@
-import { expect, within } from 'storybook/test'
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+import { expect, within } from '@storybook/test'
 
 import DsfrHighlight from './DsfrHighlight.vue'
 
 /**
- * [Voir quand l’utiliser sur la documentation du DSFR](https://www.systeme-de-design.gouv.fr/version-courante/fr/composants/mise-en-exergue)
+ * [Voir quand l'utiliser sur la documentation du DSFR](https://www.systeme-de-design.gouv.fr/version-courante/fr/composants/mise-en-exergue)
  */
-export default {
+const meta = {
   component: DsfrHighlight,
   title: 'Composants/DsfrHighlight',
   tags: ['message'],
@@ -20,14 +21,18 @@ export default {
     },
     small: {
       control: 'boolean',
-      description: 'Permet d’afficher le texte en petit',
+      description: 'Permet d\'afficher le texte en petit',
     },
     large: {
       control: 'boolean',
-      description: 'Permet d’afficher le texte en plus grand',
+      description: 'Permet d\'afficher le texte en plus grand',
     },
   },
-}
+} satisfies Meta<typeof DsfrHighlight>
+
+export default meta
+
+type Story = StoryObj<typeof meta>
 
 export const MiseEnExergue = (args) => ({
   components: {

src/components/DsfrHighlight/DsfrHighlight.vue

@@ -3,6 +3,13 @@ import type { DsfrHighlightProps } from './DsfrHighlight.types'
 
 export type { DsfrHighlightProps }
 
+/**
+ * @slot default - Slot par défaut pour le contenu de la mise en exergue
+ */
+defineSlots<{
+  default?: () => any
+}>()
+
 withDefaults(defineProps<DsfrHighlightProps>(), {
   text: undefined,
 })
@@ -20,7 +27,6 @@ withDefaults(defineProps<DsfrHighlightProps>(), {
       }"
     >
       {{ text }}
-      <!-- @slot Slot par défaut pour le contenu de la mise en exergue -->
       <slot />
     </p>
   </div>