@cnamts/synapse 0.0.0-alpha.0

package/src/components/FranceConnectBtn/FranceConnectBtn.vue

@@ -0,0 +1,154 @@
+<script setup lang="ts">
+	import { computed } from 'vue'
+	import { locales } from './locales'
+	import { mdiOpenInNew } from '@mdi/js'
+	import { useTheme } from 'vuetify'
+
+	const props = withDefaults(defineProps<{
+		href: string
+		isConnectPlus?: boolean
+		dark?: boolean
+	}>(), {
+		isConnectPlus: false,
+		dark: false,
+	})
+
+	const theme = useTheme()
+	const isDark = computed(() => theme.current.value.dark || props.dark)
+
+	const franceConnectInfoUrl = props.isConnectPlus
+		? 'https://franceconnect.gouv.fr/france-connect-plus'
+		: 'https://franceconnect.gouv.fr/'
+
+	const btnWidth = computed(() => props.isConnectPlus ? '245px' : '209px')
+	const infoUrl = computed(() => franceConnectInfoUrl)
+</script>
+
+<template>
+	<div
+		class="vd-france-connect-btn d-flex flex-column align-start"
+		:class="{
+			'vd-france-connect-btn--dark': isDark,
+		}"
+	>
+		<a
+			:href="href"
+			:aria-label="locales.btnLabel(isConnectPlus)"
+			class="vd-france-connect-link d-inline-flex"
+		>
+			<svg
+				:viewBox="`0 0 ${props.isConnectPlus ? '245' : '209'} 56`"
+				:width="btnWidth"
+				height="56"
+				xmlns="http://www.w3.org/2000/svg"
+			>
+				<path
+					fill="#000091"
+					d="m47 19.1-15-8.68-15 8.76a.6.6 0 0 0-.3.53v16.94a.67.67 0 0 0 .3.53l15 8.6 14.99-8.7a.67.67 0 0 0 .3-.53V19.63a.6.6 0 0 0-.3-.53Z"
+				/>
+
+				<path
+					fill="#e1000f"
+					d="m26.64 19.6-5.03 8.63-4.55-9.18 5.39-3.11 4.48 3.16-.29.5ZM47.3 36.58V19.62a.6.6 0 0 0-.3-.52l-15-8.68"
+				/>
+
+				<path
+					fill="#0063cb"
+					d="M16.7 36.58 32 10.42v35.36l-15-8.6a.67.67 0 0 1-.3-.53V19.71v16.87Zm24.67-20.74L46.83 19l-4.5 9.15-5.38-9.24 4.42-3.07Z"
+				/>
+
+				<path
+					fill="#fff"
+					d="M51.6 16.3 32.43 5.28a.93.93 0 0 0-.84 0L12.4 16.3a.89.89 0 0 0-.39.7v22a.89.89 0 0 0 .4.7l19.18 11.02a.93.93 0 0 0 .84 0L51.6 39.7A.89.89 0 0 0 52 39V17a.89.89 0 0 0-.4-.7ZM22.8 34.06h.08c-.04 0-.08 0-.08.05 0 .1.15 0 .2.1-.24 0-.46.1-.63.27 0 .06.1.06.15.06-.07.1-.23.05-.28.15l.1.05c-.05 0-.1 0-.1.05v.15c-.12 0-.17.1-.27.15.2.15.32 0 .52 0-.52.2-.95.48-1.48.63-.1 0 0 .15-.1.15.15.1.23-.05.38-.05-.66.38-1.34.7-2.04 1.13a.35.35 0 0 0-.1.2h-.2c-.1.05-.05.18-.15.28.23.15.5-.2.65 0 .05 0-.1.05-.2.05-.05 0-.05.1-.1.1H19c-.1.07-.2.12-.2.27a.22.22 0 0 0-.23.1c1.08 0 2.14-.2 3.15-.57.78-.4 1.48-.93 2.09-1.56l.05.1c-.15.43-.43.81-.81 1.08-.28.15-.48.37-.7.48-.15.08-.3.17-.43.27-.63.2-1.28.34-1.94.41l-.3.05-.67.1-2-1.13a.65.65 0 0 1-.28-.41.58.58 0 0 0 .09-.07.26.26 0 0 0-.11-.07v-.65a12.8 12.8 0 0 0 3.04-.94 8.75 8.75 0 0 0-3.04-1.34v-1.52c.55.1 1.1.22 1.64.4.41.15.8.34 1.18.57.15.14.3.27.48.38a.91.91 0 0 0 .8.05h.33a3.96 3.96 0 0 0 1.93-.9c0 .04.05.04.1.04-.07.4-.22.79-.42 1.14 0 .05-.05.15.05.2Zm2.82 3.57c.25-.1.4-.28.63-.38-.05.05-.05.15-.1.2a3.7 3.7 0 0 0-.53.4c-.57.5-1.1 1.04-1.59 1.61-.25.3-.53.58-.8.86l-.3.24-2.54-1.45c.36.03.73.02 1.08-.05a5 5 0 0 0 .86-.33v.1c.7-.27 1.23-.9 1.93-1.13.03 0 .13.1.23.05a1.88 1.88 0 0 1 1.5-.7c0 .05 0 .1.06.1h.02c-.15.13-.32.25-.5.38-.05.05 0 .1.05.1Zm-8.91-6.16v-.19c.52-.14 1.05-.2 1.59-.19a5.86 5.86 0 0 0-1.59.37Zm30.6 5.08a.67.67 0 0 1-.3.53L36.9 42.93a32.3 32.3 0 0 1-3.4-1.19 2.83 2.83 0 0 1-.05-2.24c.07-.3.2-.6.35-.88.02-.03.05-.05.05-.08h.01l.01-.03c.11-.19.24-.38.38-.55l.01-.02.02-.02.02-.01c0-.03.02-.05.05-.08.02-.05.07-.07.1-.12.17-.19.37-.36.58-.5.21-.08.43-.14.65-.18.81.06 1.62.17 2.42.33.1.01.19.05.27.1.3.06.62.04.9-.05a1.14 1.14 0 0 0 .86-.7 1.21 1.21 0 0 0 .05-1.07c-.17-.27 0-.43.19-.59l.06-.05c.09-.06.17-.14.23-.22.13-.25-.1-.4-.15-.63-.05-.1-.22-.05-.32-.2.35-.15.85-.43.63-.86-.16-.22-.38-.63-.1-.85.35-.2.85-.15 1-.48a1.14 1.14 0 0 0-.3-1.09l-.07-.1-.2-.32a6.9 6.9 0 0 0-.53-.76 4.3 4.3 0 0 1-.53-1.01c-.15-.38.05-.7.05-1.08.01-.73-.1-1.46-.33-2.15-.13-.35-.18-.73-.33-1.06-.02-.2-.1-.4-.22-.58a.37.37 0 0 1 0-.33c.2-.14.4-.3.58-.47a.57.57 0 0 0-.2-.71c-.33-.15-.3.33-.53.43h-.15c-.05-.13.05-.18.15-.28 0-.05 0-.15-.05-.15-.2 0-.38-.05-.43-.15a3.96 3.96 0 0 0-1.86-1.29c.19.06.38.1.58.1.34.08.69.04 1-.1.23-.07.28-.48.38-.7a.8.8 0 0 0-.15-.63c-.23-.33-.54-.6-.9-.76a9.13 9.13 0 0 1-.94-.48c-2.96-1.48-9.07-.2-9.53 0-.44.13-.86.29-1.26.48a3.92 3.92 0 0 0-2.36 2.46c-.57.38-1.03.9-1.34 1.51-.42.8-1.05 1.51-.95 2.41.1.78.28 1.49.43 2.3.04.27.1.53.2.8s0 .62.15.85c.07.15.02.33.22.43v.2c.05.05.05.1.16.1v.2c.43.42.8.9 1.1 1.43.1.28-.48.15-.7.05-.41-.27-.8-.6-1.13-.96a.18.18 0 0 0-.05.1c.2.36.9.78.53 1.01-.2.1-.43-.15-.63.05-.05.08 0 .18 0 .28-.28-.2-.58-.1-.86-.2-.2-.05-.25-.43-.48-.43-.6-.14-1.2-.25-1.8-.33-.58-.08-1.16-.14-1.75-.16V19.71a.6.6 0 0 1 .31-.53L32 10.42l15 8.68a.6.6 0 0 1 .3.52v16.93Zm-7.96-8.26a.32.32 0 0 1-.28.15l-.28.27c.1 0 0 .15.1.15-.2.23.08.7-.2.8-.37.1-.76.1-1.13 0a.72.72 0 0 1 .17-.02h.08a.38.38 0 0 0 .34-.13v-.2c0-.05-.05-.05-.1-.05a.16.16 0 0 1-.1.05.22.22 0 0 0-.16-.2.8.8 0 0 1-.72-.27.67.67 0 0 1 .44-.05c.13 0 .08-.23.23-.33h.16c.3-.37.87-.47.97-.84 0-.1-.28-.1-.49-.15a2.26 2.26 0 0 0-.82.05c-.36.05-.7.14-1.05.27.28-.2.6-.36.92-.47.24-.09.48-.15.72-.2l.13-.02.14-.03a.97.97 0 0 1 .55 0c.23.1.62.1.67.25.1.27-.15.54-.44.74-.05.08.15.14.15.23Z"
+				/>
+
+				<path
+					:fill="isDark ? '#000091' : '#f5f5fe'"
+					d="M64.99 24.87a4.9 4.9 0 0 0 4.08 1.95c2.1 0 3.69-1.3 3.69-3.36 0-3.96-5.63-3.35-5.63-6.02 0-1.02.75-1.75 1.92-1.75 1.02 0 1.85.56 2.55 1.56l1.2-1.05a4.54 4.54 0 0 0-3.77-1.94c-2.07 0-3.53 1.45-3.53 3.21 0 3.93 5.64 3.35 5.64 6.04 0 1.09-.77 1.88-2.1 1.88-1.1 0-2.05-.56-2.86-1.61l-1.2 1.09Zm10.81-5.71 1.75-4.56H75.9l-1.44 4.56h1.34Zm4.82-3.46a1 1 0 0 0 1-1.01 1 1 0 0 0-1-1c-.56 0-1.02.45-1.02 1 0 .56.46 1.02 1.02 1.02Zm-.73 10.8h1.45v-8.57h-1.45v8.57Zm3.77-4.28c0 2.5 1.72 4.62 4.4 4.62 1.28 0 2.28-.5 3.04-1.36v1.02h1.45V13.75H91.1v5.2a3.89 3.89 0 0 0-3.04-1.36c-2.68 0-4.4 2.13-4.4 4.63Zm1.53 0c0-1.82 1.22-3.27 3.04-3.27 1.17 0 2.21.56 2.87 1.58v3.37a3.33 3.33 0 0 1-2.87 1.58c-1.82 0-3.04-1.45-3.04-3.26Zm18.02 2.87-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.84 0-3.15-1.24-3.2-3.3h6.58c.05-.23.1-.56.1-.9 0-2.1-1.5-3.74-3.84-3.74-2.65 0-4.32 2.02-4.32 4.63a4.5 4.5 0 0 0 4.68 4.62c1.6 0 2.87-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.29-2.3 2.7-2.3Zm6.32 7.68h1.45v-5.93c.54-.9 1.32-1.62 2.56-1.62 1.33 0 2.2.89 2.2 2.42v5.13h1.44v-5.18c0-2.44-1.43-3.73-3.35-3.73-1.27 0-2.16.55-2.85 1.31v-.97h-1.45v8.57Zm11.06-2.87c0 2.09 1.07 3.04 2.97 3.04.61 0 1.07-.07 1.48-.24v-1.29c-.32.14-.72.2-1.28.2-1.03 0-1.71-.37-1.71-1.71v-4.39h2.97v-1.3H118v-2.15h-1.46v2.14h-1.62v1.31h1.62v4.39Zm7.37-7.92a1 1 0 0 0 1-1.03 1 1 0 0 0-1-1c-.56 0-1.02.46-1.02 1 0 .57.46 1.03 1.02 1.03Zm-.73 10.79h1.45v-8.57h-1.45v8.57Zm3.38-8.57v1.31h1.61v7.26h1.47v-7.26h2.97v-1.3h-2.97v-1.1c0-1.12.64-1.78 1.61-1.78.5 0 .88.15 1.2.39l.65-1.2c-.47-.28-1.1-.5-1.88-.5-1.87 0-3.05 1.3-3.05 3.13v1.05h-1.61Zm8.54-2.22a1 1 0 0 0 1-1.03 1 1 0 0 0-1-1c-.56 0-1.02.46-1.02 1 0 .57.46 1.03 1.02 1.03Zm-.73 10.79h1.44v-8.57h-1.44v8.57Zm12.11-1.41-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.83 0-3.14-1.24-3.2-3.3h6.59c.05-.23.1-.56.1-.9 0-2.1-1.51-3.74-3.84-3.74-2.66 0-4.32 2.02-4.32 4.63a4.5 4.5 0 0 0 4.67 4.62c1.6 0 2.88-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.3-2.3 2.7-2.3Zm6.33 7.68h1.44v-5.88c.53-.87 1.26-1.45 2.38-1.45.34 0 .6.04.85.1v-1.4a3.13 3.13 0 0 0-3.23 1.14v-1.08h-1.44v8.57Zm13.66.24c1.11 0 2.23-.5 2.88-1.33v1.09h1.44v-5.75c0-1.88-1.29-3.16-3.47-3.16-1.5 0-2.7.63-3.45 1.65l1.1.83a2.78 2.78 0 0 1 2.3-1.19c1.23 0 2.08.68 2.08 1.87v.6l-2.9.47c-1.81.31-2.8 1.23-2.8 2.52 0 1.46 1.14 2.4 2.82 2.4Zm-1.36-2.45c0-.73.53-1.26 1.7-1.46l2.54-.43v1.69a3 3 0 0 1-2.64 1.46c-1 0-1.6-.53-1.6-1.26Zm7.2-6.36 3.36 8.57h1.9l3.35-8.57h-1.56L172.54 25l-2.74-7.06h-1.56Zm17.86 7.16-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.84 0-3.14-1.24-3.2-3.3h6.58c.06-.23.1-.56.1-.9 0-2.1-1.5-3.74-3.84-3.74-2.65 0-4.31 2.02-4.31 4.63a4.5 4.5 0 0 0 4.67 4.62c1.6 0 2.87-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.29-2.3 2.7-2.3Zm10.24 6.66c-1.86 0-3.17-1.43-3.17-3.26 0-1.82 1.31-3.27 3.15-3.27 1.07 0 1.94.51 2.46 1.26l1.14-.87a4.43 4.43 0 0 0-3.6-1.75 4.51 4.51 0 0 0-4.66 4.63c0 2.5 1.82 4.62 4.66 4.62 1.56 0 2.8-.68 3.6-1.75l-1.14-.87a2.95 2.95 0 0 1-2.44 1.26ZM65.85 44.5h2.56v-5.36h4.07V37H68.4v-2.99h4.79V31.9h-7.35v12.6Zm8.9 0h2.3v-5.81a2.48 2.48 0 0 1 2.17-1.2c.41 0 .72.06 1 .13v-2.25a2.52 2.52 0 0 0-.79-.12c-1.02 0-1.8.47-2.39 1.08v-.9h-2.29v9.07Zm9.43.27c1.07 0 2.15-.45 2.72-1.15v.88h2.29v-5.87c0-2-1.35-3.56-3.98-3.56-1.66 0-2.99.68-3.8 1.8l1.68 1.28a2.46 2.46 0 0 1 2.05-1.08c1.04 0 1.76.6 1.76 1.56v.24l-2.77.46c-1.94.33-3 1.35-3 2.72 0 1.68 1.24 2.72 3.05 2.72Zm-.79-2.83c0-.55.4-.95 1.35-1.11l2.16-.36v1.28c-.45.72-1.2 1.2-2.25 1.2-.77 0-1.26-.4-1.26-1Zm8.42 2.56h2.28v-5.92c.34-.58.96-1.35 2.1-1.35 1.12 0 1.8.75 1.8 1.96v5.31h2.31v-5.4c0-2.68-1.56-4.03-3.53-4.03-1.2 0-2.05.47-2.68 1.08v-.72h-2.28v9.07Zm15.44-1.8c-1.53 0-2.63-1.13-2.63-2.74 0-1.58 1.1-2.73 2.6-2.73.93 0 1.65.41 2.09 1.04l1.78-1.37a4.69 4.69 0 0 0-3.84-1.83c-3.13 0-5 2.25-5 4.9 0 2.64 1.87 4.89 5 4.89 1.66 0 3-.72 3.84-1.84l-1.78-1.36a2.42 2.42 0 0 1-2.06 1.04Zm13.54.32-1.63-1.3a2.91 2.91 0 0 1-2.34 1.09c-1.43 0-2.47-.69-2.69-2.38h6.36c.07-.3.14-.77.14-1.28 0-2.37-1.65-4.08-4.17-4.08-2.97 0-4.67 2.21-4.67 4.9 0 2.64 1.82 4.89 5.04 4.89 1.71 0 3.12-.7 3.96-1.84Zm-4.39-6.08c1.28 0 1.95.92 1.98 1.84h-4.17c.25-1.2 1.02-1.84 2.2-1.84Zm12.5 5.53c-2.38 0-4.07-1.86-4.07-4.27 0-2.41 1.7-4.27 4.07-4.27 1.44 0 2.57.7 3.3 1.73l2-1.56a6.53 6.53 0 0 0-5.3-2.56 6.55 6.55 0 0 0-6.7 6.66c0 3.6 2.72 6.66 6.7 6.66 2.28 0 4.16-1 5.3-2.57l-2-1.55a3.94 3.94 0 0 1-3.3 1.73Zm11.36-7.4a4.8 4.8 0 0 0-4.96 4.9 4.8 4.8 0 0 0 4.96 4.89 4.8 4.8 0 0 0 4.97-4.9 4.8 4.8 0 0 0-4.97-4.9Zm.04 7.63c-1.51 0-2.63-1.15-2.63-2.74 0-1.58 1.12-2.73 2.63-2.73 1.46 0 2.56 1.15 2.56 2.73 0 1.57-1.1 2.74-2.56 2.74Zm7.02 1.8h2.28v-5.92c.34-.58.96-1.35 2.1-1.35 1.13 0 1.8.75 1.8 1.96v5.31h2.31v-5.4c0-2.68-1.56-4.03-3.53-4.03-1.2 0-2.05.47-2.68 1.08v-.72h-2.28v9.07Zm11.09 0h2.28v-5.92c.35-.58.96-1.35 2.11-1.35 1.12 0 1.8.75 1.8 1.96v5.31h2.3v-5.4c0-2.68-1.56-4.03-3.52-4.03-1.2 0-2.06.47-2.69 1.08v-.72h-2.28v9.07Zm19.44-1.48-1.63-1.3a2.91 2.91 0 0 1-2.34 1.09c-1.43 0-2.47-.69-2.69-2.38h6.36c.07-.3.14-.77.14-1.28 0-2.37-1.66-4.08-4.18-4.08-2.97 0-4.66 2.21-4.66 4.9 0 2.64 1.82 4.89 5.04 4.89 1.71 0 3.12-.7 3.96-1.84Zm-4.39-6.08c1.28 0 1.94.92 1.98 1.84h-4.18c.26-1.2 1.03-1.84 2.2-1.84Zm10.75 5.76c-1.53 0-2.63-1.13-2.63-2.74 0-1.58 1.1-2.73 2.6-2.73.93 0 1.65.41 2.08 1.04l1.78-1.37a4.69 4.69 0 0 0-3.83-1.83c-3.13 0-5 2.25-5 4.9 0 2.64 1.87 4.89 5 4.89 1.66 0 2.99-.72 3.83-1.84l-1.78-1.36a2.42 2.42 0 0 1-2.05 1.04Zm6.2-1.51c0 2.21 1.09 3.49 3.35 3.49.76 0 1.3-.09 1.75-.29v-2c-.3.13-.72.2-1.35.2-.9 0-1.44-.4-1.44-1.4v-3.71h2.77v-2.05h-2.77v-2.27h-2.3v2.27h-1.7v2.05h1.7v3.7Z"
+				/>
+
+				<path
+					v-if="isConnectPlus"
+					:fill="isDark ? '#000091' : '#f5f5fe'"
+					d="M233 30.571V25.429H223.6V16H218.448V25.429H209V30.572H218.448V40H223.6V30.571H233Z"
+				/>
+			</svg>
+		</a>
+
+		<a
+			:href="infoUrl"
+			target="_blank"
+			rel="noopener noreferrer"
+			class="vd-france-connect-info-link text-decoration-none mt-3"
+		>
+			{{ locales.infoLinkLabel(isConnectPlus) }}
+
+			<VIcon
+				size="1em"
+				class="ml-1 mb-1"
+			>
+				{{ mdiOpenInNew }}
+			</VIcon>
+		</a>
+	</div>
+</template>
+
+<style lang="scss" scoped>
+.vd-france-connect-btn a {
+	color: #000091;
+
+  &:focus {
+    outline-offset: 3px;
+  }
+}
+
+.vd-france-connect-link {
+	background: #000091;
+	&:hover {
+		background: #1212ff;
+		transition: all 0.2s ease-in-out;
+	}
+
+	&:active {
+		background: #2323ff;
+	}
+
+  &:focus {
+    outline-offset: 3px;
+  }
+}
+
+.vd-france-connect-btn--dark {
+	.vd-france-connect-link {
+		color: #FFFFFF;
+		background-color: #8585F6;
+
+		&:hover {
+			background-color: #B1B1F9;
+		}
+
+		&:active {
+			background-color: #C6C6FB;
+		}
+	}
+
+	.vd-france-connect-info-link {
+		color: #8585F6;
+	}
+}
+
+.vd-france-connect-info-link {
+	background-image: linear-gradient(currentColor, currentColor);
+	background-position: 0% 100%;
+	background-repeat: no-repeat;
+	background-size: 100% 1px;
+
+	&:hover {
+		background-size: 100% 2px;
+	}
+}
+
+:deep(&:focus) {
+  border-radius: 0 !important;
+}
+</style>

