updating some components and configs

src/resources/js/Components/Card.vue

@@ -1,3 +1,28 @@
+<script setup>
+import { ref } from 'vue'
+
+defineEmits([])
+
+const attrs = useAttrs()
+
+const props = defineProps({
+  class: {
+    type: String,
+    default: '',
+  },
+})
+
+// computed properties
+const hasHeader = computed(() => !! useSlots().header);
+
+// watchers
+
+// lifecycle hooks
+
+// methods
+
+</script>
+
 <template>
     <div class="card" :class="class">
         <div class="card-header" v-if="hasHeader">
@@ -8,26 +33,3 @@
         </div>
     </div>
 </template>
-
-<script>
-import { defineComponent, ref } from 'vue'
-
-export default defineComponent({
-  props: {
-    class: {
-      type: String,
-      default: '',
-    },
-  },
-
-  setup(props, {slots}) {
-    const hasHeader = ref(false)
-
-    if (slots.header && slots.header().length) {
-      hasHeader.value = true
-    }
-
-    return { hasHeader }
-  },
-})
-</script>

src/resources/js/Layouts/AppLayout.vue

@@ -239,6 +239,7 @@ import { Head, Link } from '@inertiajs/inertia-vue3'
 import SuccessNotifications from '@/Components/Notifications/SuccessNotifications.vue'
 import ErrorNotifications from '@/Components/Notifications/ErrorNotifications.vue'
 import GenericNotifications from '@/Components/Notifications/GenericNotifications.vue'
+import WarningNotifications from '@/Components/Notifications/WarningNotifications.vue'
 import ApplicationMark from '@/Jetstream/ApplicationMark.vue'
 import ResponsiveNavLink from '@/Components/ResponsiveNavLink.vue'
 import SidenavLink from '@/Components/SidenavLink.vue'
@@ -257,6 +258,7 @@ export default defineComponent({
     SuccessNotifications,
     ErrorNotifications,
     GenericNotifications,
+    WarningNotifications,
     ApplicationMark,
     ResponsiveNavLink,
     SidenavLink,