feat: improve components & menu

package.json

@@ -1,6 +1,6 @@
 {
     "name": "kodama-ui",
-    "version": "0.28.0",
+    "version": "0.30.0",
     "description": "Kodama UI is a Vue 3 component library that provides a set of components & funcionality to build your application.",
     "homepage": "https://50l3r.github.io/kodama-ui",
     "keywords": [

src/components/data-entry/k-switch/k-switch.vue

@@ -71,12 +71,13 @@
                 description: 'Tamaño del switch'
             }
         },
-        emits: ['update:modelValue'],
+        emits: ['update:modelValue', 'change'],
         setup(props, ctx) {
             const hasSlot = (name: string) => !!ctx.slots[name]
 
             const onChange = (val: any) => {
                 ctx.emit('update:modelValue', val.target.checked)
+                ctx.emit('change', val.target.checked)
             }
 
             const model = computed({
@@ -85,6 +86,7 @@
                 },
                 set(val) {
                     ctx.emit('update:modelValue', val)
+                    ctx.emit('change', val)
                 }
             })
 

src/components/feedback/k-empty/k-empty.vue

@@ -8,7 +8,7 @@
                 :size="3"
                 bolder
                 uppercase
-                class="text-gray-900"
+                class="text-gray-900 dark:text-white"
             >
                 {{ title }}
                 <template v-if="subtitle" #subtitle>

src/layouts/main/partials/aside/menu.vue

@@ -201,7 +201,7 @@
 </template>
 
 <script lang="ts">
-    import { defineComponent, inject, onMounted } from 'vue'
+    import { computed, defineComponent, inject, onMounted } from 'vue'
     import { RouteLocationRaw, useRoute } from 'vue-router'
     import { Accordion } from 'flowbite'
 
@@ -221,24 +221,27 @@
             const $menu: () => Menu[] = inject('$menu') || (() => [])
 
             const SeparatorMenu: Menu[] = [{ separator: true }]
-            const FrontMenu: Menu[] = $menu()
-            const menu: Menu[] = [...FrontMenu, ...SeparatorMenu, ...SysMenu]
+
+            const menu = computed(() => {
+                const FrontMenu: Menu[] = $menu()
+                return [...FrontMenu, ...SeparatorMenu, ...SysMenu]
+            })
 
             const hasActiveChildren = (match: RouteLocationRaw) => {
                 return route.path.indexOf(match.toString()) !== -1
             }
 
-            const checkRoles = (menu: any) => {
-                if (menu.auth !== undefined) return !!menu.auth
+            const checkRoles = (item: any) => {
+                if (item.auth !== undefined) return !!item.auth
                 return true
             }
 
-            const hasOneAccess = (menu: any) => {
-                if (menu.auth) return menu.auth
+            const hasOneAccess = (item: any) => {
+                if (item.auth) return item.auth
 
-                if (menu.pages) {
-                    for (let i = 0; i < menu.pages.length; i++) {
-                        const page = menu.pages[i]
+                if (item.pages) {
+                    for (let i = 0; i < item.pages.length; i++) {
+                        const page = item.pages[i]
 
                         if (page.auth) return page.auth
 
@@ -260,7 +263,7 @@
                 // create an array of objects with the id, trigger element (eg. button), and the content element
                 let accordionItems: any[] = []
                 let i = 0
-                menu.forEach((item) => {
+                menu.value.forEach((item) => {
                     if (item.pages) {
                         item.pages.forEach((page) => {
                             if (page.pages) {