package/src/components/FranceConnectBtn/locales.ts

@@ -0,0 +1,6 @@
+export const locales = {
+	btnLabel: (connectPlus: boolean) =>
+		`S’identifier avec FranceConnect${connectPlus ? '+' : ''}`,
+	infoLinkLabel: (connectPlus: boolean) =>
+		`Qu’est-ce que FranceConnect${connectPlus ? '+' : ''} ?`,
+}

package/src/components/FranceConnectBtn/tests/FranceConnectBtn.spec.ts

@@ -0,0 +1,62 @@
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import { vuetify } from '@tests/unit/setup'
+import FranceConnectBtn from '../FranceConnectBtn.vue'
+import { VThemeProvider } from 'vuetify/components'
+
+describe('FranceConnectBtn', () => {
+	it('renders correctly', () => {
+		const wrapper = mount(FranceConnectBtn, {
+			global: {
+				plugins: [vuetify],
+			},
+			propsData: {
+				href: 'https://app.franceconnect.gouv.fr/',
+			},
+		})
+
+		expect(wrapper.html()).toMatchSnapshot()
+		expect(wrapper.find('.vd-france-connect-link').attributes('href')).toBe('https://app.franceconnect.gouv.fr/')
+	})
+
+	it('renders correctly with connect-plus', () => {
+		const wrapper = mount(FranceConnectBtn, {
+			global: {
+				plugins: [vuetify],
+			},
+			propsData: {
+				href: 'https://app.franceconnect.gouv.fr/',
+				isConnectPlus: true,
+			},
+		})
+
+		expect(wrapper.html()).toMatchSnapshot()
+
+		const fillValue = wrapper.findAll('path').at(-1)?.attributes('fill')
+
+		expect(fillValue).toBe('#f5f5fe')
+	})
+
+	it('renders correctly in black', () => {
+		const wrapper = mount({
+			components: { FranceConnectBtn, VThemeProvider },
+			template: `
+                <VThemeProvider
+                    theme="dark"
+                    with-background
+                >
+                    <FranceConnectBtn href="https://app.franceconnect.gouv.fr/" isConnectPlus />
+                </VThemeProvider>`,
+		}, {
+			global: {
+				plugins: [vuetify],
+			},
+		})
+
+		expect(wrapper.html()).toMatchSnapshot()
+
+		const fillValue = wrapper.findAll('path').at(-1)?.attributes('fill')
+
+		expect(fillValue).toBe('#000091')
+	})
+})

