@cnamts/synapse 1.0.6 → 1.0.7

package/src/components/Amelipro/AmeliproResultList/__tests__/__snapshots__/AmeliproResultList.spec.ts.snap

@@ -0,0 +1,434 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`AmeliproResultList > render correctly 1`] = `
+<div
+  class="amelipro-result-list"
+  id="amelipro-result-unique-id-container"
+>
+  <div
+    class="
+      align-end
+      amelipro-result-list__infos
+      d-flex
+      justify-space-between
+      mb-6
+    "
+    id="amelipro-result-unique-id-header"
+  >
+    <p
+      class="
+        align-center
+        d-inline-block
+        font-weight-semibold
+        mb-0
+        total-counter
+      "
+      id="amelipro-result-unique-id-result-counter"
+    >
+      <span class="d-sr-only">
+        Nombre de lignes dans la liste ci-après :
+      </span>
+      12 résultat(s)
+    </p>
+    <div class="
+      align-center
+      amelipro-result-list__select__wrapper
+      d-inline-flex
+    ">
+      <!-- v-if -->
+      <div
+        class="
+          amelipro-result-list__pagination-select
+          mb-0
+          ml-2
+          pt-0
+        "
+        id="amelipro-result-unique-id-pagination-select-container"
+        style="
+          margin-bottom: 12px;
+          max-width: 170px;
+        "
+      >
+        <div class="
+          amelipro-select__wrapper
+          d-flex
+          flex-column
+          w-100
+        ">
+          <div class="
+            align-start
+            d-inline-flex
+          ">
+            <label
+              class="
+                amelipro-select__label
+                mr-2
+              "
+              for="amelipro-result-unique-id-pagination-select"
+              id="amelipro-result-unique-id-pagination-select-label"
+            >
+              Nb lignes/page :
+              <!-- v-if -->
+            </label>
+          </div>
+          <div class="
+            amelipro-result-list__pagination-select
+            amelipro-select
+            mb-0
+            ml-2
+            pt-0
+            pt-0
+            v-input
+            v-input--center-affix
+            v-input--density-compact
+            v-input--dirty
+            v-input--horizontal
+            v-locale--is-ltr
+            v-select
+            v-select--selected
+            v-select--single
+            v-text-field
+            v-theme--light
+          ">
+            <!---->
+            <div class="v-input__control">
+              <div
+                class="
+                  bg-ap-white
+                  v-field
+                  v-field--active
+                  v-field--appended
+                  v-field--center-affix
+                  v-field--dirty
+                  v-field--has-background
+                  v-field--no-label
+                  v-field--variant-outlined
+                  v-locale--is-ltr
+                  v-theme--light
+                "
+                role="combobox"
+              >
+                <div class="v-field__overlay"></div>
+                <div class="v-field__loader">
+                  <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
+                      appear="false"
+                      css="true"
+                      name="fade-transition"
+                      persisted="false"
+                    >
+                      <div class="v-progress-linear__indeterminate">
+                        <div class="
+                          long
+                          v-progress-linear__indeterminate
+                        "></div>
+                        <div class="
+                          short
+                          v-progress-linear__indeterminate
+                        "></div>
+                      </div>
+                    </transition-stub>
+                    <!---->
+                  </div>
+                </div>
+                <!---->
+                <div
+                  class="v-field__field"
+                  data-no-activator=""
+                >
+                  <!---->
+                  <!---->
+                  <!---->
+                  <div
+                    class="v-field__input"
+                    data-no-activator=""
+                  >
+                    <!---->
+                    <!---->
+                    <div class="v-select__selection">
+                      <span class="v-select__selection-text">
+                        10
+                        <!---->
+                      </span>
+                    </div>
+                    <input
+                      aria-label="Open"
+                      aria-required="false"
+                      id="amelipro-result-unique-id-pagination-select"
+                      inputmode="none"
+                      size="1"
+                      title="Open"
+                      type="text"
+                      value="10"
+                    />
+                  </div>
+                  <!---->
+                </div>
+                <!---->
+                <div class="v-field__append-inner">
+                  <!---->
+                  <i
+                    aria-hidden="true"
+                    class="
+                      mdi
+                      mdi-menu-down
+                      notranslate
+                      v-icon
+                      v-icon--size-default
+                      v-select__menu-icon
+                      v-theme--light
+                    "
+                  ></i>
+                  <!---->
+                </div>
+                <div class="v-field__outline">
+                  <div class="v-field__outline__start"></div>
+                  <!---->
+                  <div class="v-field__outline__end"></div>
+                  <!---->
+                </div>
+              </div>
+            </div>
+            <!---->
+            <!---->
+          </div>
+        </div>
+        <!-- v-if -->
+      </div>
+    </div>
+  </div>
+  <div>
+    <ul
+      aria-label="Exemple de liste de résultats"
+      class="
+        amelipro-result-list__list
+        list-style-none
+      "
+      id="amelipro-result-unique-id-list"
+    >
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-0"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-1"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-2"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-3"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-4"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-5"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-6"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-7"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-8"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+      <li
+        class="amelipro-result-list__item"
+        id="amelipro-result-unique-id-item-9"
+      >
+        <p>
+          Exemple de résultat
+        </p>
+      </li>
+    </ul>
+  </div>
+  <nav
+    aria-label="pagination"
+    class="
+      align-center
+      amelipro-pagination
+      d-flex
+      justify-center
+      mt-2
+    "
+    id="amelipro-result-unique-id-pagination-container"
+  >
+    <ol
+      class="
+        amelipro-pagination__list
+        d-flex
+        list-style-none
+      "
+      id="amelipro-result-unique-id-pagination-list"
+    >
+      <li class="amelipro-pagination__item">
+        <button
+          aria-current="page"
+          class="
+            amelipro-btn
+            amelipro-btn--style
+            amelipro-pagination__btn
+            bg-ap-blue-darken-1
+            elevation-0
+            v-btn
+            v-btn--density-default
+            v-btn--flat
+            v-btn--size-default
+            v-btn--variant-flat
+            v-theme--light
+          "
+          id="amelipro-result-unique-id-pagination-first"
+          style="
+            height: auto;
+            min-height: 2.5rem;
+            color: #FFFFFF !important;
+          "
+          title="page active"
+          type="button"
+        >
+          <span class="v-btn__overlay"></span>
+          <span class="v-btn__underlay"></span>
+          <!---->
+          <span
+            class="v-btn__content"
+            data-no-activator=""
+          >
+            <span class="
+              align-center
+              amelipro-custom-btn
+              d-flex
+              flex-row
+            ">
+              1
+              <!-- v-if -->
+              <!-- v-if -->
+            </span>
+          </span>
+          <!---->
+          <!---->
+        </button>
+      </li>
+      <!-- v-if -->
+      <!-- v-if -->
+      <li class="amelipro-pagination__item">
+        <button
+          class="
+            amelipro-btn
+            amelipro-btn--style
+            amelipro-pagination__btn
+            bg-ap-white
+            elevation-0
+            v-btn
+            v-btn--density-default
+            v-btn--flat
+            v-btn--size-default
+            v-btn--variant-flat
+            v-theme--light
+          "
+          id="amelipro-result-unique-id-pagination-last"
+          style="
+            height: auto;
+            min-height: 2.5rem;
+            color: #00749C !important;
+          "
+          type="button"
+        >
+          <span class="v-btn__overlay"></span>
+          <span class="v-btn__underlay"></span>
+          <!---->
+          <span
+            class="v-btn__content"
+            data-no-activator=""
+          >
+            <span class="
+              align-center
+              amelipro-custom-btn
+              d-flex
+              flex-row
+            ">
+              2
+              <!-- v-if -->
+              <!-- v-if -->
+            </span>
+          </span>
+          <!---->
+          <!---->
+        </button>
+      </li>
+    </ol>
+  </nav>
+</div>
+`;

