@cnamts/synapse 0.0.13-alpha → 0.0.14-alpha

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

@@ -1,11 +1,49 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`LangBtn > renders correctly 1`] = `
-"<div data-v-42678988="" id="lang-menu-id"><button data-v-42678988="" type="button" class="v-btn v-theme--light text-primary v-btn--density-default v-btn--size-default v-btn--variant-outlined vd-lang-btn" id="lang-menu-btn" aria-label="Choix de la langue. Actuellement Français" aria-haspopup="menu" aria-controls="lang-menu-id" aria-owns="lang-menu-id" aria-expanded="false"><span class="v-btn__overlay"></span><span class="v-btn__underlay"></span>
-    <!----><span class="v-btn__content" data-no-activator="">Français <i data-v-42678988="" class="M7,10L12,15L17,10H7Z mdi v-icon notranslate v-theme--light v-icon--size-default ml-1" aria-hidden="true"></i></span>
+<div id="lang-menu-id">
+  <button
+    aria-controls="lang-menu-id"
+    aria-expanded="false"
+    aria-haspopup="menu"
+    aria-label="Choix de la langue. Actuellement Français"
+    aria-owns="lang-menu-id"
+    class="
+      text-primary
+      v-btn
+      v-btn--density-default
+      v-btn--size-default
+      v-btn--variant-outlined
+      v-theme--light
+      vd-lang-btn
+    "
+    id="lang-menu-btn"
+    type="button"
+  >
+    <span class="v-btn__overlay"></span>
+    <span class="v-btn__underlay"></span>
+    <!---->
+    <span
+      class="v-btn__content"
+      data-no-activator=""
+    >
+      Français
+      <i
+        aria-hidden="true"
+        class="
+          M7,10L12,15L17,10H7Z
+          mdi
+          ml-1
+          notranslate
+          v-icon
+          v-icon--size-default
+          v-theme--light
+        "
+      ></i>
+    </span>
     <!---->
     <!---->
   </button>
   <!---->
-</div>"
+</div>
 `;

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

@@ -1,14 +1,61 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`LogoBrandSection > renders correctly 1`] = `
-"<div data-v-7f5c1754="" height="64px" class="vd-logo-brand-section d-flex"><a data-v-7f5c1754="" href="/" class="vd-home-link">
-    <logo-stub data-v-7f5c1754="" hidesignature="false" hideorganism="false" risquepro="false" avatar="false" dark="false" size="normal" class=""></logo-stub>
-  </a><svg data-v-7f5c1754="" width="22" height="64" fill="#0c419a" role="img" focusable="false" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 64" class="vd-divider">
-    <path data-v-7f5c1754="" d="M14.3 49.3c-.2 0-.4-.2-.4-.4V14.2c0-.2.2-.4.4-.4.3 0 .5.2.5.4v34.7c0 .2-.2.4-.5.4Z"></path>
+<div
+  class="
+    d-flex
+    vd-logo-brand-section
+  "
+  height="64px"
+>
+  <a
+    class="vd-home-link"
+    href="/"
+  >
+    <logo-stub
+    avatar="false"
+    class=""
+    dark="false"
+    hideorganism="false"
+    hidesignature="false"
+    risquepro="false"
+    size="normal"
+  ></logo-stub>
+  </a>
+  <svg
+    aria-hidden="true"
+    class="vd-divider"
+    fill="#0c419a"
+    focusable="false"
+    height="64"
+    role="img"
+    viewBox="0 0 22 64"
+    width="22"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path d="M14.3 49.3c-.2 0-.4-.2-.4-.4V14.2c0-.2.2-.4.4-.4.3 0 .5.2.5.4v34.7c0 .2-.2.4-.5.4Z" />
   </svg>
-  <div data-v-7f5c1754="" class="vd-title-container d-flex justify-center flex-column text-primary">
-    <h1 data-v-7f5c1754="" class="vd-title text-caption text-md-subtitle-1 font-weight-medium">Service Title</h1>
-    <h2 data-v-7f5c1754="" class="vd-title text-caption">Service Sub Title</h2>
+  <div class="
+    d-flex
+    flex-column
+    justify-center
+    text-primary
+    vd-title-container
+  ">
+    <h1 class="
+      font-weight-medium
+      text-caption
+      text-md-subtitle-1
+      vd-title
+    ">
+      Service Title
+    </h1>
+    <h2 class="
+      text-caption
+      vd-title
+    ">
+      Service Sub Title
+    </h2>
   </div>
-</div>"
+</div>
 `;

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