package/src/components/FranceConnectBtn/tests/__snapshots__/FranceConnectBtn.spec.ts.snap

@@ -0,0 +1,36 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`FranceConnectBtn > renders correctly 1`] = `
+"<div data-v-dc72de41="" class="vd-france-connect-btn d-flex flex-column align-start"><a data-v-dc72de41="" href="https://app.franceconnect.gouv.fr/" aria-label="S’identifier avec FranceConnect" class="vd-france-connect-link d-inline-flex"><svg data-v-dc72de41="" viewBox="0 0 209 56" width="209px" height="56" xmlns="http://www.w3.org/2000/svg">
+      <path data-v-dc72de41="" fill="#000091" d="m47 19.1-15-8.68-15 8.76a.6.6 0 0 0-.3.53v16.94a.67.67 0 0 0 .3.53l15 8.6 14.99-8.7a.67.67 0 0 0 .3-.53V19.63a.6.6 0 0 0-.3-.53Z"></path>
+      <path data-v-dc72de41="" fill="#e1000f" d="m26.64 19.6-5.03 8.63-4.55-9.18 5.39-3.11 4.48 3.16-.29.5ZM47.3 36.58V19.62a.6.6 0 0 0-.3-.52l-15-8.68"></path>
+      <path data-v-dc72de41="" fill="#0063cb" d="M16.7 36.58 32 10.42v35.36l-15-8.6a.67.67 0 0 1-.3-.53V19.71v16.87Zm24.67-20.74L46.83 19l-4.5 9.15-5.38-9.24 4.42-3.07Z"></path>
+      <path data-v-dc72de41="" fill="#fff" d="M51.6 16.3 32.43 5.28a.93.93 0 0 0-.84 0L12.4 16.3a.89.89 0 0 0-.39.7v22a.89.89 0 0 0 .4.7l19.18 11.02a.93.93 0 0 0 .84 0L51.6 39.7A.89.89 0 0 0 52 39V17a.89.89 0 0 0-.4-.7ZM22.8 34.06h.08c-.04 0-.08 0-.08.05 0 .1.15 0 .2.1-.24 0-.46.1-.63.27 0 .06.1.06.15.06-.07.1-.23.05-.28.15l.1.05c-.05 0-.1 0-.1.05v.15c-.12 0-.17.1-.27.15.2.15.32 0 .52 0-.52.2-.95.48-1.48.63-.1 0 0 .15-.1.15.15.1.23-.05.38-.05-.66.38-1.34.7-2.04 1.13a.35.35 0 0 0-.1.2h-.2c-.1.05-.05.18-.15.28.23.15.5-.2.65 0 .05 0-.1.05-.2.05-.05 0-.05.1-.1.1H19c-.1.07-.2.12-.2.27a.22.22 0 0 0-.23.1c1.08 0 2.14-.2 3.15-.57.78-.4 1.48-.93 2.09-1.56l.05.1c-.15.43-.43.81-.81 1.08-.28.15-.48.37-.7.48-.15.08-.3.17-.43.27-.63.2-1.28.34-1.94.41l-.3.05-.67.1-2-1.13a.65.65 0 0 1-.28-.41.58.58 0 0 0 .09-.07.26.26 0 0 0-.11-.07v-.65a12.8 12.8 0 0 0 3.04-.94 8.75 8.75 0 0 0-3.04-1.34v-1.52c.55.1 1.1.22 1.64.4.41.15.8.34 1.18.57.15.14.3.27.48.38a.91.91 0 0 0 .8.05h.33a3.96 3.96 0 0 0 1.93-.9c0 .04.05.04.1.04-.07.4-.22.79-.42 1.14 0 .05-.05.15.05.2Zm2.82 3.57c.25-.1.4-.28.63-.38-.05.05-.05.15-.1.2a3.7 3.7 0 0 0-.53.4c-.57.5-1.1 1.04-1.59 1.61-.25.3-.53.58-.8.86l-.3.24-2.54-1.45c.36.03.73.02 1.08-.05a5 5 0 0 0 .86-.33v.1c.7-.27 1.23-.9 1.93-1.13.03 0 .13.1.23.05a1.88 1.88 0 0 1 1.5-.7c0 .05 0 .1.06.1h.02c-.15.13-.32.25-.5.38-.05.05 0 .1.05.1Zm-8.91-6.16v-.19c.52-.14 1.05-.2 1.59-.19a5.86 5.86 0 0 0-1.59.37Zm30.6 5.08a.67.67 0 0 1-.3.53L36.9 42.93a32.3 32.3 0 0 1-3.4-1.19 2.83 2.83 0 0 1-.05-2.24c.07-.3.2-.6.35-.88.02-.03.05-.05.05-.08h.01l.01-.03c.11-.19.24-.38.38-.55l.01-.02.02-.02.02-.01c0-.03.02-.05.05-.08.02-.05.07-.07.1-.12.17-.19.37-.36.58-.5.21-.08.43-.14.65-.18.81.06 1.62.17 2.42.33.1.01.19.05.27.1.3.06.62.04.9-.05a1.14 1.14 0 0 0 .86-.7 1.21 1.21 0 0 0 .05-1.07c-.17-.27 0-.43.19-.59l.06-.05c.09-.06.17-.14.23-.22.13-.25-.1-.4-.15-.63-.05-.1-.22-.05-.32-.2.35-.15.85-.43.63-.86-.16-.22-.38-.63-.1-.85.35-.2.85-.15 1-.48a1.14 1.14 0 0 0-.3-1.09l-.07-.1-.2-.32a6.9 6.9 0 0 0-.53-.76 4.3 4.3 0 0 1-.53-1.01c-.15-.38.05-.7.05-1.08.01-.73-.1-1.46-.33-2.15-.13-.35-.18-.73-.33-1.06-.02-.2-.1-.4-.22-.58a.37.37 0 0 1 0-.33c.2-.14.4-.3.58-.47a.57.57 0 0 0-.2-.71c-.33-.15-.3.33-.53.43h-.15c-.05-.13.05-.18.15-.28 0-.05 0-.15-.05-.15-.2 0-.38-.05-.43-.15a3.96 3.96 0 0 0-1.86-1.29c.19.06.38.1.58.1.34.08.69.04 1-.1.23-.07.28-.48.38-.7a.8.8 0 0 0-.15-.63c-.23-.33-.54-.6-.9-.76a9.13 9.13 0 0 1-.94-.48c-2.96-1.48-9.07-.2-9.53 0-.44.13-.86.29-1.26.48a3.92 3.92 0 0 0-2.36 2.46c-.57.38-1.03.9-1.34 1.51-.42.8-1.05 1.51-.95 2.41.1.78.28 1.49.43 2.3.04.27.1.53.2.8s0 .62.15.85c.07.15.02.33.22.43v.2c.05.05.05.1.16.1v.2c.43.42.8.9 1.1 1.43.1.28-.48.15-.7.05-.41-.27-.8-.6-1.13-.96a.18.18 0 0 0-.05.1c.2.36.9.78.53 1.01-.2.1-.43-.15-.63.05-.05.08 0 .18 0 .28-.28-.2-.58-.1-.86-.2-.2-.05-.25-.43-.48-.43-.6-.14-1.2-.25-1.8-.33-.58-.08-1.16-.14-1.75-.16V19.71a.6.6 0 0 1 .31-.53L32 10.42l15 8.68a.6.6 0 0 1 .3.52v16.93Zm-7.96-8.26a.32.32 0 0 1-.28.15l-.28.27c.1 0 0 .15.1.15-.2.23.08.7-.2.8-.37.1-.76.1-1.13 0a.72.72 0 0 1 .17-.02h.08a.38.38 0 0 0 .34-.13v-.2c0-.05-.05-.05-.1-.05a.16.16 0 0 1-.1.05.22.22 0 0 0-.16-.2.8.8 0 0 1-.72-.27.67.67 0 0 1 .44-.05c.13 0 .08-.23.23-.33h.16c.3-.37.87-.47.97-.84 0-.1-.28-.1-.49-.15a2.26 2.26 0 0 0-.82.05c-.36.05-.7.14-1.05.27.28-.2.6-.36.92-.47.24-.09.48-.15.72-.2l.13-.02.14-.03a.97.97 0 0 1 .55 0c.23.1.62.1.67.25.1.27-.15.54-.44.74-.05.08.15.14.15.23Z"></path>
+      <path data-v-dc72de41="" fill="#f5f5fe" d="M64.99 24.87a4.9 4.9 0 0 0 4.08 1.95c2.1 0 3.69-1.3 3.69-3.36 0-3.96-5.63-3.35-5.63-6.02 0-1.02.75-1.75 1.92-1.75 1.02 0 1.85.56 2.55 1.56l1.2-1.05a4.54 4.54 0 0 0-3.77-1.94c-2.07 0-3.53 1.45-3.53 3.21 0 3.93 5.64 3.35 5.64 6.04 0 1.09-.77 1.88-2.1 1.88-1.1 0-2.05-.56-2.86-1.61l-1.2 1.09Zm10.81-5.71 1.75-4.56H75.9l-1.44 4.56h1.34Zm4.82-3.46a1 1 0 0 0 1-1.01 1 1 0 0 0-1-1c-.56 0-1.02.45-1.02 1 0 .56.46 1.02 1.02 1.02Zm-.73 10.8h1.45v-8.57h-1.45v8.57Zm3.77-4.28c0 2.5 1.72 4.62 4.4 4.62 1.28 0 2.28-.5 3.04-1.36v1.02h1.45V13.75H91.1v5.2a3.89 3.89 0 0 0-3.04-1.36c-2.68 0-4.4 2.13-4.4 4.63Zm1.53 0c0-1.82 1.22-3.27 3.04-3.27 1.17 0 2.21.56 2.87 1.58v3.37a3.33 3.33 0 0 1-2.87 1.58c-1.82 0-3.04-1.45-3.04-3.26Zm18.02 2.87-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.84 0-3.15-1.24-3.2-3.3h6.58c.05-.23.1-.56.1-.9 0-2.1-1.5-3.74-3.84-3.74-2.65 0-4.32 2.02-4.32 4.63a4.5 4.5 0 0 0 4.68 4.62c1.6 0 2.87-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.29-2.3 2.7-2.3Zm6.32 7.68h1.45v-5.93c.54-.9 1.32-1.62 2.56-1.62 1.33 0 2.2.89 2.2 2.42v5.13h1.44v-5.18c0-2.44-1.43-3.73-3.35-3.73-1.27 0-2.16.55-2.85 1.31v-.97h-1.45v8.57Zm11.06-2.87c0 2.09 1.07 3.04 2.97 3.04.61 0 1.07-.07 1.48-.24v-1.29c-.32.14-.72.2-1.28.2-1.03 0-1.71-.37-1.71-1.71v-4.39h2.97v-1.3H118v-2.15h-1.46v2.14h-1.62v1.31h1.62v4.39Zm7.37-7.92a1 1 0 0 0 1-1.03 1 1 0 0 0-1-1c-.56 0-1.02.46-1.02 1 0 .57.46 1.03 1.02 1.03Zm-.73 10.79h1.45v-8.57h-1.45v8.57Zm3.38-8.57v1.31h1.61v7.26h1.47v-7.26h2.97v-1.3h-2.97v-1.1c0-1.12.64-1.78 1.61-1.78.5 0 .88.15 1.2.39l.65-1.2c-.47-.28-1.1-.5-1.88-.5-1.87 0-3.05 1.3-3.05 3.13v1.05h-1.61Zm8.54-2.22a1 1 0 0 0 1-1.03 1 1 0 0 0-1-1c-.56 0-1.02.46-1.02 1 0 .57.46 1.03 1.02 1.03Zm-.73 10.79h1.44v-8.57h-1.44v8.57Zm12.11-1.41-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.83 0-3.14-1.24-3.2-3.3h6.59c.05-.23.1-.56.1-.9 0-2.1-1.51-3.74-3.84-3.74-2.66 0-4.32 2.02-4.32 4.63a4.5 4.5 0 0 0 4.67 4.62c1.6 0 2.88-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.3-2.3 2.7-2.3Zm6.33 7.68h1.44v-5.88c.53-.87 1.26-1.45 2.38-1.45.34 0 .6.04.85.1v-1.4a3.13 3.13 0 0 0-3.23 1.14v-1.08h-1.44v8.57Zm13.66.24c1.11 0 2.23-.5 2.88-1.33v1.09h1.44v-5.75c0-1.88-1.29-3.16-3.47-3.16-1.5 0-2.7.63-3.45 1.65l1.1.83a2.78 2.78 0 0 1 2.3-1.19c1.23 0 2.08.68 2.08 1.87v.6l-2.9.47c-1.81.31-2.8 1.23-2.8 2.52 0 1.46 1.14 2.4 2.82 2.4Zm-1.36-2.45c0-.73.53-1.26 1.7-1.46l2.54-.43v1.69a3 3 0 0 1-2.64 1.46c-1 0-1.6-.53-1.6-1.26Zm7.2-6.36 3.36 8.57h1.9l3.35-8.57h-1.56L172.54 25l-2.74-7.06h-1.56Zm17.86 7.16-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.84 0-3.14-1.24-3.2-3.3h6.58c.06-.23.1-.56.1-.9 0-2.1-1.5-3.74-3.84-3.74-2.65 0-4.31 2.02-4.31 4.63a4.5 4.5 0 0 0 4.67 4.62c1.6 0 2.87-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.29-2.3 2.7-2.3Zm10.24 6.66c-1.86 0-3.17-1.43-3.17-3.26 0-1.82 1.31-3.27 3.15-3.27 1.07 0 1.94.51 2.46 1.26l1.14-.87a4.43 4.43 0 0 0-3.6-1.75 4.51 4.51 0 0 0-4.66 4.63c0 2.5 1.82 4.62 4.66 4.62 1.56 0 2.8-.68 3.6-1.75l-1.14-.87a2.95 2.95 0 0 1-2.44 1.26ZM65.85 44.5h2.56v-5.36h4.07V37H68.4v-2.99h4.79V31.9h-7.35v12.6Zm8.9 0h2.3v-5.81a2.48 2.48 0 0 1 2.17-1.2c.41 0 .72.06 1 .13v-2.25a2.52 2.52 0 0 0-.79-.12c-1.02 0-1.8.47-2.39 1.08v-.9h-2.29v9.07Zm9.43.27c1.07 0 2.15-.45 2.72-1.15v.88h2.29v-5.87c0-2-1.35-3.56-3.98-3.56-1.66 0-2.99.68-3.8 1.8l1.68 1.28a2.46 2.46 0 0 1 2.05-1.08c1.04 0 1.76.6 1.76 1.56v.24l-2.77.46c-1.94.33-3 1.35-3 2.72 0 1.68 1.24 2.72 3.05 2.72Zm-.79-2.83c0-.55.4-.95 1.35-1.11l2.16-.36v1.28c-.45.72-1.2 1.2-2.25 1.2-.77 0-1.26-.4-1.26-1Zm8.42 2.56h2.28v-5.92c.34-.58.96-1.35 2.1-1.35 1.12 0 1.8.75 1.8 1.96v5.31h2.31v-5.4c0-2.68-1.56-4.03-3.53-4.03-1.2 0-2.05.47-2.68 1.08v-.72h-2.28v9.07Zm15.44-1.8c-1.53 0-2.63-1.13-2.63-2.74 0-1.58 1.1-2.73 2.6-2.73.93 0 1.65.41 2.09 1.04l1.78-1.37a4.69 4.69 0 0 0-3.84-1.83c-3.13 0-5 2.25-5 4.9 0 2.64 1.87 4.89 5 4.89 1.66 0 3-.72 3.84-1.84l-1.78-1.36a2.42 2.42 0 0 1-2.06 1.04Zm13.54.32-1.63-1.3a2.91 2.91 0 0 1-2.34 1.09c-1.43 0-2.47-.69-2.69-2.38h6.36c.07-.3.14-.77.14-1.28 0-2.37-1.65-4.08-4.17-4.08-2.97 0-4.67 2.21-4.67 4.9 0 2.64 1.82 4.89 5.04 4.89 1.71 0 3.12-.7 3.96-1.84Zm-4.39-6.08c1.28 0 1.95.92 1.98 1.84h-4.17c.25-1.2 1.02-1.84 2.2-1.84Zm12.5 5.53c-2.38 0-4.07-1.86-4.07-4.27 0-2.41 1.7-4.27 4.07-4.27 1.44 0 2.57.7 3.3 1.73l2-1.56a6.53 6.53 0 0 0-5.3-2.56 6.55 6.55 0 0 0-6.7 6.66c0 3.6 2.72 6.66 6.7 6.66 2.28 0 4.16-1 5.3-2.57l-2-1.55a3.94 3.94 0 0 1-3.3 1.73Zm11.36-7.4a4.8 4.8 0 0 0-4.96 4.9 4.8 4.8 0 0 0 4.96 4.89 4.8 4.8 0 0 0 4.97-4.9 4.8 4.8 0 0 0-4.97-4.9Zm.04 7.63c-1.51 0-2.63-1.15-2.63-2.74 0-1.58 1.12-2.73 2.63-2.73 1.46 0 2.56 1.15 2.56 2.73 0 1.57-1.1 2.74-2.56 2.74Zm7.02 1.8h2.28v-5.92c.34-.58.96-1.35 2.1-1.35 1.13 0 1.8.75 1.8 1.96v5.31h2.31v-5.4c0-2.68-1.56-4.03-3.53-4.03-1.2 0-2.05.47-2.68 1.08v-.72h-2.28v9.07Zm11.09 0h2.28v-5.92c.35-.58.96-1.35 2.11-1.35 1.12 0 1.8.75 1.8 1.96v5.31h2.3v-5.4c0-2.68-1.56-4.03-3.52-4.03-1.2 0-2.06.47-2.69 1.08v-.72h-2.28v9.07Zm19.44-1.48-1.63-1.3a2.91 2.91 0 0 1-2.34 1.09c-1.43 0-2.47-.69-2.69-2.38h6.36c.07-.3.14-.77.14-1.28 0-2.37-1.66-4.08-4.18-4.08-2.97 0-4.66 2.21-4.66 4.9 0 2.64 1.82 4.89 5.04 4.89 1.71 0 3.12-.7 3.96-1.84Zm-4.39-6.08c1.28 0 1.94.92 1.98 1.84h-4.18c.26-1.2 1.03-1.84 2.2-1.84Zm10.75 5.76c-1.53 0-2.63-1.13-2.63-2.74 0-1.58 1.1-2.73 2.6-2.73.93 0 1.65.41 2.08 1.04l1.78-1.37a4.69 4.69 0 0 0-3.83-1.83c-3.13 0-5 2.25-5 4.9 0 2.64 1.87 4.89 5 4.89 1.66 0 2.99-.72 3.83-1.84l-1.78-1.36a2.42 2.42 0 0 1-2.05 1.04Zm6.2-1.51c0 2.21 1.09 3.49 3.35 3.49.76 0 1.3-.09 1.75-.29v-2c-.3.13-.72.2-1.35.2-.9 0-1.44-.4-1.44-1.4v-3.71h2.77v-2.05h-2.77v-2.27h-2.3v2.27h-1.7v2.05h1.7v3.7Z"></path>
+      <!--v-if-->
+    </svg></a><a data-v-dc72de41="" href="https://franceconnect.gouv.fr/" target="_blank" rel="noopener noreferrer" class="vd-france-connect-info-link text-decoration-none mt-3">Qu’est-ce que FranceConnect ? <i data-v-dc72de41="" class="M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z mdi v-icon notranslate v-theme--light ml-1 mb-1" style="font-size: 1em; height: 1em; width: 1em;" aria-hidden="true"></i></a></div>"
+`;
+
+exports[`FranceConnectBtn > renders correctly in black 1`] = `
+"<div class="v-theme-provider v-theme--dark">
+  <div data-v-dc72de41="" class="vd-france-connect-btn d-flex flex-column align-start vd-france-connect-btn--dark"><a data-v-dc72de41="" href="https://app.franceconnect.gouv.fr/" aria-label="S’identifier avec FranceConnect+" class="vd-france-connect-link d-inline-flex"><svg data-v-dc72de41="" viewBox="0 0 245 56" width="245px" height="56" xmlns="http://www.w3.org/2000/svg">
+        <path data-v-dc72de41="" fill="#000091" d="m47 19.1-15-8.68-15 8.76a.6.6 0 0 0-.3.53v16.94a.67.67 0 0 0 .3.53l15 8.6 14.99-8.7a.67.67 0 0 0 .3-.53V19.63a.6.6 0 0 0-.3-.53Z"></path>
+        <path data-v-dc72de41="" fill="#e1000f" d="m26.64 19.6-5.03 8.63-4.55-9.18 5.39-3.11 4.48 3.16-.29.5ZM47.3 36.58V19.62a.6.6 0 0 0-.3-.52l-15-8.68"></path>
+        <path data-v-dc72de41="" fill="#0063cb" d="M16.7 36.58 32 10.42v35.36l-15-8.6a.67.67 0 0 1-.3-.53V19.71v16.87Zm24.67-20.74L46.83 19l-4.5 9.15-5.38-9.24 4.42-3.07Z"></path>
+        <path data-v-dc72de41="" fill="#fff" d="M51.6 16.3 32.43 5.28a.93.93 0 0 0-.84 0L12.4 16.3a.89.89 0 0 0-.39.7v22a.89.89 0 0 0 .4.7l19.18 11.02a.93.93 0 0 0 .84 0L51.6 39.7A.89.89 0 0 0 52 39V17a.89.89 0 0 0-.4-.7ZM22.8 34.06h.08c-.04 0-.08 0-.08.05 0 .1.15 0 .2.1-.24 0-.46.1-.63.27 0 .06.1.06.15.06-.07.1-.23.05-.28.15l.1.05c-.05 0-.1 0-.1.05v.15c-.12 0-.17.1-.27.15.2.15.32 0 .52 0-.52.2-.95.48-1.48.63-.1 0 0 .15-.1.15.15.1.23-.05.38-.05-.66.38-1.34.7-2.04 1.13a.35.35 0 0 0-.1.2h-.2c-.1.05-.05.18-.15.28.23.15.5-.2.65 0 .05 0-.1.05-.2.05-.05 0-.05.1-.1.1H19c-.1.07-.2.12-.2.27a.22.22 0 0 0-.23.1c1.08 0 2.14-.2 3.15-.57.78-.4 1.48-.93 2.09-1.56l.05.1c-.15.43-.43.81-.81 1.08-.28.15-.48.37-.7.48-.15.08-.3.17-.43.27-.63.2-1.28.34-1.94.41l-.3.05-.67.1-2-1.13a.65.65 0 0 1-.28-.41.58.58 0 0 0 .09-.07.26.26 0 0 0-.11-.07v-.65a12.8 12.8 0 0 0 3.04-.94 8.75 8.75 0 0 0-3.04-1.34v-1.52c.55.1 1.1.22 1.64.4.41.15.8.34 1.18.57.15.14.3.27.48.38a.91.91 0 0 0 .8.05h.33a3.96 3.96 0 0 0 1.93-.9c0 .04.05.04.1.04-.07.4-.22.79-.42 1.14 0 .05-.05.15.05.2Zm2.82 3.57c.25-.1.4-.28.63-.38-.05.05-.05.15-.1.2a3.7 3.7 0 0 0-.53.4c-.57.5-1.1 1.04-1.59 1.61-.25.3-.53.58-.8.86l-.3.24-2.54-1.45c.36.03.73.02 1.08-.05a5 5 0 0 0 .86-.33v.1c.7-.27 1.23-.9 1.93-1.13.03 0 .13.1.23.05a1.88 1.88 0 0 1 1.5-.7c0 .05 0 .1.06.1h.02c-.15.13-.32.25-.5.38-.05.05 0 .1.05.1Zm-8.91-6.16v-.19c.52-.14 1.05-.2 1.59-.19a5.86 5.86 0 0 0-1.59.37Zm30.6 5.08a.67.67 0 0 1-.3.53L36.9 42.93a32.3 32.3 0 0 1-3.4-1.19 2.83 2.83 0 0 1-.05-2.24c.07-.3.2-.6.35-.88.02-.03.05-.05.05-.08h.01l.01-.03c.11-.19.24-.38.38-.55l.01-.02.02-.02.02-.01c0-.03.02-.05.05-.08.02-.05.07-.07.1-.12.17-.19.37-.36.58-.5.21-.08.43-.14.65-.18.81.06 1.62.17 2.42.33.1.01.19.05.27.1.3.06.62.04.9-.05a1.14 1.14 0 0 0 .86-.7 1.21 1.21 0 0 0 .05-1.07c-.17-.27 0-.43.19-.59l.06-.05c.09-.06.17-.14.23-.22.13-.25-.1-.4-.15-.63-.05-.1-.22-.05-.32-.2.35-.15.85-.43.63-.86-.16-.22-.38-.63-.1-.85.35-.2.85-.15 1-.48a1.14 1.14 0 0 0-.3-1.09l-.07-.1-.2-.32a6.9 6.9 0 0 0-.53-.76 4.3 4.3 0 0 1-.53-1.01c-.15-.38.05-.7.05-1.08.01-.73-.1-1.46-.33-2.15-.13-.35-.18-.73-.33-1.06-.02-.2-.1-.4-.22-.58a.37.37 0 0 1 0-.33c.2-.14.4-.3.58-.47a.57.57 0 0 0-.2-.71c-.33-.15-.3.33-.53.43h-.15c-.05-.13.05-.18.15-.28 0-.05 0-.15-.05-.15-.2 0-.38-.05-.43-.15a3.96 3.96 0 0 0-1.86-1.29c.19.06.38.1.58.1.34.08.69.04 1-.1.23-.07.28-.48.38-.7a.8.8 0 0 0-.15-.63c-.23-.33-.54-.6-.9-.76a9.13 9.13 0 0 1-.94-.48c-2.96-1.48-9.07-.2-9.53 0-.44.13-.86.29-1.26.48a3.92 3.92 0 0 0-2.36 2.46c-.57.38-1.03.9-1.34 1.51-.42.8-1.05 1.51-.95 2.41.1.78.28 1.49.43 2.3.04.27.1.53.2.8s0 .62.15.85c.07.15.02.33.22.43v.2c.05.05.05.1.16.1v.2c.43.42.8.9 1.1 1.43.1.28-.48.15-.7.05-.41-.27-.8-.6-1.13-.96a.18.18 0 0 0-.05.1c.2.36.9.78.53 1.01-.2.1-.43-.15-.63.05-.05.08 0 .18 0 .28-.28-.2-.58-.1-.86-.2-.2-.05-.25-.43-.48-.43-.6-.14-1.2-.25-1.8-.33-.58-.08-1.16-.14-1.75-.16V19.71a.6.6 0 0 1 .31-.53L32 10.42l15 8.68a.6.6 0 0 1 .3.52v16.93Zm-7.96-8.26a.32.32 0 0 1-.28.15l-.28.27c.1 0 0 .15.1.15-.2.23.08.7-.2.8-.37.1-.76.1-1.13 0a.72.72 0 0 1 .17-.02h.08a.38.38 0 0 0 .34-.13v-.2c0-.05-.05-.05-.1-.05a.16.16 0 0 1-.1.05.22.22 0 0 0-.16-.2.8.8 0 0 1-.72-.27.67.67 0 0 1 .44-.05c.13 0 .08-.23.23-.33h.16c.3-.37.87-.47.97-.84 0-.1-.28-.1-.49-.15a2.26 2.26 0 0 0-.82.05c-.36.05-.7.14-1.05.27.28-.2.6-.36.92-.47.24-.09.48-.15.72-.2l.13-.02.14-.03a.97.97 0 0 1 .55 0c.23.1.62.1.67.25.1.27-.15.54-.44.74-.05.08.15.14.15.23Z"></path>
+        <path data-v-dc72de41="" fill="#000091" d="M64.99 24.87a4.9 4.9 0 0 0 4.08 1.95c2.1 0 3.69-1.3 3.69-3.36 0-3.96-5.63-3.35-5.63-6.02 0-1.02.75-1.75 1.92-1.75 1.02 0 1.85.56 2.55 1.56l1.2-1.05a4.54 4.54 0 0 0-3.77-1.94c-2.07 0-3.53 1.45-3.53 3.21 0 3.93 5.64 3.35 5.64 6.04 0 1.09-.77 1.88-2.1 1.88-1.1 0-2.05-.56-2.86-1.61l-1.2 1.09Zm10.81-5.71 1.75-4.56H75.9l-1.44 4.56h1.34Zm4.82-3.46a1 1 0 0 0 1-1.01 1 1 0 0 0-1-1c-.56 0-1.02.45-1.02 1 0 .56.46 1.02 1.02 1.02Zm-.73 10.8h1.45v-8.57h-1.45v8.57Zm3.77-4.28c0 2.5 1.72 4.62 4.4 4.62 1.28 0 2.28-.5 3.04-1.36v1.02h1.45V13.75H91.1v5.2a3.89 3.89 0 0 0-3.04-1.36c-2.68 0-4.4 2.13-4.4 4.63Zm1.53 0c0-1.82 1.22-3.27 3.04-3.27 1.17 0 2.21.56 2.87 1.58v3.37a3.33 3.33 0 0 1-2.87 1.58c-1.82 0-3.04-1.45-3.04-3.26Zm18.02 2.87-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.84 0-3.15-1.24-3.2-3.3h6.58c.05-.23.1-.56.1-.9 0-2.1-1.5-3.74-3.84-3.74-2.65 0-4.32 2.02-4.32 4.63a4.5 4.5 0 0 0 4.68 4.62c1.6 0 2.87-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.29-2.3 2.7-2.3Zm6.32 7.68h1.45v-5.93c.54-.9 1.32-1.62 2.56-1.62 1.33 0 2.2.89 2.2 2.42v5.13h1.44v-5.18c0-2.44-1.43-3.73-3.35-3.73-1.27 0-2.16.55-2.85 1.31v-.97h-1.45v8.57Zm11.06-2.87c0 2.09 1.07 3.04 2.97 3.04.61 0 1.07-.07 1.48-.24v-1.29c-.32.14-.72.2-1.28.2-1.03 0-1.71-.37-1.71-1.71v-4.39h2.97v-1.3H118v-2.15h-1.46v2.14h-1.62v1.31h1.62v4.39Zm7.37-7.92a1 1 0 0 0 1-1.03 1 1 0 0 0-1-1c-.56 0-1.02.46-1.02 1 0 .57.46 1.03 1.02 1.03Zm-.73 10.79h1.45v-8.57h-1.45v8.57Zm3.38-8.57v1.31h1.61v7.26h1.47v-7.26h2.97v-1.3h-2.97v-1.1c0-1.12.64-1.78 1.61-1.78.5 0 .88.15 1.2.39l.65-1.2c-.47-.28-1.1-.5-1.88-.5-1.87 0-3.05 1.3-3.05 3.13v1.05h-1.61Zm8.54-2.22a1 1 0 0 0 1-1.03 1 1 0 0 0-1-1c-.56 0-1.02.46-1.02 1 0 .57.46 1.03 1.02 1.03Zm-.73 10.79h1.44v-8.57h-1.44v8.57Zm12.11-1.41-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.83 0-3.14-1.24-3.2-3.3h6.59c.05-.23.1-.56.1-.9 0-2.1-1.51-3.74-3.84-3.74-2.66 0-4.32 2.02-4.32 4.63a4.5 4.5 0 0 0 4.67 4.62c1.6 0 2.88-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.3-2.3 2.7-2.3Zm6.33 7.68h1.44v-5.88c.53-.87 1.26-1.45 2.38-1.45.34 0 .6.04.85.1v-1.4a3.13 3.13 0 0 0-3.23 1.14v-1.08h-1.44v8.57Zm13.66.24c1.11 0 2.23-.5 2.88-1.33v1.09h1.44v-5.75c0-1.88-1.29-3.16-3.47-3.16-1.5 0-2.7.63-3.45 1.65l1.1.83a2.78 2.78 0 0 1 2.3-1.19c1.23 0 2.08.68 2.08 1.87v.6l-2.9.47c-1.81.31-2.8 1.23-2.8 2.52 0 1.46 1.14 2.4 2.82 2.4Zm-1.36-2.45c0-.73.53-1.26 1.7-1.46l2.54-.43v1.69a3 3 0 0 1-2.64 1.46c-1 0-1.6-.53-1.6-1.26Zm7.2-6.36 3.36 8.57h1.9l3.35-8.57h-1.56L172.54 25l-2.74-7.06h-1.56Zm17.86 7.16-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.84 0-3.14-1.24-3.2-3.3h6.58c.06-.23.1-.56.1-.9 0-2.1-1.5-3.74-3.84-3.74-2.65 0-4.31 2.02-4.31 4.63a4.5 4.5 0 0 0 4.67 4.62c1.6 0 2.87-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.29-2.3 2.7-2.3Zm10.24 6.66c-1.86 0-3.17-1.43-3.17-3.26 0-1.82 1.31-3.27 3.15-3.27 1.07 0 1.94.51 2.46 1.26l1.14-.87a4.43 4.43 0 0 0-3.6-1.75 4.51 4.51 0 0 0-4.66 4.63c0 2.5 1.82 4.62 4.66 4.62 1.56 0 2.8-.68 3.6-1.75l-1.14-.87a2.95 2.95 0 0 1-2.44 1.26ZM65.85 44.5h2.56v-5.36h4.07V37H68.4v-2.99h4.79V31.9h-7.35v12.6Zm8.9 0h2.3v-5.81a2.48 2.48 0 0 1 2.17-1.2c.41 0 .72.06 1 .13v-2.25a2.52 2.52 0 0 0-.79-.12c-1.02 0-1.8.47-2.39 1.08v-.9h-2.29v9.07Zm9.43.27c1.07 0 2.15-.45 2.72-1.15v.88h2.29v-5.87c0-2-1.35-3.56-3.98-3.56-1.66 0-2.99.68-3.8 1.8l1.68 1.28a2.46 2.46 0 0 1 2.05-1.08c1.04 0 1.76.6 1.76 1.56v.24l-2.77.46c-1.94.33-3 1.35-3 2.72 0 1.68 1.24 2.72 3.05 2.72Zm-.79-2.83c0-.55.4-.95 1.35-1.11l2.16-.36v1.28c-.45.72-1.2 1.2-2.25 1.2-.77 0-1.26-.4-1.26-1Zm8.42 2.56h2.28v-5.92c.34-.58.96-1.35 2.1-1.35 1.12 0 1.8.75 1.8 1.96v5.31h2.31v-5.4c0-2.68-1.56-4.03-3.53-4.03-1.2 0-2.05.47-2.68 1.08v-.72h-2.28v9.07Zm15.44-1.8c-1.53 0-2.63-1.13-2.63-2.74 0-1.58 1.1-2.73 2.6-2.73.93 0 1.65.41 2.09 1.04l1.78-1.37a4.69 4.69 0 0 0-3.84-1.83c-3.13 0-5 2.25-5 4.9 0 2.64 1.87 4.89 5 4.89 1.66 0 3-.72 3.84-1.84l-1.78-1.36a2.42 2.42 0 0 1-2.06 1.04Zm13.54.32-1.63-1.3a2.91 2.91 0 0 1-2.34 1.09c-1.43 0-2.47-.69-2.69-2.38h6.36c.07-.3.14-.77.14-1.28 0-2.37-1.65-4.08-4.17-4.08-2.97 0-4.67 2.21-4.67 4.9 0 2.64 1.82 4.89 5.04 4.89 1.71 0 3.12-.7 3.96-1.84Zm-4.39-6.08c1.28 0 1.95.92 1.98 1.84h-4.17c.25-1.2 1.02-1.84 2.2-1.84Zm12.5 5.53c-2.38 0-4.07-1.86-4.07-4.27 0-2.41 1.7-4.27 4.07-4.27 1.44 0 2.57.7 3.3 1.73l2-1.56a6.53 6.53 0 0 0-5.3-2.56 6.55 6.55 0 0 0-6.7 6.66c0 3.6 2.72 6.66 6.7 6.66 2.28 0 4.16-1 5.3-2.57l-2-1.55a3.94 3.94 0 0 1-3.3 1.73Zm11.36-7.4a4.8 4.8 0 0 0-4.96 4.9 4.8 4.8 0 0 0 4.96 4.89 4.8 4.8 0 0 0 4.97-4.9 4.8 4.8 0 0 0-4.97-4.9Zm.04 7.63c-1.51 0-2.63-1.15-2.63-2.74 0-1.58 1.12-2.73 2.63-2.73 1.46 0 2.56 1.15 2.56 2.73 0 1.57-1.1 2.74-2.56 2.74Zm7.02 1.8h2.28v-5.92c.34-.58.96-1.35 2.1-1.35 1.13 0 1.8.75 1.8 1.96v5.31h2.31v-5.4c0-2.68-1.56-4.03-3.53-4.03-1.2 0-2.05.47-2.68 1.08v-.72h-2.28v9.07Zm11.09 0h2.28v-5.92c.35-.58.96-1.35 2.11-1.35 1.12 0 1.8.75 1.8 1.96v5.31h2.3v-5.4c0-2.68-1.56-4.03-3.52-4.03-1.2 0-2.06.47-2.69 1.08v-.72h-2.28v9.07Zm19.44-1.48-1.63-1.3a2.91 2.91 0 0 1-2.34 1.09c-1.43 0-2.47-.69-2.69-2.38h6.36c.07-.3.14-.77.14-1.28 0-2.37-1.66-4.08-4.18-4.08-2.97 0-4.66 2.21-4.66 4.9 0 2.64 1.82 4.89 5.04 4.89 1.71 0 3.12-.7 3.96-1.84Zm-4.39-6.08c1.28 0 1.94.92 1.98 1.84h-4.18c.26-1.2 1.03-1.84 2.2-1.84Zm10.75 5.76c-1.53 0-2.63-1.13-2.63-2.74 0-1.58 1.1-2.73 2.6-2.73.93 0 1.65.41 2.08 1.04l1.78-1.37a4.69 4.69 0 0 0-3.83-1.83c-3.13 0-5 2.25-5 4.9 0 2.64 1.87 4.89 5 4.89 1.66 0 2.99-.72 3.83-1.84l-1.78-1.36a2.42 2.42 0 0 1-2.05 1.04Zm6.2-1.51c0 2.21 1.09 3.49 3.35 3.49.76 0 1.3-.09 1.75-.29v-2c-.3.13-.72.2-1.35.2-.9 0-1.44-.4-1.44-1.4v-3.71h2.77v-2.05h-2.77v-2.27h-2.3v2.27h-1.7v2.05h1.7v3.7Z"></path>
+        <path data-v-dc72de41="" fill="#000091" d="M233 30.571V25.429H223.6V16H218.448V25.429H209V30.572H218.448V40H223.6V30.571H233Z"></path>
+      </svg></a><a data-v-dc72de41="" href="https://franceconnect.gouv.fr/france-connect-plus" target="_blank" rel="noopener noreferrer" class="vd-france-connect-info-link text-decoration-none mt-3">Qu’est-ce que FranceConnect+ ? <i data-v-dc72de41="" class="M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z mdi v-icon notranslate v-theme--dark ml-1 mb-1" style="font-size: 1em; height: 1em; width: 1em;" aria-hidden="true"></i></a></div>
+</div>"
+`;
+
+exports[`FranceConnectBtn > renders correctly with connect-plus 1`] = `
+"<div data-v-dc72de41="" class="vd-france-connect-btn d-flex flex-column align-start"><a data-v-dc72de41="" href="https://app.franceconnect.gouv.fr/" aria-label="S’identifier avec FranceConnect+" class="vd-france-connect-link d-inline-flex"><svg data-v-dc72de41="" viewBox="0 0 245 56" width="245px" height="56" xmlns="http://www.w3.org/2000/svg">
+      <path data-v-dc72de41="" fill="#000091" d="m47 19.1-15-8.68-15 8.76a.6.6 0 0 0-.3.53v16.94a.67.67 0 0 0 .3.53l15 8.6 14.99-8.7a.67.67 0 0 0 .3-.53V19.63a.6.6 0 0 0-.3-.53Z"></path>
+      <path data-v-dc72de41="" fill="#e1000f" d="m26.64 19.6-5.03 8.63-4.55-9.18 5.39-3.11 4.48 3.16-.29.5ZM47.3 36.58V19.62a.6.6 0 0 0-.3-.52l-15-8.68"></path>
+      <path data-v-dc72de41="" fill="#0063cb" d="M16.7 36.58 32 10.42v35.36l-15-8.6a.67.67 0 0 1-.3-.53V19.71v16.87Zm24.67-20.74L46.83 19l-4.5 9.15-5.38-9.24 4.42-3.07Z"></path>
+      <path data-v-dc72de41="" fill="#fff" d="M51.6 16.3 32.43 5.28a.93.93 0 0 0-.84 0L12.4 16.3a.89.89 0 0 0-.39.7v22a.89.89 0 0 0 .4.7l19.18 11.02a.93.93 0 0 0 .84 0L51.6 39.7A.89.89 0 0 0 52 39V17a.89.89 0 0 0-.4-.7ZM22.8 34.06h.08c-.04 0-.08 0-.08.05 0 .1.15 0 .2.1-.24 0-.46.1-.63.27 0 .06.1.06.15.06-.07.1-.23.05-.28.15l.1.05c-.05 0-.1 0-.1.05v.15c-.12 0-.17.1-.27.15.2.15.32 0 .52 0-.52.2-.95.48-1.48.63-.1 0 0 .15-.1.15.15.1.23-.05.38-.05-.66.38-1.34.7-2.04 1.13a.35.35 0 0 0-.1.2h-.2c-.1.05-.05.18-.15.28.23.15.5-.2.65 0 .05 0-.1.05-.2.05-.05 0-.05.1-.1.1H19c-.1.07-.2.12-.2.27a.22.22 0 0 0-.23.1c1.08 0 2.14-.2 3.15-.57.78-.4 1.48-.93 2.09-1.56l.05.1c-.15.43-.43.81-.81 1.08-.28.15-.48.37-.7.48-.15.08-.3.17-.43.27-.63.2-1.28.34-1.94.41l-.3.05-.67.1-2-1.13a.65.65 0 0 1-.28-.41.58.58 0 0 0 .09-.07.26.26 0 0 0-.11-.07v-.65a12.8 12.8 0 0 0 3.04-.94 8.75 8.75 0 0 0-3.04-1.34v-1.52c.55.1 1.1.22 1.64.4.41.15.8.34 1.18.57.15.14.3.27.48.38a.91.91 0 0 0 .8.05h.33a3.96 3.96 0 0 0 1.93-.9c0 .04.05.04.1.04-.07.4-.22.79-.42 1.14 0 .05-.05.15.05.2Zm2.82 3.57c.25-.1.4-.28.63-.38-.05.05-.05.15-.1.2a3.7 3.7 0 0 0-.53.4c-.57.5-1.1 1.04-1.59 1.61-.25.3-.53.58-.8.86l-.3.24-2.54-1.45c.36.03.73.02 1.08-.05a5 5 0 0 0 .86-.33v.1c.7-.27 1.23-.9 1.93-1.13.03 0 .13.1.23.05a1.88 1.88 0 0 1 1.5-.7c0 .05 0 .1.06.1h.02c-.15.13-.32.25-.5.38-.05.05 0 .1.05.1Zm-8.91-6.16v-.19c.52-.14 1.05-.2 1.59-.19a5.86 5.86 0 0 0-1.59.37Zm30.6 5.08a.67.67 0 0 1-.3.53L36.9 42.93a32.3 32.3 0 0 1-3.4-1.19 2.83 2.83 0 0 1-.05-2.24c.07-.3.2-.6.35-.88.02-.03.05-.05.05-.08h.01l.01-.03c.11-.19.24-.38.38-.55l.01-.02.02-.02.02-.01c0-.03.02-.05.05-.08.02-.05.07-.07.1-.12.17-.19.37-.36.58-.5.21-.08.43-.14.65-.18.81.06 1.62.17 2.42.33.1.01.19.05.27.1.3.06.62.04.9-.05a1.14 1.14 0 0 0 .86-.7 1.21 1.21 0 0 0 .05-1.07c-.17-.27 0-.43.19-.59l.06-.05c.09-.06.17-.14.23-.22.13-.25-.1-.4-.15-.63-.05-.1-.22-.05-.32-.2.35-.15.85-.43.63-.86-.16-.22-.38-.63-.1-.85.35-.2.85-.15 1-.48a1.14 1.14 0 0 0-.3-1.09l-.07-.1-.2-.32a6.9 6.9 0 0 0-.53-.76 4.3 4.3 0 0 1-.53-1.01c-.15-.38.05-.7.05-1.08.01-.73-.1-1.46-.33-2.15-.13-.35-.18-.73-.33-1.06-.02-.2-.1-.4-.22-.58a.37.37 0 0 1 0-.33c.2-.14.4-.3.58-.47a.57.57 0 0 0-.2-.71c-.33-.15-.3.33-.53.43h-.15c-.05-.13.05-.18.15-.28 0-.05 0-.15-.05-.15-.2 0-.38-.05-.43-.15a3.96 3.96 0 0 0-1.86-1.29c.19.06.38.1.58.1.34.08.69.04 1-.1.23-.07.28-.48.38-.7a.8.8 0 0 0-.15-.63c-.23-.33-.54-.6-.9-.76a9.13 9.13 0 0 1-.94-.48c-2.96-1.48-9.07-.2-9.53 0-.44.13-.86.29-1.26.48a3.92 3.92 0 0 0-2.36 2.46c-.57.38-1.03.9-1.34 1.51-.42.8-1.05 1.51-.95 2.41.1.78.28 1.49.43 2.3.04.27.1.53.2.8s0 .62.15.85c.07.15.02.33.22.43v.2c.05.05.05.1.16.1v.2c.43.42.8.9 1.1 1.43.1.28-.48.15-.7.05-.41-.27-.8-.6-1.13-.96a.18.18 0 0 0-.05.1c.2.36.9.78.53 1.01-.2.1-.43-.15-.63.05-.05.08 0 .18 0 .28-.28-.2-.58-.1-.86-.2-.2-.05-.25-.43-.48-.43-.6-.14-1.2-.25-1.8-.33-.58-.08-1.16-.14-1.75-.16V19.71a.6.6 0 0 1 .31-.53L32 10.42l15 8.68a.6.6 0 0 1 .3.52v16.93Zm-7.96-8.26a.32.32 0 0 1-.28.15l-.28.27c.1 0 0 .15.1.15-.2.23.08.7-.2.8-.37.1-.76.1-1.13 0a.72.72 0 0 1 .17-.02h.08a.38.38 0 0 0 .34-.13v-.2c0-.05-.05-.05-.1-.05a.16.16 0 0 1-.1.05.22.22 0 0 0-.16-.2.8.8 0 0 1-.72-.27.67.67 0 0 1 .44-.05c.13 0 .08-.23.23-.33h.16c.3-.37.87-.47.97-.84 0-.1-.28-.1-.49-.15a2.26 2.26 0 0 0-.82.05c-.36.05-.7.14-1.05.27.28-.2.6-.36.92-.47.24-.09.48-.15.72-.2l.13-.02.14-.03a.97.97 0 0 1 .55 0c.23.1.62.1.67.25.1.27-.15.54-.44.74-.05.08.15.14.15.23Z"></path>
+      <path data-v-dc72de41="" fill="#f5f5fe" d="M64.99 24.87a4.9 4.9 0 0 0 4.08 1.95c2.1 0 3.69-1.3 3.69-3.36 0-3.96-5.63-3.35-5.63-6.02 0-1.02.75-1.75 1.92-1.75 1.02 0 1.85.56 2.55 1.56l1.2-1.05a4.54 4.54 0 0 0-3.77-1.94c-2.07 0-3.53 1.45-3.53 3.21 0 3.93 5.64 3.35 5.64 6.04 0 1.09-.77 1.88-2.1 1.88-1.1 0-2.05-.56-2.86-1.61l-1.2 1.09Zm10.81-5.71 1.75-4.56H75.9l-1.44 4.56h1.34Zm4.82-3.46a1 1 0 0 0 1-1.01 1 1 0 0 0-1-1c-.56 0-1.02.45-1.02 1 0 .56.46 1.02 1.02 1.02Zm-.73 10.8h1.45v-8.57h-1.45v8.57Zm3.77-4.28c0 2.5 1.72 4.62 4.4 4.62 1.28 0 2.28-.5 3.04-1.36v1.02h1.45V13.75H91.1v5.2a3.89 3.89 0 0 0-3.04-1.36c-2.68 0-4.4 2.13-4.4 4.63Zm1.53 0c0-1.82 1.22-3.27 3.04-3.27 1.17 0 2.21.56 2.87 1.58v3.37a3.33 3.33 0 0 1-2.87 1.58c-1.82 0-3.04-1.45-3.04-3.26Zm18.02 2.87-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.84 0-3.15-1.24-3.2-3.3h6.58c.05-.23.1-.56.1-.9 0-2.1-1.5-3.74-3.84-3.74-2.65 0-4.32 2.02-4.32 4.63a4.5 4.5 0 0 0 4.68 4.62c1.6 0 2.87-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.29-2.3 2.7-2.3Zm6.32 7.68h1.45v-5.93c.54-.9 1.32-1.62 2.56-1.62 1.33 0 2.2.89 2.2 2.42v5.13h1.44v-5.18c0-2.44-1.43-3.73-3.35-3.73-1.27 0-2.16.55-2.85 1.31v-.97h-1.45v8.57Zm11.06-2.87c0 2.09 1.07 3.04 2.97 3.04.61 0 1.07-.07 1.48-.24v-1.29c-.32.14-.72.2-1.28.2-1.03 0-1.71-.37-1.71-1.71v-4.39h2.97v-1.3H118v-2.15h-1.46v2.14h-1.62v1.31h1.62v4.39Zm7.37-7.92a1 1 0 0 0 1-1.03 1 1 0 0 0-1-1c-.56 0-1.02.46-1.02 1 0 .57.46 1.03 1.02 1.03Zm-.73 10.79h1.45v-8.57h-1.45v8.57Zm3.38-8.57v1.31h1.61v7.26h1.47v-7.26h2.97v-1.3h-2.97v-1.1c0-1.12.64-1.78 1.61-1.78.5 0 .88.15 1.2.39l.65-1.2c-.47-.28-1.1-.5-1.88-.5-1.87 0-3.05 1.3-3.05 3.13v1.05h-1.61Zm8.54-2.22a1 1 0 0 0 1-1.03 1 1 0 0 0-1-1c-.56 0-1.02.46-1.02 1 0 .57.46 1.03 1.02 1.03Zm-.73 10.79h1.44v-8.57h-1.44v8.57Zm12.11-1.41-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.83 0-3.14-1.24-3.2-3.3h6.59c.05-.23.1-.56.1-.9 0-2.1-1.51-3.74-3.84-3.74-2.66 0-4.32 2.02-4.32 4.63a4.5 4.5 0 0 0 4.67 4.62c1.6 0 2.88-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.3-2.3 2.7-2.3Zm6.33 7.68h1.44v-5.88c.53-.87 1.26-1.45 2.38-1.45.34 0 .6.04.85.1v-1.4a3.13 3.13 0 0 0-3.23 1.14v-1.08h-1.44v8.57Zm13.66.24c1.11 0 2.23-.5 2.88-1.33v1.09h1.44v-5.75c0-1.88-1.29-3.16-3.47-3.16-1.5 0-2.7.63-3.45 1.65l1.1.83a2.78 2.78 0 0 1 2.3-1.19c1.23 0 2.08.68 2.08 1.87v.6l-2.9.47c-1.81.31-2.8 1.23-2.8 2.52 0 1.46 1.14 2.4 2.82 2.4Zm-1.36-2.45c0-.73.53-1.26 1.7-1.46l2.54-.43v1.69a3 3 0 0 1-2.64 1.46c-1 0-1.6-.53-1.6-1.26Zm7.2-6.36 3.36 8.57h1.9l3.35-8.57h-1.56L172.54 25l-2.74-7.06h-1.56Zm17.86 7.16-1.07-.83a3.19 3.19 0 0 1-2.6 1.27c-1.84 0-3.14-1.24-3.2-3.3h6.58c.06-.23.1-.56.1-.9 0-2.1-1.5-3.74-3.84-3.74-2.65 0-4.31 2.02-4.31 4.63a4.5 4.5 0 0 0 4.67 4.62c1.6 0 2.87-.68 3.67-1.75Zm-4.06-6.27a2.31 2.31 0 0 1 2.43 2.3h-5.13c.3-1.47 1.29-2.3 2.7-2.3Zm10.24 6.66c-1.86 0-3.17-1.43-3.17-3.26 0-1.82 1.31-3.27 3.15-3.27 1.07 0 1.94.51 2.46 1.26l1.14-.87a4.43 4.43 0 0 0-3.6-1.75 4.51 4.51 0 0 0-4.66 4.63c0 2.5 1.82 4.62 4.66 4.62 1.56 0 2.8-.68 3.6-1.75l-1.14-.87a2.95 2.95 0 0 1-2.44 1.26ZM65.85 44.5h2.56v-5.36h4.07V37H68.4v-2.99h4.79V31.9h-7.35v12.6Zm8.9 0h2.3v-5.81a2.48 2.48 0 0 1 2.17-1.2c.41 0 .72.06 1 .13v-2.25a2.52 2.52 0 0 0-.79-.12c-1.02 0-1.8.47-2.39 1.08v-.9h-2.29v9.07Zm9.43.27c1.07 0 2.15-.45 2.72-1.15v.88h2.29v-5.87c0-2-1.35-3.56-3.98-3.56-1.66 0-2.99.68-3.8 1.8l1.68 1.28a2.46 2.46 0 0 1 2.05-1.08c1.04 0 1.76.6 1.76 1.56v.24l-2.77.46c-1.94.33-3 1.35-3 2.72 0 1.68 1.24 2.72 3.05 2.72Zm-.79-2.83c0-.55.4-.95 1.35-1.11l2.16-.36v1.28c-.45.72-1.2 1.2-2.25 1.2-.77 0-1.26-.4-1.26-1Zm8.42 2.56h2.28v-5.92c.34-.58.96-1.35 2.1-1.35 1.12 0 1.8.75 1.8 1.96v5.31h2.31v-5.4c0-2.68-1.56-4.03-3.53-4.03-1.2 0-2.05.47-2.68 1.08v-.72h-2.28v9.07Zm15.44-1.8c-1.53 0-2.63-1.13-2.63-2.74 0-1.58 1.1-2.73 2.6-2.73.93 0 1.65.41 2.09 1.04l1.78-1.37a4.69 4.69 0 0 0-3.84-1.83c-3.13 0-5 2.25-5 4.9 0 2.64 1.87 4.89 5 4.89 1.66 0 3-.72 3.84-1.84l-1.78-1.36a2.42 2.42 0 0 1-2.06 1.04Zm13.54.32-1.63-1.3a2.91 2.91 0 0 1-2.34 1.09c-1.43 0-2.47-.69-2.69-2.38h6.36c.07-.3.14-.77.14-1.28 0-2.37-1.65-4.08-4.17-4.08-2.97 0-4.67 2.21-4.67 4.9 0 2.64 1.82 4.89 5.04 4.89 1.71 0 3.12-.7 3.96-1.84Zm-4.39-6.08c1.28 0 1.95.92 1.98 1.84h-4.17c.25-1.2 1.02-1.84 2.2-1.84Zm12.5 5.53c-2.38 0-4.07-1.86-4.07-4.27 0-2.41 1.7-4.27 4.07-4.27 1.44 0 2.57.7 3.3 1.73l2-1.56a6.53 6.53 0 0 0-5.3-2.56 6.55 6.55 0 0 0-6.7 6.66c0 3.6 2.72 6.66 6.7 6.66 2.28 0 4.16-1 5.3-2.57l-2-1.55a3.94 3.94 0 0 1-3.3 1.73Zm11.36-7.4a4.8 4.8 0 0 0-4.96 4.9 4.8 4.8 0 0 0 4.96 4.89 4.8 4.8 0 0 0 4.97-4.9 4.8 4.8 0 0 0-4.97-4.9Zm.04 7.63c-1.51 0-2.63-1.15-2.63-2.74 0-1.58 1.12-2.73 2.63-2.73 1.46 0 2.56 1.15 2.56 2.73 0 1.57-1.1 2.74-2.56 2.74Zm7.02 1.8h2.28v-5.92c.34-.58.96-1.35 2.1-1.35 1.13 0 1.8.75 1.8 1.96v5.31h2.31v-5.4c0-2.68-1.56-4.03-3.53-4.03-1.2 0-2.05.47-2.68 1.08v-.72h-2.28v9.07Zm11.09 0h2.28v-5.92c.35-.58.96-1.35 2.11-1.35 1.12 0 1.8.75 1.8 1.96v5.31h2.3v-5.4c0-2.68-1.56-4.03-3.52-4.03-1.2 0-2.06.47-2.69 1.08v-.72h-2.28v9.07Zm19.44-1.48-1.63-1.3a2.91 2.91 0 0 1-2.34 1.09c-1.43 0-2.47-.69-2.69-2.38h6.36c.07-.3.14-.77.14-1.28 0-2.37-1.66-4.08-4.18-4.08-2.97 0-4.66 2.21-4.66 4.9 0 2.64 1.82 4.89 5.04 4.89 1.71 0 3.12-.7 3.96-1.84Zm-4.39-6.08c1.28 0 1.94.92 1.98 1.84h-4.18c.26-1.2 1.03-1.84 2.2-1.84Zm10.75 5.76c-1.53 0-2.63-1.13-2.63-2.74 0-1.58 1.1-2.73 2.6-2.73.93 0 1.65.41 2.08 1.04l1.78-1.37a4.69 4.69 0 0 0-3.83-1.83c-3.13 0-5 2.25-5 4.9 0 2.64 1.87 4.89 5 4.89 1.66 0 2.99-.72 3.83-1.84l-1.78-1.36a2.42 2.42 0 0 1-2.05 1.04Zm6.2-1.51c0 2.21 1.09 3.49 3.35 3.49.76 0 1.3-.09 1.75-.29v-2c-.3.13-.72.2-1.35.2-.9 0-1.44-.4-1.44-1.4v-3.71h2.77v-2.05h-2.77v-2.27h-2.3v2.27h-1.7v2.05h1.7v3.7Z"></path>
+      <path data-v-dc72de41="" fill="#f5f5fe" d="M233 30.571V25.429H223.6V16H218.448V25.429H209V30.572H218.448V40H223.6V30.571H233Z"></path>
+    </svg></a><a data-v-dc72de41="" href="https://franceconnect.gouv.fr/france-connect-plus" target="_blank" rel="noopener noreferrer" class="vd-france-connect-info-link text-decoration-none mt-3">Qu’est-ce que FranceConnect+ ? <i data-v-dc72de41="" class="M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z mdi v-icon notranslate v-theme--light ml-1 mb-1" style="font-size: 1em; height: 1em; width: 1em;" aria-hidden="true"></i></a></div>"
+`;

