@luizleon/sf.prefeiturasp.vuecomponents 0.0.48 → 0.0.50

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luizleon/sf.prefeiturasp.vuecomponents",
-  "version": "0.0.48",
+  "version": "0.0.50",
   "type": "module",
   "main": "dist/sf.prefeiturasp.vuecomponents.umd.js",
   "module": "dist/sf.prefeiturasp.vuecomponents.es.js",

package/src/components/panelmenu/PanelMenu.vue

@@ -1,16 +1,20 @@
 <script setup lang="ts">
-import { RouteRecordName, useRoute } from "vue-router";
+import { useRoute } from "vue-router";
 import PanelMenu, { PanelMenuExpandedKeys } from "primevue/panelmenu";
 import Icon from "./../icon/Icon.vue";
-import { ref, watch } from "vue";
+import { Ref, computed, ref, watch } from "vue";
 
 export interface SfPanelMenuItem {
-  [x: string]: any;
   label: string;
-  route?: RouteRecordName;
+  routeName?: string;
   url?: string;
   icon?: string;
   items?: SfPanelMenuItem[];
+  key?: string;
+}
+
+interface Menu extends SfPanelMenuItem {
+  parentKey?: string;
 }
 
 const props = defineProps<{
@@ -19,15 +23,19 @@ const props = defineProps<{
 
 const route = useRoute();
 
-AdicionarSourceKeys(props.items);
+const menu: Ref<Menu[]> = computed(() => {
+  return props.items;
+});
+
+AdicionarSourceKeys(menu.value);
 
 function AdicionarSourceKeys(
-  items: SfPanelMenuItem[],
+  items: Menu[],
   key: string | undefined = undefined
 ) {
   items.forEach((item) => {
     if (!!key) {
-      item.sourceKey = key;
+      item.parentKey = key;
     }
     if (item.items) {
       AdicionarSourceKeys(item.items, item.key);
@@ -38,13 +46,13 @@ function AdicionarSourceKeys(
 const expandedKeys = ref<PanelMenuExpandedKeys>({});
 
 function MudancaDeRota(
-  items: SfPanelMenuItem[],
+  items: Menu[],
   route: string,
   key: string | undefined = undefined
 ) {
   items.forEach((item) => {
-    if (item.route && item.route === route && !!key) {
-      expandedKeys.value[key] = key === item.sourceKey;
+    if (!!item.routeName && item.routeName === route && !!key) {
+      expandedKeys.value[key] = key === item.parentKey;
     }
     if (item.items) {
       MudancaDeRota(item.items, route, item.key);
@@ -56,14 +64,14 @@ watch(
   () => route.name,
   (v) => {
     if (!v) return;
-    MudancaDeRota(props.items, v.toString());
+    MudancaDeRota(menu.value, v.toString());
   }
 );
 </script>
 
 <template>
   <PanelMenu
-    :model="props.items"
+    :model="menu"
     v-model:expandedKeys="expandedKeys"
     :multiple="true"
     :class="'sf-p-2'"