stubs/inertia-vue-ts/app/javascript/Components/NavLink.vue in kaze-0.5.0 vs stubs/inertia-vue-ts/app/javascript/Components/NavLink.vue in kaze-0.6.0

- old
+ new

@@ -1,21 +1,21 @@ <script setup lang="ts"> -import { computed } from 'vue'; -import { Link } from '@inertiajs/vue3'; +import { computed } from 'vue' +import { Link } from '@inertiajs/vue3' const props = defineProps<{ - href: string; - active?: boolean; -}>(); + href: string + active?: boolean +}>() const classes = computed(() => - props.active - ? 'inline-flex items-center px-1 pt-1 border-b-2 border-indigo-400 dark:border-indigo-600 text-sm font-medium leading-5 text-gray-900 dark:text-gray-100 focus:outline-none focus:border-indigo-700 transition duration-150 ease-in-out' - : 'inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300 hover:border-gray-300 dark:hover:border-gray-700 focus:outline-none focus:text-gray-700 dark:focus:text-gray-300 focus:border-gray-300 dark:focus:border-gray-700 transition duration-150 ease-in-out' -); + props.active + ? 'inline-flex items-center px-1 pt-1 border-b-2 border-indigo-400 dark:border-indigo-600 text-sm font-medium leading-5 text-gray-900 dark:text-gray-100 focus:outline-none focus:border-indigo-700 transition duration-150 ease-in-out' + : 'inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300 hover:border-gray-300 dark:hover:border-gray-700 focus:outline-none focus:text-gray-700 dark:focus:text-gray-300 focus:border-gray-300 dark:focus:border-gray-700 transition duration-150 ease-in-out', +) </script> <template> - <Link :href="href" :class="classes"> - <slot /> - </Link> + <Link :href="href" :class="classes"> + <slot /> + </Link> </template>