package/src/components/LangBtn/LangBtn.mdx

@@ -0,0 +1,37 @@
+import { Controls, Canvas, Meta, Source } from '@storybook/blocks';import * as LangBtnStories from './LangBtn.stories';
+
+<Meta of={LangBtnStories} />
+
+# LangBtn
+
+Le composant `LangBtn` est utilisé pour afficher une alerte à l’utilisateur.
+
+<Canvas of={LangBtnStories.Default} />
+
+# API
+
+<Controls of={LangBtnStories.Default} />
+
+# Exemple d'utilisation
+
+<Source dark code={`
+<script setup lang="ts">
+ import LangBtn from '@/components/LangBtn/LangBtn.vue'
+ import { ref } from 'vue'
+
+ const value = ref('fr')
+ const items = ['fr', 'en', 'co']
+ const ariaLabel = 'Choix de la langue'
+</script>
+
+<template>
+ <div class="mt-12 ml-12">
+  <LangBtn
+   v-model="value"
+   :available-languages="items"
+   :aria-label="ariaLabel"
+   hide-down-arrow
+  />
+ </div>
+</template>
+`} />

package/src/components/LangBtn/LangBtn.stories.ts

@@ -0,0 +1,147 @@
+import LangBtn from './LangBtn.vue'
+import type { Meta, StoryObj } from '@storybook/vue3'
+import { VBtn, VMenu, VList, VListItem, VListItemTitle } from 'vuetify/components'
+
+const meta: Meta<typeof LangBtn> = {
+	title: 'Components/LangBtn',
+	component: LangBtn,
+	parameters: {
+		layout: 'fullscreen',
+		controls: { exclude: ['currentLangData', 'updateLang', 'selectedLanguage'] },
+	},
+	argTypes: {
+		modelValue: { control: 'text' },
+		hideDownArrow: { control: 'boolean' },
+		ariaLabel: { control: 'text' },
+		// @ts-expect-error Type '"array"' is not assignable to type 'Control | undefined'.
+		availableLanguages: { control: { type: 'array' } },
+		vuetifyOptions: {
+			constrol: { type: 'object' },
+			default: () => ({
+				menu: {
+					offsetY: true,
+				},
+				btn: {
+					color: 'primary',
+					variant: 'outlined',
+					ripple: true,
+				},
+				icon: {
+					class: 'ml-1',
+				},
+			}),
+		},
+	},
+}
+
+export default meta
+
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {
+	args: {
+		modelValue: 'en',
+		hideDownArrow: false,
+		ariaLabel: 'Select a language',
+		availableLanguages: ['fr', 'co', 'es'],
+		vuetifyOptions: {
+			menu: {
+				offsetY: true,
+			},
+			btn: {
+				color: 'primary',
+				variant: 'outlined',
+				ripple: true,
+			},
+			icon: {
+				class: 'ml-1',
+			},
+		},
+	},
+	render: (args) => {
+		return {
+			components: { LangBtn, VBtn, VMenu, VList, VListItem, VListItemTitle },
+			setup() {
+				return { args }
+			},
+			template: `
+				<div class="pa-4">
+					<LangBtn :vuetify-options="args.vuetifyOptions" v-bind="args" @update:modelValue="args['update:modelValue']" />
+				</div>
+			`,
+		}
+	},
+}
+
+export const AllLanguages: Story = {
+	args: {
+		modelValue: 'fr',
+		hideDownArrow: false,
+		ariaLabel: 'Select a language',
+		availableLanguages: '*',
+	},
+	render: (args) => {
+		return {
+			components: { LangBtn, VBtn, VMenu, VList, VListItem, VListItemTitle },
+			setup() {
+				return { args }
+			},
+			template: `
+				<div class="pa-4">
+					<LangBtn v-bind="args" @update:modelValue="args['update:modelValue']" />
+				</div>
+			`,
+		}
+	},
+}
+
+export const NoDownArrow: Story = {
+	args: {
+		modelValue: 'fr',
+		hideDownArrow: true,
+		ariaLabel: 'Select a language',
+		availableLanguages: ['fr', 'en', 'de'],
+	},
+	render: (args) => {
+		return {
+			components: { LangBtn, VBtn, VMenu, VList, VListItem, VListItemTitle },
+			setup() {
+				return { args }
+			},
+			template: `
+				<div class="pa-4">
+					<LangBtn v-bind="args" @update:modelValue="args['update:modelValue']" />
+				</div>
+			`,
+		}
+	},
+}
+
+export const FlatBtn: Story = {
+	args: {
+		modelValue: 'fr',
+		hideDownArrow: false,
+		ariaLabel: 'Select a language',
+		availableLanguages: ['fr', 'en', 'de'],
+		vuetifyOptions: {
+			btn: {
+				color: 'primary',
+				variant: 'flat',
+				ripple: true,
+			},
+		},
+	},
+	render: (args) => {
+		return {
+			components: { LangBtn, VBtn, VMenu, VList, VListItem, VListItemTitle },
+			setup() {
+				return { args }
+			},
+			template: `
+				<div class="pa-4">
+					<LangBtn :vuetify-options="args.vuetifyOptions" v-bind="args" @update:modelValue="args['update:modelValue']" />
+				</div>
+			`,
+		}
+	},
+}