@tekkare/romulus 0.1.249 → 0.1.250

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.16.0"
   },
-  "version": "0.1.248",
+  "version": "0.1.249",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/components/Notes.vue

@@ -17,9 +17,16 @@
   main : une note qu'on rallonge annoncerait sinon une duree fausse. La date,
   elle, vient de l'appelant — c'est une date de revision editoriale, que rien
   dans le contenu ne permet de deviner.
+
+  `openId` sert au lecteur qui arrive par un renvoi (le « i » d'un filtre) :
+  la note qu'il est venu chercher s'ouvre depliee et defile en vue, au lieu
+  d'une liste repliee ou il devrait la retrouver. La recherche et la pastille
+  sont remises a zero, sinon la note pourrait etre filtree hors de la liste.
+  Le depliage n'a lieu qu'une fois par identifiant : un rechargement des notes
+  ne rouvre pas une note que le lecteur vient de replier.
 -->
 <script setup lang="ts">
-import { computed, ref } from 'vue'
+import { computed, nextTick, ref, watch } from 'vue'
 
 export type RmNoteTone = 'primary' | 'info' | 'warning' | 'success' | 'neutral'
 
@@ -90,6 +97,11 @@ const props = withDefaults(defineProps<{
    */
   editable?: boolean
   lang?: 'fr' | 'en'
+  /**
+   * Note a ouvrir depliee et a montrer. Attendue meme si les notes arrivent
+   * apres (chargement distant) : elle s'ouvre des qu'elle est dans la liste.
+   */
+  openId?: string | null
 }>(), {
   categories: () => [],
   title: 'Notes',
@@ -97,6 +109,7 @@ const props = withDefaults(defineProps<{
   badge: undefined,
   editable: false,
   lang: 'fr',
+  openId: null,
 })
 
 const emit = defineEmits<{ navigate: [to: string], edit: [id: string] }>()
@@ -136,6 +149,30 @@ const search = ref('')
 const category = ref('all')
 const open = ref<string[]>([])
 
+const root = ref<HTMLElement | null>(null)
+let revealed: string | null = null
+
+watch(
+  () => [props.openId, props.notes] as const,
+  ([id]) => {
+    if (!id) {
+      revealed = null
+      return
+    }
+    if (id === revealed || !props.notes.some(note => note.id === id)) return
+    revealed = id
+    search.value = ''
+    category.value = 'all'
+    if (!open.value.includes(id)) open.value = [...open.value, id]
+    nextTick(() => {
+      root.value
+        ?.querySelector(`[data-note-id="${CSS.escape(id)}"]`)
+        ?.scrollIntoView({ block: 'start' })
+    })
+  },
+  { immediate: true },
+)
+
 function toggle(id: string) {
   open.value = open.value.includes(id)
     ? open.value.filter(item => item !== id)
@@ -237,7 +274,7 @@ function onLink(to: string) {
 </script>
 
 <template>
-  <div class="rm-notes">
+  <div ref="root" class="rm-notes">
     <div class="rm-notes__head">
       <h2 v-if="title" class="rm-notes__title">{{ title }}</h2>
       <span v-if="badge" class="rm-notes__badge">
@@ -290,6 +327,7 @@ function onLink(to: string) {
       <article
         v-for="note in shown"
         :key="note.id"
+        :data-note-id="note.id"
         class="rm-notes__note"
         :class="{ 'rm-notes__note--open': open.includes(note.id) }"
       >

package/layer/app/components/panels/OipPanelNotes.vue

@@ -29,6 +29,7 @@
     badge="Tekkare"
     :lang="locale === 'en' ? 'en' : 'fr'"
     :editable="superAdmin"
+    :open-id="openId"
     @navigate="go"
     @edit="openEditor"
   />
@@ -60,8 +61,10 @@ const props = withDefaults(
     showOrigin?: boolean;
     /** Notes encore ecrites dans le code de l'app (cf. useOipNotes). */
     localNotes?: Note[];
+    /** Note a ouvrir depliee : le « i » d'un filtre renvoie a sa note. */
+    openId?: string | null;
   }>(),
-  { sourceUuids: () => [], superAdmin: false, showOrigin: undefined, localNotes: () => [] },
+  { openId: null, sourceUuids: () => [], superAdmin: false, showOrigin: undefined, localNotes: () => [] },
 );
 
 const { locale } = useI18n();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tekkare/romulus",
-  "version": "0.1.249",
+  "version": "0.1.250",
   "description": "Romulus Design System - Nuxt module by Tekkare",
   "license": "MIT",
   "type": "module",