@tekkare/romulus 0.1.75 → 0.1.76

package/dist/module.json

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

package/dist/runtime/components/FilterComplex.vue

@@ -15,6 +15,7 @@
 -->
 <script setup lang="ts">
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
+import { rmPanelOpened, rmPanelRegister } from '../utils/panels'
 import {
   PhCaretDown,
   PhMagnifyingGlass,
@@ -263,6 +264,7 @@ function clearAll() {
 
 function toggle() {
   isOpen.value = !isOpen.value
+  if (isOpen.value) rmPanelOpened(close)
   if (!isOpen.value) {
     addInput.value = ''
     addSearch.value = ''
@@ -291,11 +293,14 @@ function onKeydown(e: KeyboardEvent) {
   if (e.key === 'Escape' && isOpen.value) close()
 }
 
+let unregister: (() => void) | undefined
 onMounted(() => {
+  unregister = rmPanelRegister(close)
   document.addEventListener('click', onClickOutside)
   document.addEventListener('keydown', onKeydown)
 })
 onUnmounted(() => {
+  unregister?.()
   clearTimeout(debounce)
   document.removeEventListener('click', onClickOutside)
   document.removeEventListener('keydown', onKeydown)

package/dist/runtime/components/FilterDropdown.vue

@@ -2,6 +2,7 @@
 import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
 import { PhCaretDown, PhCheck, PhMagnifyingGlass } from '@phosphor-icons/vue'
 import type { Component } from 'vue'
+import { rmPanelOpened, rmPanelRegister } from '../utils/panels'
 
 export interface FilterDropdownOption {
   label: string
@@ -101,8 +102,13 @@ const rows = computed<DropdownRow[]>(() => {
   return out
 })
 
+function close() {
+  isOpen.value = false
+}
+
 function toggle() {
   isOpen.value = !isOpen.value
+  if (isOpen.value) rmPanelOpened(close)
 }
 
 // La recherche repart vide a chaque ouverture, et prend le curseur : sinon le
@@ -151,8 +157,15 @@ function onClickOutside(e: Event) {
   }
 }
 
-onMounted(() => document.addEventListener('click', onClickOutside))
-onUnmounted(() => document.removeEventListener('click', onClickOutside))
+let unregister: (() => void) | undefined
+onMounted(() => {
+  unregister = rmPanelRegister(close)
+  document.addEventListener('click', onClickOutside)
+})
+onUnmounted(() => {
+  unregister?.()
+  document.removeEventListener('click', onClickOutside)
+})
 </script>
 
 <template>

package/package.json

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