@@ -1,3 +1,12 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`MaintenancePage > renders correctly 1`] = `"<error-page-stub data-v-25a0ed68="" pagetitle="Maintenance en cours" message="L’application n’est pas disponible pour le moment, veuillez nous excuser pour la gêne occasionnée." codeerrortext="Code d'erreur&nbsp;: " btnlink="/" hidebtn="false" no-btn=""></error-page-stub>"`;
+exports[`MaintenancePage > renders correctly 1`] = `
+<error-page-stub
+  btnlink="/"
+  codeerrortext="Code d'erreur : "
+  hidebtn="false"
+  message="L’application n’est pas disponible pour le moment, veuillez nous excuser pour la gêne occasionnée."
+  no-btn=""
+  pagetitle="Maintenance en cours"
+></error-page-stub>
+`;

package/src/components/NirField/NirField.stories.ts

@@ -165,7 +165,7 @@ const meta: Meta<typeof NirField> = {
 				},
 			},
 		},
-		isDisabled: {
+		disabled: {
 			description: 'Indique si le champ est désactivé.',
 			control: 'boolean',
 			default: false,
@@ -362,7 +362,7 @@ export const Default: Story = {
 				name: 'Script',
 				code: `
     <script setup lang="ts">
-     import NirField  from '@cnamts/synapse'
+     import { NirField } from '@cnamts/synapse'
      import { ref } from 'vue'
      
      const value = ref('')
@@ -477,7 +477,7 @@ export const WithoutKey: Story = {
 				name: 'Script',
 				code: `
     <script setup lang="ts">
-     import NirField  from '@cnamts/synapse'
+     import { NirField } from '@cnamts/synapse'
      import { ref } from 'vue'
      
      const value = ref('')
@@ -514,7 +514,7 @@ export const WithSuccessMessages: Story = {
 				name: 'Script',
 				code: `
     <script setup lang="ts">
-     import NirField  from '@cnamts/synapse'
+     import { NirField } from '@cnamts/synapse'
      import { ref } from 'vue'
      
      const value = ref('')
@@ -656,7 +656,7 @@ export const CustomRules: Story = {
 				name: 'Script',
 				code: `
     <script setup lang="ts">
-     import NirField  from '@cnamts/synapse'
+     import { NirField } from '@cnamts/synapse'
      import { ref } from 'vue'
      
      const value = ref('')
@@ -704,7 +704,7 @@ L'infobulle est positionnée avant le champ et s'affiche au survol de l'icône d
 				name: 'Script',
 				code: `
     <script setup lang="ts">
-     import NirField  from '@cnamts/synapse'
+     import { NirField } from '@cnamts/synapse'
      import { ref } from 'vue'
      
      const value = ref('')
@@ -752,7 +752,7 @@ L'infobulle est positionnée après le champ et s'affiche au survol de l'icône
 				name: 'Script',
 				code: `
     <script setup lang="ts">
-     import NirField  from '@cnamts/synapse'
+     import { NirField } from '@cnamts/synapse'
      import { ref } from 'vue'
      
      const value = ref('')

package/src/components/NirField/NirField.vue

@@ -2,14 +2,12 @@
 	import { ref, watch, computed, nextTick, toRef } from 'vue'
 	import { vMaska } from 'maska/vue'
 	import { checkNIR, isNIRKeyValid } from './nirValidation'
-	// import useCustomizableOptions, { type CustomizableOptions } from '@/composables/useCustomizableOptions'
-	import { type CustomizableOptions } from '@/composables/useCustomizableOptions'
 	import SyTextField from '../Customs/SyTextField/SyTextField.vue'
 	import { locales } from './locales'
-	// import defaultOptions from './config'
 	import { useValidation, type ValidationRule } from '@/composables/validation/useValidation'
-	const props = withDefaults(defineProps<CustomizableOptions & {
-		modelValue?: string | undefined
+
+	const props = withDefaults(defineProps<{
+		modelValue?: string | undefined | null
 		label?: string
 		numberLabel?: string
 		keyLabel?: string
@@ -28,7 +26,7 @@
 		showSuccessMessages?: boolean
 		width?: string
 		bgColor?: string
-		isDisabled?: boolean
+		disabled?: boolean
 		density?: 'default' | 'comfortable' | 'compact'
 		hideDetails?: boolean | 'auto'
 		hideSpinButtons?: boolean
@@ -61,7 +59,7 @@
 		showSuccessMessages: true,
 		width: '100%',
 		bgColor: undefined,
-		isDisabled: false,
+		disabled: false,
 		density: 'default',
 		hideDetails: false,
 		hideSpinButtons: false,
@@ -250,7 +248,7 @@
 
 	// Synchronisation avec modelValue
 	watch(modelValueRef, (newValue) => {
-		if (newValue === undefined) {
+		if (newValue === undefined || newValue === null) {
 			numberValue.value = ''
 			keyValue.value = ''
 			return
@@ -267,7 +265,7 @@
 			numberValue.value = number
 			keyValue.value = key
 		}
-		if (newValue.length === 13) {
+		if (newValue.length <= 13) {
 			const number = newValue
 			numberValue.value = number
 			keyValue.value = ''
@@ -413,7 +411,7 @@
 				:messages="hasNumberErrors ? numberValidation.errors.value : (hasNumberWarning ? numberValidation.warnings.value : (hasNumberSuccess && props.showSuccessMessages ? numberValidation.successes.value : []))"
 				:has-error="hasNumberErrors"
 				:required="required"
-				:is-disabled="isDisabled"
+				:disabled="disabled"
 				:bg-color="bgColor"
 				:density="props.density"
 				:hide-details="props.hideDetails"
@@ -455,7 +453,7 @@
 				:hint="props.hint || locales.keyHint"
 				:messages="hasKeyErrors ? keyValidation.errors.value : (hasKeyWarning ? keyValidation.warnings.value : (hasKeySuccess && props.showSuccessMessages ? keyValidation.successes.value : []))"
 				:has-error="hasKeyErrors"
-				:is-disabled="isDisabled"
+				:disabled="disabled"
 				:bg-color="bgColor"
 				:density="props.density"
 				:hide-details="props.hideDetails"
@@ -480,7 +478,7 @@
 .nir-field {
 	display: flex;
 	gap: 16px;
-	width: v-bind('props.width');
+	width: calc(v-bind('props.width') - 16px);
 	align-items: flex-start;
 }
 

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

@@ -1,19 +1,68 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`NotFoundPage > display the support ID if provided in the url 1`] = `
-"<div data-v-fb0b02fd="" data-v-8f2b5bad="" data-v-c9c5b952="" class="py-10 px-14 vd-page-container d-flex justify-center">
-  <div data-v-fb0b02fd="" class="v-sheet v-theme--light bg-transparent" style="width: 800px;">
-    <div data-v-8f2b5bad="" class="v-card v-theme--light v-card--density-default elevation-0 v-card--variant-elevated pa-6 pa-sm-16">
+<div class="
+  d-flex
+  justify-center
+  px-14
+  py-10
+  vd-page-container
+">
+  <div
+    class="
+      bg-transparent
+      v-sheet
+      v-theme--light
+    "
+    style="width: 800px;"
+  >
+    <div class="
+      elevation-0
+      pa-6
+      pa-sm-16
+      v-card
+      v-card--density-default
+      v-card--variant-elevated
+      v-theme--light
+    ">
       <!---->
       <div class="v-card__loader">
-        <div class="v-progress-linear v-theme--light v-locale--is-ltr" style="top: 0px; height: 0px; --v-progress-linear-height: 2px;" role="progressbar" aria-hidden="true" aria-valuemin="0" aria-valuemax="100">
+        <div
+          aria-hidden="true"
+          aria-valuemax="100"
+          aria-valuemin="0"
+          class="
+            v-locale--is-ltr
+            v-progress-linear
+            v-theme--light
+          "
+          role="progressbar"
+          style="top: 0px; height: 0px; --v-progress-linear-height: 2px;"
+        >
           <!---->
-          <div class="v-progress-linear__background" style="opacity: NaN;"></div>
-          <div class="v-progress-linear__buffer" style="opacity: NaN; width: 0%;"></div>
-          <transition-stub name="fade-transition" appear="false" persisted="false" css="true">
+          <div
+            class="v-progress-linear__background"
+            style="opacity: NaN;"
+          ></div>
+          <div
+            class="v-progress-linear__buffer"
+            style="opacity: NaN; width: 0%;"
+          ></div>
+          <transition-stub
+            appear="false"
+            css="true"
+            name="fade-transition"
+            persisted="false"
+          >
             <div class="v-progress-linear__indeterminate">
-              <div class="v-progress-linear__indeterminate long"></div>
-              <div class="v-progress-linear__indeterminate short"></div>
+              <div class="
+                long
+                v-progress-linear__indeterminate
+              "></div>
+              <div class="
+                short
+                v-progress-linear__indeterminate
+              "></div>
             </div>
           </transition-stub>
           <!---->
@@ -21,37 +70,136 @@ exports[`NotFoundPage > display the support ID if provided in the url 1`] = `
       </div>
       <!---->
       <!---->
-      <div data-v-8f2b5bad="" class="v-row max-width-none">
-        <div data-v-8f2b5bad="" class="v-col-sm-6 v-col-12 order-last order-sm-first text-center text-sm-left d-flex flex-column justify-center align-sm-start">
-          <div data-v-8f2b5bad="" class="vd-code text-primary mb-4"><span data-v-8f2b5bad="" class="d-sr-only">Code d'erreur&nbsp;: </span> 404</div>
-          <h2 data-v-8f2b5bad="" class="mb-2 font-weight-bold text-h5 mb-4">Page non trouvée</h2>
-          <p data-v-8f2b5bad="">Cette page n’existe pas ou a été déplacée.</p>
-          <p data-v-c9c5b952="" class="mt-4">Votre identifiant de support est <b data-v-c9c5b952="">1234 5678 9012 3456 789</b> . </p>
-          <!--v-if-->
+      <div class="
+        max-width-none
+        v-row
+      ">
+        <div class="
+          align-sm-start
+          d-flex
+          flex-column
+          justify-center
+          order-last
+          order-sm-first
+          text-center
+          text-sm-left
+          v-col-12
+          v-col-sm-6
+        ">
+          <div class="
+            mb-4
+            sy-code
+            text-primary
+          ">
+            <span class="d-sr-only">
+              Code d'erreur&nbsp;:
+            </span>
+            404
+          </div>
+          <h2 class="
+            font-weight-bold
+            mb-2
+            mb-4
+            text-h5
+          ">
+            Page non trouvée
+          </h2>
+          <p>
+            Cette page n’existe pas ou a été déplacée.
+          </p>
+          <p class="mt-4">
+            Votre identifiant de support est
+            <b>
+              1234 5678 9012 3456 789
+            </b>
+            .
+          </p>
+          <!-- v-if -->
+        </div>
+        <div class="
+          align-center
+          d-flex
+          justify-center
+          v-col-12
+          v-col-sm-6
+        ">
+          <img
+            alt="Page non trouvée"
+            src="/src/components/NotFoundPage/assets/not-found.svg"
+          />
         </div>
-        <div data-v-8f2b5bad="" class="v-col-sm-6 v-col-12 d-flex align-center justify-center"><img data-v-c9c5b952="" src="/src/components/NotFoundPage/assets/not-found.svg" alt="Page non trouvée"></div>
       </div>
       <!---->
-      <!----><span class="v-card__underlay"></span>
+      <!---->
+      <span class="v-card__underlay"></span>
     </div>
   </div>
-</div>"
+</div>
 `;
 
 exports[`NotFoundPage > renders correctly 1`] = `
-"<div data-v-fb0b02fd="" data-v-8f2b5bad="" data-v-c9c5b952="" class="py-10 px-14 vd-page-container d-flex justify-center">
-  <div data-v-fb0b02fd="" class="v-sheet v-theme--light bg-transparent" style="width: 800px;">
-    <div data-v-8f2b5bad="" class="v-card v-theme--light v-card--density-default elevation-0 v-card--variant-elevated pa-6 pa-sm-16">
+<div class="
+  d-flex
+  justify-center
+  px-14
+  py-10
+  vd-page-container
+">
+  <div
+    class="
+      bg-transparent
+      v-sheet
+      v-theme--light
+    "
+    style="width: 800px;"
+  >
+    <div class="
+      elevation-0
+      pa-6
+      pa-sm-16
+      v-card
+      v-card--density-default
+      v-card--variant-elevated
+      v-theme--light
+    ">
       <!---->
       <div class="v-card__loader">
-        <div class="v-progress-linear v-theme--light v-locale--is-ltr" style="top: 0px; height: 0px; --v-progress-linear-height: 2px;" role="progressbar" aria-hidden="true" aria-valuemin="0" aria-valuemax="100">
+        <div
+          aria-hidden="true"
+          aria-valuemax="100"
+          aria-valuemin="0"
+          class="
+            v-locale--is-ltr
+            v-progress-linear
+            v-theme--light
+          "
+          role="progressbar"
+          style="top: 0px; height: 0px; --v-progress-linear-height: 2px;"
+        >
           <!---->
-          <div class="v-progress-linear__background" style="opacity: NaN;"></div>
-          <div class="v-progress-linear__buffer" style="opacity: NaN; width: 0%;"></div>
-          <transition-stub name="fade-transition" appear="false" persisted="false" css="true">
+          <div
+            class="v-progress-linear__background"
+            style="opacity: NaN;"
+          ></div>
+          <div
+            class="v-progress-linear__buffer"
+            style="opacity: NaN; width: 0%;"
+          ></div>
+          <transition-stub
+            appear="false"
+            css="true"
+            name="fade-transition"
+            persisted="false"
+          >
             <div class="v-progress-linear__indeterminate">
-              <div class="v-progress-linear__indeterminate long"></div>
-              <div class="v-progress-linear__indeterminate short"></div>
+              <div class="
+                long
+                v-progress-linear__indeterminate
+              "></div>
+              <div class="
+                short
+                v-progress-linear__indeterminate
+              "></div>
             </div>
           </transition-stub>
           <!---->
@@ -59,18 +207,62 @@ exports[`NotFoundPage > renders correctly 1`] = `
       </div>
       <!---->
       <!---->
-      <div data-v-8f2b5bad="" class="v-row max-width-none">
-        <div data-v-8f2b5bad="" class="v-col-sm-6 v-col-12 order-last order-sm-first text-center text-sm-left d-flex flex-column justify-center align-sm-start">
-          <div data-v-8f2b5bad="" class="vd-code text-primary mb-4"><span data-v-8f2b5bad="" class="d-sr-only">Code d'erreur&nbsp;: </span> 404</div>
-          <h2 data-v-8f2b5bad="" class="mb-2 font-weight-bold text-h5 mb-4">Page non trouvée</h2>
-          <p data-v-8f2b5bad="">Cette page n’existe pas ou a été déplacée.</p>
-          <!--v-if-->
+      <div class="
+        max-width-none
+        v-row
+      ">
+        <div class="
+          align-sm-start
+          d-flex
+          flex-column
+          justify-center
+          order-last
+          order-sm-first
+          text-center
+          text-sm-left
+          v-col-12
+          v-col-sm-6
+        ">
+          <div class="
+            mb-4
+            sy-code
+            text-primary
+          ">
+            <span class="d-sr-only">
+              Code d'erreur&nbsp;:
+            </span>
+            404
+          </div>
+          <h2 class="
+            font-weight-bold
+            mb-2
+            mb-4
+            text-h5
+          ">
+            Page non trouvée
+          </h2>
+          <p>
+            Cette page n’existe pas ou a été déplacée.
+          </p>
+          <!-- v-if -->
+        </div>
+        <div class="
+          align-center
+          d-flex
+          justify-center
+          v-col-12
+          v-col-sm-6
+        ">
+          <img
+            alt="Page non trouvée"
+            src="/src/components/NotFoundPage/assets/not-found.svg"
+          />
         </div>
-        <div data-v-8f2b5bad="" class="v-col-sm-6 v-col-12 d-flex align-center justify-center"><img data-v-c9c5b952="" src="/src/components/NotFoundPage/assets/not-found.svg" alt="Page non trouvée"></div>
       </div>
       <!---->
-      <!----><span class="v-card__underlay"></span>
+      <!---->
+      <span class="v-card__underlay"></span>
     </div>
   </div>
-</div>"
+</div>
 `;

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

@@ -1,7 +1,34 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`NotificationBar.vue > should render notification bar 1`] = `
-"<div data-v-867cdd3c="" notification="[object Object]">
-  <v-snackbar-stub data-v-867cdd3c="" color="info" width="960px" class="" multiline="false" timer="false" timeout="-1" vertical="false" location="top" rounded="4" tile="false" variant="elevated" absolute="false" attach="false" closeonback="true" contained="false" disabled="false" modelvalue="true" zindex="2000" activatorprops="[object Object]" openonhover="false" closeoncontentclick="false" eager="true" locationstrategy="static" origin="auto" transition="v-snackbar-transition" role="status"></v-snackbar-stub>
-</div>"
+<div notification="[object Object]">
+  <v-snackbar-stub
+    absolute="false"
+    activatorprops="[object Object]"
+    attach="false"
+    class=""
+    closeonback="true"
+    closeoncontentclick="false"
+    color="info"
+    contained="false"
+    disabled="false"
+    eager="true"
+    location="top"
+    locationstrategy="static"
+    modelvalue="true"
+    multiline="false"
+    openonhover="false"
+    origin="auto"
+    role="status"
+    rounded="4"
+    tile="false"
+    timeout="-1"
+    timer="false"
+    transition="v-snackbar-transition"
+    variant="elevated"
+    vertical="false"
+    width="960px"
+    zindex="2000"
+  ></v-snackbar-stub>
+</div>
 `;

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

@@ -1,7 +1,20 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`PageContainer > render correctly 1`] = `
-"<div data-v-fb0b02fd="" class="py-10 px-14 vd-page-container d-flex justify-center">
-  <div data-v-fb0b02fd="" class="v-sheet v-theme--light bg-transparent" style="width: 800px;"></div>
-</div>"
+<div class="
+  d-flex
+  justify-center
+  px-14
+  py-10
+  vd-page-container
+">
+  <div
+    class="
+      bg-transparent
+      v-sheet
+      v-theme--light
+    "
+    style="width: 800px;"
+  ></div>
+</div>
 `;