@innertia-solutions/nuxt-theme-spark 0.1.120 → 0.1.122

package/components/Admin/Page.vue

@@ -28,7 +28,8 @@ const iconColorClass = computed(() => ({
   <div class="space-y-4">
 
     <!-- Page header card -->
-    <div v-if="title" class="flex items-center justify-between bg-card border border-card-line rounded-2xl shadow-sm px-4 py-3">
+    <div v-if="title" class="sticky top-0 z-20 -mx-3 -mt-3 px-3 pt-3 pb-3 bg-background-1">
+    <div class="flex items-center justify-between bg-card border border-card-line rounded-2xl shadow-sm px-4 py-3">
       <div class="flex items-center gap-x-4 min-w-0">
         <div v-if="iconComponent" class="shrink-0 size-10 rounded-xl flex items-center justify-center border border-current/15" :class="iconColorClass">
           <component :is="iconComponent" class="size-5" stroke="1.5" />
@@ -50,6 +51,7 @@ const iconColorClass = computed(() => ({
         <slot name="actions" />
       </div>
     </div>
+    </div>
 
     <!-- Tabs -->
     <div v-if="$slots.tabs">

package/components/Admin/PageHeader.vue

@@ -2,12 +2,11 @@
 defineProps<{
   title: string
   description?: string
-  sticky?: boolean
 }>()
 </script>
 
 <template>
-  <div :class="sticky ? 'sticky top-3 z-20' : ''">
+  <div class="sticky top-0 z-20 -mx-3 -mt-3 px-3 pt-3 pb-3 bg-background-1">
   <div class="flex items-center justify-between bg-card border border-card-line rounded-2xl shadow-sm px-4 py-3">
     <div class="flex items-center gap-x-4">
       <slot name="icon" />

package/components/Table/PreviewTimeline.vue

@@ -3,21 +3,27 @@ const props = defineProps({
   endpoint: { type: String, required: true },
 })
 
-const config = useRuntimeConfig()
-const baseUrl = config.public?.apiBaseUrl ?? '/api'
+const api     = useApi()
+const events  = ref([])
+const pending = ref(false)
+const error   = ref(null)
 
-const url = computed(() => `${baseUrl}/${props.endpoint}`)
+const fetchHistory = async () => {
+  pending.value = true
+  error.value   = null
+  try {
+    const data   = await api.get(props.endpoint)
+    events.value = Array.isArray(data) ? data : (data.data ?? [])
+  } catch (e) {
+    error.value = e
+  } finally {
+    pending.value = false
+  }
+}
 
-const { data: rawData, pending, error, refresh } = useFetch(url, {
-  watch: [url],
-  key: computed(() => `timeline-${props.endpoint}`),
-})
+const refresh = fetchHistory
 
-const events = computed(() => {
-  const d = rawData.value
-  if (!d) return []
-  return Array.isArray(d) ? d : (d.data ?? [])
-})
+watch(() => props.endpoint, fetchHistory, { immediate: true })
 
 const typeConfig = {
   created:  { color: 'bg-green-500',  label: 'Creado',      textColor: 'text-green-600 dark:text-green-400'  },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@innertia-solutions/nuxt-theme-spark",
-  "version": "0.1.120",
+  "version": "0.1.122",
   "description": "Innertia Solutions — Spark theme: backoffice, landing and mobile components and layouts",
   "keywords": [
     "nuxt",