package/src/components/Amelipro/AmeliproTable/AmeliproTable.vue

@@ -100,6 +100,9 @@
 
 	watch(() => props.dataList, () => {
 		updatePagination(props.dataList, itemToDisplay.value)
+		if (currentPage.value > paginationTable.value.length) {
+			currentPage.value = Math.max(1, paginationTable.value.length)
+		}
 	})
 
 	onMounted(() => {
@@ -179,7 +182,7 @@
 				:id="`${uniqueId}-total-counter`"
 				class="d-inline-block mb-0 total-counter font-weight-semibold"
 			>
-				<span class="d-sr-only">Nombre de ligne dans le tableau ci-après :</span>
+				<span class="d-sr-only">Nombre de lignes dans le tableau ci-après :</span>
 				{{ dataList.length }} {{ counterLabel }}
 			</p>
 
@@ -190,13 +193,12 @@
 				<AmeliproSelect
 					v-if="sortSelectItems.length > 0"
 					v-model="sortSelectModel"
-					class="ml-2 amelipro-table__sort-select"
+					class="ml-2 mb-0 pt-0 amelipro-table__sort-select"
 					global-max-width="170px"
 					:hide-error-message="true"
 					:items="sortSelectItems"
 					:label="sortSelectLabel"
 					:placeholder="sortSelectPlaceholder"
-					style="margin-bottom: 0 !important; padding-top: 0 !important;"
 					:unique-id="`${uniqueId}-sort-select`"
 					@update:model-value="emitSortSelectChange"
 				/>
@@ -204,13 +206,12 @@
 				<AmeliproSelect
 					v-if="mdAndUp"
 					v-model="paginationSelectModel"
-					class="ml-2 amelipro-table__pagination-select"
+					class="ml-2 mb-0 pt-0 amelipro-table__pagination-select"
 					global-max-width="170px"
 					:hide-error-message="true"
 					:items="paginationSelectItems"
 					:label="paginationSelectLabel"
 					:placeholder="paginationSelectPlaceholder"
-					style="margin-bottom: 0 !important; padding-top: 0 !important;"
 					:unique-id="`${uniqueId}-pagination-select`"
 					@update:model-value="emitPaginationSelectChange()"
 				/>

package/src/components/Amelipro/AmeliproTable/__tests__/__snapshots__/AmeliproTable.spec.ts.snap

@@ -25,7 +25,7 @@ exports[`AmeliproTable > render correctly 1`] = `
       id="amelipro-table-id-total-counter"
     >
       <span class="d-sr-only">
-        Nombre de ligne dans le tableau ci-après :
+        Nombre de lignes dans le tableau ci-après :
       </span>
       4 item(s)
     </p>
@@ -41,13 +41,14 @@ exports[`AmeliproTable > render correctly 1`] = `
       <div
         class="
           amelipro-table__pagination-select
+          mb-0
           ml-2
+          pt-0
         "
         id="amelipro-table-id-pagination-select-container"
         style="
-          margin-bottom: 0px !important;
+          margin-bottom: 12px;
           max-width: 170px;
-          padding-top: 0px !important;
         "
       >
         <div class="
@@ -72,29 +73,25 @@ exports[`AmeliproTable > render correctly 1`] = `
               <!-- v-if -->
             </label>
           </div>
-          <div
-            class="
-              amelipro-select
-              amelipro-table__pagination-select
-              ml-2
-              pt-0
-              v-input
-              v-input--center-affix
-              v-input--density-compact
-              v-input--dirty
-              v-input--horizontal
-              v-locale--is-ltr
-              v-select
-              v-select--selected
-              v-select--single
-              v-text-field
-              v-theme--light
-            "
-            style="
-              margin-bottom: 0px !important;
-              padding-top: 0px !important;
-            "
-          >
+          <div class="
+            amelipro-select
+            amelipro-table__pagination-select
+            mb-0
+            ml-2
+            pt-0
+            pt-0
+            v-input
+            v-input--center-affix
+            v-input--density-compact
+            v-input--dirty
+            v-input--horizontal
+            v-locale--is-ltr
+            v-select
+            v-select--selected
+            v-select--single
+            v-text-field
+            v-theme--light
+          ">
             <!---->
             <div class="v-input__control">
               <div

package/src/components/Amelipro/AmeliproTileBtn/AmeliproTileBtn.stories.ts

@@ -11,8 +11,8 @@ const meta = {
 		},
 		complementaryInfoLine1: { description: 'Ligne dédiée à ajouter des informations supplémentaires (les differents éléments ne seront plus forcément alignés cela dépendra du contenu au-dessus)' },
 		complementaryInfoLine2: { description: 'Ligne dédiée à ajouter des informations supplémentaires (les differents éléments ne seront plus forcément alignés cela dépendra du contenu au-dessus)' },
-		disabled: { description: 'Url de destination du lien' },
-		href: { description: 'Désactive le bouton' },
+		disabled: { description: 'Désactive le bouton' },
+		href: { description: 'Url de destination du lien' },
 		imgMaxWidth: { description: 'Taille maximale de l’image du bouton' },
 		imgMinWidth: { description: 'Taille minimale de l’image du bouton' },
 		imgSrc: { description: 'Url de l’image du bouton' },

package/src/components/ChipList/Accessibilite.stories.ts

@@ -208,6 +208,10 @@ export const Legende: StoryObj = {
 					Problèmes relevés par Tanaguru
 				  </div>
 				</div>
+				  <div class="mt-4">
+					  <p>Rapport d’audit manuel : <a href="/audits/ChipList.xlsx" style="color:#0C41BD;">Voir le rapport</a></p>
+					  <p style="color: grey; font-size: 14px">Correctifs associés (<a href="https://github.com/assurance-maladie-digital/design-system-v3/issues/814" target="_blank" style="color:#0C41BD;">issue #814</a>)</p>
+				  </div>
 			  </div>
             `,
 		}