diff --git a/.vscode/launch.json b/.vscode/launch.json
new file mode 100644
index 00000000..9c243a03
--- /dev/null
+++ b/.vscode/launch.json
@@ -0,0 +1,15 @@
+{
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "Launch Chrome against localhost",
+      "url": "http://localhost:3000",
+      "webRoot": "${workspaceFolder}"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/README.md b/README.md
index 9dc0e298..694ddf34 100644
--- a/README.md
+++ b/README.md
@@ -9,6 +9,7 @@ RSSA - Front End
 
 - [Vue Style Guide](https://vuejs.org/style-guide)
 - [Nuxt Style Guide](https://nuxt.com/docs/4.x/guide)
+- [Shadcn Vue @radix-ui](https://radix.shadcn-vue.com/)
 
 ## Configuration
 
diff --git a/app/assets/css/main.css b/app/assets/css/main.css
index eb54a75e..1c7eaef2 100644
--- a/app/assets/css/main.css
+++ b/app/assets/css/main.css
@@ -21,9 +21,9 @@
   --muted: 210 25% 95%;
   --muted-foreground: 210 15% 50%;
 
-  /* Accent - Professional Blue */
-  --accent: 210 100% 50%;
-  --accent-foreground: 0 0% 100%;
+  /* Accent - Neutral Gray */
+  --accent: 210 40% 96%;
+  --accent-foreground: 222.2 84% 4.9%;
   --destructive: 0 75% 55%;
   --destructive-foreground: 0 0% 100%;
   --border: 210 20% 88%;
@@ -67,45 +67,43 @@
   --sidebar-accent-foreground: 240 5.9% 10%;
   --sidebar-border: 220 13% 91%;
   --sidebar-ring: 217.2 91.2% 59.8%;
+  /* .dark { */
+  /*   --background: 210 25% 8%; */
+  /*   --foreground: 210 20% 95%; */
+  /*   --card: 210 25% 10%; */
+  /*   --card-foreground: 210 20% 95%; */
+  /*   --popover: 210 25% 10%; */
+  /*   --popover-foreground: 210 20% 95%; */
+  /*   --primary: 150 75% 45%; */
+  /*   --primary-foreground: 0 0% 100%; */
+  /*   --primary-hover: 150 75% 50%; */
+  /*   --secondary: 210 25% 15%; */
+  /*   --secondary-foreground: 210 20% 90%; */
+  /*   --muted: 210 25% 15%; */
+  /*   --muted-foreground: 210 15% 65%; */
+  /*   --accent: 210 100% 55%; */
+  /*   --accent-foreground: 0 0% 100%; */
+  /*   --destructive: 0 75% 60%; */
+  /*   --destructive-foreground: 0 0% 100%; */
+  /*   --border: 210 25% 20%; */
+  /*   --input: 210 25% 15%; */
+  /*   --ring: 150 75% 45%; */
+  /*   --success: 150 75% 50%; */
+  /*   --warning: 45 95% 65%; */
+  /*   --info: 210 100% 60%; */
+  /*   --gradient-primary: linear-gradient(135deg, hsl(150 75% 45%), hsl(150 75% 55%)); */
+  /*   --gradient-medical: linear-gradient(135deg, hsl(150 75% 45%), hsl(210 100% 55%)); */
+  /*   --gradient-subtle: linear-gradient(180deg, hsl(210 25% 8%), hsl(210 25% 12%)); */
+  /*   --sidebar-background: 240 5.9% 10%; */
+  /*   --sidebar-foreground: 240 4.8% 95.9%; */
+  /*   --sidebar-primary: 224.3 76.3% 48%; */
+  /*   --sidebar-primary-foreground: 0 0% 100%; */
+  /*   --sidebar-accent: 240 3.7% 15.9%; */
+  /*   --sidebar-accent-foreground: 240 4.8% 95.9%; */
+  /*   --sidebar-border: 240 3.7% 15.9%; */
+  /*   --sidebar-ring: 217.2 91.2% 59.8%; */
 }
 
-/* .dark { */
-/*   --background: 210 25% 8%; */
-/*   --foreground: 210 20% 95%; */
-/*   --card: 210 25% 10%; */
-/*   --card-foreground: 210 20% 95%; */
-/*   --popover: 210 25% 10%; */
-/*   --popover-foreground: 210 20% 95%; */
-/*   --primary: 150 75% 45%; */
-/*   --primary-foreground: 0 0% 100%; */
-/*   --primary-hover: 150 75% 50%; */
-/*   --secondary: 210 25% 15%; */
-/*   --secondary-foreground: 210 20% 90%; */
-/*   --muted: 210 25% 15%; */
-/*   --muted-foreground: 210 15% 65%; */
-/*   --accent: 210 100% 55%; */
-/*   --accent-foreground: 0 0% 100%; */
-/*   --destructive: 0 75% 60%; */
-/*   --destructive-foreground: 0 0% 100%; */
-/*   --border: 210 25% 20%; */
-/*   --input: 210 25% 15%; */
-/*   --ring: 150 75% 45%; */
-/*   --success: 150 75% 50%; */
-/*   --warning: 45 95% 65%; */
-/*   --info: 210 100% 60%; */
-/*   --gradient-primary: linear-gradient(135deg, hsl(150 75% 45%), hsl(150 75% 55%)); */
-/*   --gradient-medical: linear-gradient(135deg, hsl(150 75% 45%), hsl(210 100% 55%)); */
-/*   --gradient-subtle: linear-gradient(180deg, hsl(210 25% 8%), hsl(210 25% 12%)); */
-/*   --sidebar-background: 240 5.9% 10%; */
-/*   --sidebar-foreground: 240 4.8% 95.9%; */
-/*   --sidebar-primary: 224.3 76.3% 48%; */
-/*   --sidebar-primary-foreground: 0 0% 100%; */
-/*   --sidebar-accent: 240 3.7% 15.9%; */
-/*   --sidebar-accent-foreground: 240 4.8% 95.9%; */
-/*   --sidebar-border: 240 3.7% 15.9%; */
-/*   --sidebar-ring: 217.2 91.2% 59.8%; */
-/* } */
-
 /* Keyframes for Animations */
 @keyframes accordion-down {
   from {
diff --git a/app/components/app/doctor/list-cfg.ts b/app/components/app/doctor/list-cfg.ts
index f697dc88..fcd73e98 100644
--- a/app/components/app/doctor/list-cfg.ts
+++ b/app/components/app/doctor/list-cfg.ts
@@ -11,6 +11,7 @@ import { defineAsyncComponent } from 'vue'
 type SmallDetailDto = any
 
 const action = defineAsyncComponent(() => import('~/components/pub/custom-ui/data/dropdown-action-dud.vue'))
+const statusBadge = defineAsyncComponent(() => import('./status-badge.vue'))
 
 const doctorStatus = {
   0: 'Tidak Aktif',
@@ -26,10 +27,10 @@ export const cols: Col[] = [
   {},
   {},
   {},
+  { width: 120 },
   { width: 100 },
-  { width: 100 },
-  { width: 100 },
-  { width: 50 },
+  {},
+  {},
 ]
 
 export const header: Th[][] = [
@@ -43,6 +44,7 @@ export const header: Th[][] = [
     { label: 'Fee Ranap' },
     { label: 'Fee Rajal' },
     { label: 'Status' },
+    { label: '' },
   ],
 ]
 
@@ -66,7 +68,6 @@ export const delKeyNames: KeyLabel[] = [
 
 export const funcParsed: RecStrFuncUnknown = {
   name: (rec: unknown): unknown => {
-    console.log(rec)
     const recX = rec as SmallDetailDto
     return `${recX.frontTitle} ${recX.name}  ${recX.endTitle}`.trim()
   },
@@ -85,10 +86,6 @@ export const funcParsed: RecStrFuncUnknown = {
     const recX = rec as SmallDetailDto
     return Number(recX.outPatient_itemPrice.price).toLocaleString('id-ID')
   },
-  status: (rec: unknown): unknown => {
-    const recX = rec as SmallDetailDto
-    return doctorStatus[recX.status_code as keyof typeof doctorStatus]
-  },
 }
 
 export const funcComponent: RecStrFuncComponent = {
@@ -100,6 +97,14 @@ export const funcComponent: RecStrFuncComponent = {
     }
     return res
   },
+  status(rec, idx) {
+    const res: RecComponent = {
+      idx,
+      rec: rec as object,
+      component: statusBadge,
+    }
+    return res
+  },
 }
 
 export const funcHtml: RecStrFuncUnknown = {
diff --git a/app/components/app/doctor/status-badge.vue b/app/components/app/doctor/status-badge.vue
new file mode 100644
index 00000000..32cdfbca
--- /dev/null
+++ b/app/components/app/doctor/status-badge.vue
@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import { Badge } from '~/components/pub/ui/badge'
+
+const props = defineProps<{
+  rec: any
+  idx?: number
+}>()
+
+const doctorStatus = {
+  0: 'Tidak Aktif',
+  1: 'Aktif',
+}
+
+const statusText = computed(() => {
+  return doctorStatus[props.rec.status_code as keyof typeof doctorStatus]
+})
+
+const badgeVariant = computed(() => {
+  return props.rec.status_code === 1 ? 'default' : 'destructive'
+})
+</script>
+
+<template>
+  <div class="flex justify-center">
+    <Badge :variant="badgeVariant">
+      {{ statusText }}
+    </Badge>
+  </div>
+</template>
diff --git a/app/components/app/patient/list-cfg.ts b/app/components/app/patient/list-cfg.ts
index d9c9439f..fd4d0317 100644
--- a/app/components/app/patient/list-cfg.ts
+++ b/app/components/app/patient/list-cfg.ts
@@ -11,6 +11,7 @@ import { defineAsyncComponent } from 'vue'
 type SmallDetailDto = any
 
 const action = defineAsyncComponent(() => import('~/components/pub/custom-ui/data/dropdown-action-dud.vue'))
+const statusBadge = defineAsyncComponent(() => import('./status-badge.vue'))
 
 export const cols: Col[] = [
   {},
@@ -110,6 +111,17 @@ export const funcComponent: RecStrFuncComponent = {
     }
     return res
   },
+  status(rec, idx) {
+    if (rec.status === null) {
+      rec.status_code = 0
+    }
+    const res: RecComponent = {
+      idx,
+      rec: rec as object,
+      component: statusBadge,
+    }
+    return res
+  },
 }
 
 export const funcHtml: RecStrFuncUnknown = {
diff --git a/app/components/app/patient/status-badge.vue b/app/components/app/patient/status-badge.vue
new file mode 100644
index 00000000..32cdfbca
--- /dev/null
+++ b/app/components/app/patient/status-badge.vue
@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import { Badge } from '~/components/pub/ui/badge'
+
+const props = defineProps<{
+  rec: any
+  idx?: number
+}>()
+
+const doctorStatus = {
+  0: 'Tidak Aktif',
+  1: 'Aktif',
+}
+
+const statusText = computed(() => {
+  return doctorStatus[props.rec.status_code as keyof typeof doctorStatus]
+})
+
+const badgeVariant = computed(() => {
+  return props.rec.status_code === 1 ? 'default' : 'destructive'
+})
+</script>
+
+<template>
+  <div class="flex justify-center">
+    <Badge :variant="badgeVariant">
+      {{ statusText }}
+    </Badge>
+  </div>
+</template>
diff --git a/app/components/app/rehab/registration/sep-prosedur/list-cfg.ts b/app/components/app/rehab/registration/sep-prosedur/list-cfg.ts
index 0e1fe7f4..24cc80d1 100644
--- a/app/components/app/rehab/registration/sep-prosedur/list-cfg.ts
+++ b/app/components/app/rehab/registration/sep-prosedur/list-cfg.ts
@@ -1,9 +1,9 @@
-import type { Col, KeyLabel, RecComponent, RecStrFuncComponent, RecStrFuncUnknown, Th } from '../../pub/nav/types'
+import type { Col, KeyLabel, RecComponent, RecStrFuncComponent, RecStrFuncUnknown, Th } from '~/components/pub/custom-ui/data/types'
 import { defineAsyncComponent } from 'vue'
 
 type SmallDetailDto = any
 
-const action = defineAsyncComponent(() => import('~/components/pub/nav/dropdown-action-dud.vue'))
+const action = defineAsyncComponent(() => import('~/components/pub/custom-ui/data/dropdown-action-dud.vue'))
 
 export const cols: Col[] = [
   {},
diff --git a/app/components/app/satusehat/badge-patient.vue b/app/components/app/satusehat/badge-patient.vue
new file mode 100644
index 00000000..41202aaf
--- /dev/null
+++ b/app/components/app/satusehat/badge-patient.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+const props = defineProps<{
+  rec: any
+  idx?: number
+}>()
+</script>
+
+<template>
+  <div class="flex flex-col justify-center">
+    <p class="font-semibold text-sm">{{ props.rec.patient.name }}</p>
+    <p class="text-xs text-muted-foreground">{{ props.rec.patient.mrn }}</p>
+  </div>
+</template>
diff --git a/app/components/app/satusehat/badge-status.vue b/app/components/app/satusehat/badge-status.vue
new file mode 100644
index 00000000..5ff492f0
--- /dev/null
+++ b/app/components/app/satusehat/badge-status.vue
@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import Badge from './badge.vue'
+import { rowStatus } from './list-cfg'
+
+const props = defineProps<{
+  rec: { status: number }
+  idx?: number
+}>()
+
+const variants = {
+  0: 'error',
+  1: 'warning',
+  2: 'info',
+} as const
+
+const statusText = computed(() => {
+  return rowStatus[props.rec.status as keyof typeof rowStatus]
+})
+
+const badgeStatus = computed((): 'error' | 'warning' | 'success' | 'info' => {
+  return variants[props.rec.status as keyof typeof variants] ?? 'info'
+})
+</script>
+
+<template>
+  <div class="flex">
+    <Badge :status="badgeStatus" :text="statusText" />
+  </div>
+</template>
diff --git a/app/components/app/satusehat/badge.vue b/app/components/app/satusehat/badge.vue
new file mode 100644
index 00000000..197cb084
--- /dev/null
+++ b/app/components/app/satusehat/badge.vue
@@ -0,0 +1,36 @@
+<script setup lang="ts">
+import { cva } from 'class-variance-authority'
+import { cn } from '~/lib/utils'
+
+interface BadgeProps {
+  status: 'success' | 'info' | 'warning' | 'error'
+  text: string
+}
+
+const props = defineProps<BadgeProps>()
+
+const badgeVariants = cva(
+  'inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
+  {
+    variants: {
+      variant: {
+        success: 'rounded-full border-transparent bg-green-500 text-white hover:bg-green-600',
+        info: 'rounded-full border-transparent bg-blue-500 text-white hover:bg-blue-600',
+        warning: 'rounded-full border-transparent bg-yellow-500 text-white hover:bg-yellow-600',
+        error: 'rounded-full border-transparent bg-red-500 text-white hover:bg-red-600',
+      },
+    },
+    defaultVariants: {
+      variant: 'info',
+    },
+  },
+)
+</script>
+
+<template>
+  <div class="flex">
+    <div :class="cn(badgeVariants({ variant: props.status }))">
+      {{ props.text }}
+    </div>
+  </div>
+</template>
diff --git a/app/components/app/satusehat/button-action.vue b/app/components/app/satusehat/button-action.vue
new file mode 100644
index 00000000..f8ee85ec
--- /dev/null
+++ b/app/components/app/satusehat/button-action.vue
@@ -0,0 +1,16 @@
+<script setup lang="ts">
+const props = defineProps<{
+  text: string
+  icon: string
+}>()
+</script>
+
+<template>
+  <Button
+  variant="outline" class="text-primary border-primary bg-white hover:bg-gray-50 focus:bg-gray-150
+         focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2"
+         >
+    <Icon :name="props.icon" class="size-4 me-2" />
+    {{ props.text }}
+  </Button>
+</template>
diff --git a/app/components/app/satusehat/card-summary.vue b/app/components/app/satusehat/card-summary.vue
new file mode 100644
index 00000000..d0c142df
--- /dev/null
+++ b/app/components/app/satusehat/card-summary.vue
@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import type { Summary } from '~/components/pub/base/summary-card/type';
+
+const props = defineProps<{
+  isLoading: boolean
+  summaryData: Summary[]
+}>()
+</script>
+
+<template>
+  <div class="grid gap-4 md:grid-cols-2 md:gap-8 lg:grid-cols-4">
+    <template v-if="props.isLoading">
+      <PubBaseSummaryCard v-for="n in 4" :key="n" is-skeleton :stat="summaryData[n]" />
+    </template>
+    <template v-else>
+      <PubBaseSummaryCard v-for="card in summaryData" :key="card.title" :stat="card" />
+    </template>
+  </div>
+</template>
diff --git a/app/components/app/satusehat/entry-form.vue b/app/components/app/satusehat/entry-form.vue
new file mode 100644
index 00000000..5768c6a0
--- /dev/null
+++ b/app/components/app/satusehat/entry-form.vue
@@ -0,0 +1,47 @@
+<script setup lang="ts">
+import Block from '~/components/pub/form/block.vue'
+import FieldGroup from '~/components/pub/form/field-group.vue'
+import Field from '~/components/pub/form/field.vue'
+import Label from '~/components/pub/form/label.vue'
+</script>
+
+<template>
+  <form id="entry-form">
+    <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
+      <Icon name="i-lucide-user" class="me-2" />
+      <span class="font-semibold">Tambah</span> Pasien
+    </div>
+
+    <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
+      <Block>
+        <FieldGroup :column="3">
+          <Label>Nama</Label>
+          <Field>
+            <Input type="text" name="name" />
+          </Field>
+        </FieldGroup>
+        <FieldGroup :column="3">
+          <Label>Nama</Label>
+          <Field>
+            <Input type="text" name="name" />
+          </Field>
+        </FieldGroup>
+        <FieldGroup :column="3">
+          <Label>Nomor RM</Label>
+          <Field>
+            <Input type="text" name="name" />
+          </Field>
+        </FieldGroup>
+        <FieldGroup>
+          <Label dynamic>Alamat</Label>
+          <Field>
+            <Input type="text" name="name" />
+          </Field>
+        </FieldGroup>
+      </Block>
+    </div>
+    <div class="my-2 flex justify-end py-2">
+      <PubNavFooterCsd />
+    </div>
+  </form>
+</template>
diff --git a/app/components/app/satusehat/list-cfg.ts b/app/components/app/satusehat/list-cfg.ts
new file mode 100644
index 00000000..d287a38b
--- /dev/null
+++ b/app/components/app/satusehat/list-cfg.ts
@@ -0,0 +1,78 @@
+import type { Col, KeyLabel, RecComponent, RecStrFuncComponent, RecStrFuncUnknown, Th } from '../../pub/nav/types'
+import { defineAsyncComponent } from 'vue'
+
+type SmallDetailDto = any
+
+export const rowType = {
+  1: 'Patient',
+  2: 'Encounter',
+  3: 'Observation',
+}
+
+export const rowStatus = {
+  0: 'Gagal',
+  1: 'Pending',
+  2: 'Terkirim',
+}
+
+const patientBadge = defineAsyncComponent(() => import('./badge-patient.vue'))
+const statusBadge = defineAsyncComponent(() => import('./badge-status.vue'))
+
+export const cols: Col[] = [
+  { width: 100 },
+  { width: 100 },
+  { width: 100 },
+  { width: 100 },
+  { width: 100 },
+  { width: 100 },
+]
+
+export const header: Th[][] = [
+  [
+    { label: 'ID' },
+    { label: 'Jenis' },
+    { label: 'Pasien' },
+    { label: 'Status' },
+    { label: 'Terakhir Update' },
+    { label: 'FHIR ID' },
+  ],
+]
+
+export const keys = ['id', 'resource_type', 'patient', 'status', 'updated_at', 'fhir_id']
+
+export const delKeyNames: KeyLabel[] = [
+  { key: 'code', label: 'Kode' },
+  { key: 'name', label: 'Nama' },
+]
+
+export const funcParsed: RecStrFuncUnknown = {
+  name: (rec: unknown): unknown => {
+    const recX = rec as SmallDetailDto
+    return `${recX.firstName} ${recX.middleName || ''} ${recX.lastName || ''}`
+  },
+}
+
+export const funcComponent: RecStrFuncComponent = {
+  patient(rec, idx) {
+    const res: RecComponent = {
+      idx,
+      rec: rec as object,
+      component: patientBadge,
+    }
+    return res
+  },
+  status(rec, idx) {
+    const res: RecComponent = {
+      idx,
+      rec: rec as object,
+      component: statusBadge,
+    }
+    return res
+  },
+}
+
+export const funcHtml: RecStrFuncUnknown = {
+  patient_address(_rec) {
+    return '-'
+  },
+}
diff --git a/app/components/app/satusehat/list.vue b/app/components/app/satusehat/list.vue
new file mode 100644
index 00000000..e2921fef
--- /dev/null
+++ b/app/components/app/satusehat/list.vue
@@ -0,0 +1,12 @@
+<script setup lang="ts">
+import { cols, funcComponent, funcHtml, funcParsed, header, keys } from './list-cfg'
+
+defineProps<{
+  data: any[]
+}>()
+</script>
+
+<template>
+  <PubBaseDataTable :rows="data" :cols="cols" :header="header" :keys="keys" :func-parsed="funcParsed"
+    :func-html="funcHtml" :func-component="funcComponent" />
+</template>
diff --git a/app/components/app/satusehat/picker.vue b/app/components/app/satusehat/picker.vue
new file mode 100644
index 00000000..29f282d7
--- /dev/null
+++ b/app/components/app/satusehat/picker.vue
@@ -0,0 +1,51 @@
+<script setup lang="ts">
+import type { DateRange } from 'radix-vue'
+import type { Ref } from 'vue'
+import {
+  CalendarDate,
+  DateFormatter,
+  getLocalTimeZone,
+} from '@internationalized/date'
+import { Calendar as CalendarIcon } from 'lucide-vue-next'
+import { cn } from '~/lib/utils'
+
+const df = new DateFormatter('en-US', {
+  dateStyle: 'medium',
+})
+
+const value = ref({
+  start: new CalendarDate(2022, 1, 20),
+  end: new CalendarDate(2022, 1, 20).add({ days: 20 }),
+}) as Ref<DateRange>
+</script>
+
+<template>
+  <Popover>
+    <PopoverTrigger as-child>
+      <Button
+        variant="outline"
+        :class="cn(
+          'w-[280px] justify-start text-left font-normal',
+          !value && 'text-muted-foreground',
+        )"
+      >
+        <CalendarIcon class="mr-2 h-4 w-4" />
+        <template v-if="value.start">
+          <template v-if="value.end">
+            {{ df.format(value.start.toDate(getLocalTimeZone())) }} - {{ df.format(value.end.toDate(getLocalTimeZone())) }}
+          </template>
+
+          <template v-else>
+            {{ df.format(value.start.toDate(getLocalTimeZone())) }}
+          </template>
+        </template>
+        <template v-else>
+          Pick a date
+        </template>
+      </Button>
+    </PopoverTrigger>
+    <PopoverContent class="w-auto p-0">
+      <RangeCalendar v-model="value" initial-focus :number-of-months="2" @update:start-value="(startDate) => value.start = startDate" />
+    </PopoverContent>
+  </Popover>
+</template>
diff --git a/app/components/app/satusehat/search.vue b/app/components/app/satusehat/search.vue
new file mode 100644
index 00000000..9e2d2405
--- /dev/null
+++ b/app/components/app/satusehat/search.vue
@@ -0,0 +1,12 @@
+<script setup lang="ts">
+import { Search } from 'lucide-vue-next'
+</script>
+
+<template>
+  <div class="relative w-full max-w-sm items-center">
+    <Input id="search" type="text" placeholder="Search..." class="pl-10" />
+    <span class="absolute start-0 inset-y-0 flex items-center justify-center px-2">
+      <Search class="size-6 text-muted-foreground" />
+    </span>
+  </div>
+</template>
diff --git a/app/components/flow/dashboard/index.vue b/app/components/flow/dashboard/index.vue
index bcb3b251..2195b428 100644
--- a/app/components/flow/dashboard/index.vue
+++ b/app/components/flow/dashboard/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Activity, CreditCard, DollarSign, Users, UserCheck, UsersRound, Calendar, Hospital } from 'lucide-vue-next'
+import { Calendar, Hospital, UserCheck, UsersRound } from 'lucide-vue-next'
 
 const dataCard = ref({
   totalRevenue: 0,
@@ -161,8 +161,11 @@ onMounted(() => {
             </div>
           </CardHeader>
           <CardContent class="grid cursor-pointer gap-8 md:grid-cols-4 md:gap-8">
-            <Card v-for="item in linkItems" :key="item"
-              class="border-primary hover:bg-primary my-2 h-32 border transition-colors duration-200 hover:bg-gray-200">
+            <Card
+            v-for="item in linkItems"
+            :key="item.title"
+              class="border-primary hover:bg-primary my-2 h-32 border transition-colors duration-200 hover:bg-gray-200"
+              >
               <NuxtLink :to="item.link">
                 <CardContent class="my-2 grid h-full grid-rows-2 place-items-center">
                   <Icon :name="item.icon" class="text-primary h-9 w-[60px]" />
diff --git a/app/components/flow/doctor/list.vue b/app/components/flow/doctor/list.vue
index 933eac5d..e71096de 100644
--- a/app/components/flow/doctor/list.vue
+++ b/app/components/flow/doctor/list.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import type { HeaderPrep, RefSearchNav } from '~/components/pub/nav/types'
+import type { HeaderPrep, RefSearchNav } from '~/components/pub/custom-ui/data/types'
+import type { DataTableLoader } from '~/components/pub/base/data-table/type';
 import Header from '~/components/pub/custom-ui/nav-header/prep.vue'
 
 const data = ref([])
@@ -16,6 +17,10 @@ const refSearchNav: RefSearchNav = {
   },
 }
 
+const isLoading = reactive<DataTableLoader>({
+  isTableLoading: false,
+})
+
 const recId = ref<number>(0)
 const recAction = ref<string>('')
 const recItem = ref<any>(null)
@@ -29,13 +34,16 @@ const headerPrep: HeaderPrep = {
   },
 }
 
-useAsyncData('getDoctor', () => xfetch('/api/v1/doctor'), { server: false, immediate: true })
 
 async function getDoctorList() {
+  isLoading.dataListLoading = true
+
   const resp = await xfetch('/api/v1/doctor')
   if (resp.success) {
     data.value = (resp.body as Record<string, any>).data
   }
+
+  isLoading.dataListLoading = false
 }
 
 onMounted(() => {
@@ -45,9 +53,14 @@ onMounted(() => {
 provide('rec_id', recId)
 provide('rec_action', recAction)
 provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
 </script>
 
 <template>
-  <Header :prep="{ ...headerPrep }" :ref-search-nav="refSearchNav" />
-  <AppDoctorList :data="data" />
+  <div class="rounded-md border p-4">
+    <Header :prep="{ ...headerPrep }" :ref-search-nav="refSearchNav" />
+    <div class="rounded-md border p-4">
+      <AppDoctorList v-if="!isLoading.dataListLoading" :data="data" />
+    </div>
+  </div>
 </template>
diff --git a/app/components/flow/patient/list.vue b/app/components/flow/patient/list.vue
index 82081596..6f6c0822 100644
--- a/app/components/flow/patient/list.vue
+++ b/app/components/flow/patient/list.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
-import type { Summary } from '~/components/pub/base/summary-card.type'
-import type { HeaderPrep, RefSearchNav } from '~/components/pub/nav/types'
+import type { DataTableLoader } from '~/components/pub/base/data-table/type';
+import type { Summary } from '~/components/pub/base/summary-card/type'
+import type { HeaderPrep, RefSearchNav } from '~/components/pub/custom-ui/data/types'
 import { Calendar, Hospital, UserCheck, UsersRound } from 'lucide-vue-next'
 import SummaryCard from '~/components/pub/base/summary-card/summary-card.vue'
 import Header from '~/components/pub/custom-ui/nav-header/prep.vue'
@@ -20,10 +21,11 @@ const refSearchNav: RefSearchNav = {
 }
 
 // Loading state management
-const isLoading = reactive({
+const isLoading = reactive<DataTableLoader>({
   summary: false,
-  table: false,
+  isTableLoading: false,
 })
+
 const recId = ref<number>(0)
 const recAction = ref<string>('')
 const recItem = ref<any>(null)
@@ -84,11 +86,12 @@ async function getPatientSummary() {
 }
 
 async function getPatientList() {
+  isLoading.isTableLoading = true
   const resp = await xfetch('/api/v1/patient')
-  console.log('data patient', resp)
   if (resp.success) {
     data.value = (resp.body as Record<string, any>).data
   }
+  isLoading.isTableLoading = false
 }
 
 onMounted(() => {
@@ -99,6 +102,7 @@ onMounted(() => {
 provide('rec_id', recId)
 provide('rec_action', recAction)
 provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
 </script>
 
 <template>
diff --git a/app/components/flow/rehab/registration/sep-prosedur/list.vue b/app/components/flow/rehab/registration/sep-prosedur/list.vue
index fa4c029e..371395b4 100644
--- a/app/components/flow/rehab/registration/sep-prosedur/list.vue
+++ b/app/components/flow/rehab/registration/sep-prosedur/list.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import type { HeaderPrep, RefSearchNav } from '~/components/pub/nav/types'
+import type { HeaderPrep, RefSearchNav } from '~/components/pub/custom-ui/data/types'
+import type { DataTableLoader } from '~/components/pub/base/data-table/type';
 import RehabSepProsedurList from '~/components/app/rehab/registration/sep-prosedur/list.vue'
 
 const props = defineProps<{
@@ -21,9 +22,9 @@ const refSearchNav: RefSearchNav = {
 }
 
 // Loading state management
-const isLoading = reactive({
-  summary: false,
-  table: false,
+const isLoading = reactive<DataTableLoader>({
+  isTableLoading: false,
+
 })
 const recId = ref<number>(0)
 const recAction = ref<string>('')
@@ -40,7 +41,6 @@ const hreaderPrep: HeaderPrep = {
 
 async function getPatientList() {
   const resp = await xfetch('/api/v1/patient')
-  console.log('data patient', resp)
   if (resp.success) {
     data.value = (resp.body as Record<string, any>).data
   }
@@ -53,12 +53,12 @@ onMounted(() => {
 provide('rec_id', recId)
 provide('rec_action', recAction)
 provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
 </script>
 
 <template>
-  <PubNavHeaderPrep :prep="{ ...hreaderPrep }" :ref-search-nav="refSearchNav" />
+  <Header :prep="{ ...hreaderPrep }" :ref-search-nav="refSearchNav" />
   <div class="my-4 flex flex-1 flex-col gap-4 md:gap-8">
     <RehabSepProsedurList :data="data" />
   </div>
 </template>
-/template>
diff --git a/app/components/flow/satusehat/const.ts b/app/components/flow/satusehat/const.ts
new file mode 100644
index 00000000..8dee79cc
--- /dev/null
+++ b/app/components/flow/satusehat/const.ts
@@ -0,0 +1,97 @@
+import type { ServiceStatus } from '~/components/pub/base/service-status/type'
+import type { Summary } from '~/components/pub/base/summary-card/type'
+import type { HeaderPrep, RefSearchNav } from '~/components/pub/custom-ui/data/types'
+import { CircleCheckBig, CircleDashed, CircleX, Send } from 'lucide-vue-next'
+
+export const tabs = [
+  {
+    value: 'all',
+    label: 'Semua Resource',
+  },
+  {
+    value: 'patient',
+    label: 'Patient',
+  },
+  {
+    value: 'encounter',
+    label: 'Encounter',
+  },
+  {
+    value: 'observation',
+    label: 'Observation',
+  },
+]
+
+export const actions = [
+  {
+    value: 'export',
+    label: 'Ekspor',
+    icon: 'i-lucide-download',
+  },
+]
+
+// Status filter options
+export const statusOptions = [
+  { value: '0', label: 'Failed' },
+  { value: '1', label: 'Pending' },
+  { value: '2', label: 'Success' },
+]
+export const summaryData: Summary[] = [
+  {
+    title: 'Resource Terkirim',
+    icon: Send,
+    metric: 1245,
+    trend: 0,
+    timeframe: 'daily',
+  },
+  {
+    title: 'Sync Success',
+    icon: CircleCheckBig,
+    metric: '97%',
+    trend: 0,
+    timeframe: 'daily',
+  },
+  {
+    title: 'Pending Queue',
+    icon: CircleDashed,
+    metric: 32,
+    trend: 0,
+    timeframe: 'daily',
+  },
+  {
+    title: 'Failed Items',
+    icon: CircleX,
+    metric: 10,
+    trend: 0,
+    timeframe: 'daily',
+  },
+]
+
+// SATUSEHAT Service integration
+export const service = reactive<ServiceStatus>({
+  serviceName: 'SATUSEHAT',
+  serviceDesc: 'SATUSEHAT - FHIR R4 Compliant',
+  sessionActive: false,
+  status: 'connecting',
+  isSkeleton: false,
+})
+
+export const headerPrep: HeaderPrep = {
+  title: 'SATUSEHAT Integration',
+  icon: 'i-lucide-box',
+  addNav: {
+    label: 'Kirim Resource',
+    icon: 'i-lucide-send',
+    // onClick: () => navigateTo('/patient/add'),
+  },
+}
+
+export const refSearchNav: RefSearchNav = {
+  onClick: () => {
+    // open filter modal
+  },
+  onInput: (_val: string) => {
+  },
+  onClear: () => {
+  },
+}
diff --git a/app/components/flow/satusehat/list.vue b/app/components/flow/satusehat/list.vue
new file mode 100644
index 00000000..249faa2d
--- /dev/null
+++ b/app/components/flow/satusehat/list.vue
@@ -0,0 +1,226 @@
+<script setup lang="ts">
+import type { DataTableLoader } from '~/components/pub/base/data-table/type'
+import { useUrlSearchParams } from '@vueuse/core'
+import Header from '~/components/pub/custom-ui/nav-header/header.vue'
+import { actions, headerPrep, refSearchNav, service, summaryData, tabs } from './const'
+import { defaultQuery, querySchema, tabSwitcher } from './schema.query'
+
+// State management
+const data = ref([])
+const recId = ref<number>(0)
+const recAction = ref<string>('')
+const recItem = ref<any>(null)
+const isLoading = reactive<DataTableLoader>({
+  satusehatConn: true,
+  isTableLoading: false,
+})
+const queryParams = useUrlSearchParams('history', {
+  initialValue: defaultQuery,
+  removeFalsyValues: true,
+})
+const params = computed(() => {
+  const result = querySchema.safeParse(queryParams)
+  return result.data
+})
+// Pagination state
+const pagination = ref({
+  total: 0,
+  page: 1,
+  limit: 10,
+  total_pages: 0,
+  has_next: false,
+  has_prev: false,
+})
+
+// API function to fetch data
+async function fetchData() {
+  try {
+    isLoading.isTableLoading = true
+    data.value = []
+    const response = await xfetch('/api/v1/satusehat/list', 'POST', {
+      resource_type: params.value?.resource_type,
+      date_from: params.value?.date_from,
+      date_to: params.value?.date_to,
+      search: params.value?.q,
+      page: params.value?.page,
+      limit: params.value?.limit,
+    })
+
+    if (response.success) {
+      data.value = response.body.data
+      pagination.value = response.body.meta
+    }
+  } catch (error) {
+    console.error('Error fetching data:', error)
+    data.value = []
+  } finally {
+    isLoading.isTableLoading = false
+  }
+}
+
+async function callSatuSehat() {
+  try {
+    await new Promise((resolve) => setTimeout(resolve, 500))
+    service.status = 'connected'
+    // service.status = 'error'
+    service.sessionActive = true
+    // service.sessionActive = false
+  } finally {
+    isLoading.satusehatConn = false
+  }
+}
+
+// Initialize params from URL on mount
+onMounted(async () => {
+  await callSatuSehat()
+  await fetchData()
+})
+
+// Watch for url param changed state and trigger refetch
+watch(params, () => {
+  fetchData()
+})
+
+provide('rec_id', recId)
+provide('rec_action', recAction)
+provide('rec_item', recItem)
+provide('table_data_loader', isLoading)
+
+// Sync active tab filter with queryparams
+// fallback and default to `all` filter
+const activeTabFilter = computed({
+  get: () => {
+    const result = tabSwitcher.parse(queryParams.resource_type)
+    return result
+  },
+  set: (value) => {
+    queryParams.resource_type = value
+    queryParams.q = defaultQuery.q
+    queryParams.page = defaultQuery.page
+    queryParams.limit = defaultQuery.limit
+    queryParams.date_from = defaultQuery.date_from
+    queryParams.date_to = defaultQuery.date_to
+  },
+})
+</script>
+
+<template>
+  <div class="rounded-md border p-4">
+    <Header :prep="headerPrep" :ref-search-nav="refSearchNav" />
+    <div class="my-4 flex flex-1 flex-col gap-3 md:gap-4">
+      <PubBaseServiceStatus v-bind="service" />
+      <AppSatusehatCardSummary :is-loading="isLoading.satusehatConn!" :summary-data="summaryData" />
+    </div>
+    <div class="rounded-md border p-4">
+      <h2 class="text-md font-semibold py-2">FHIR Resource</h2>
+      <Tabs v-model="activeTabFilter">
+        <div class="scrollbar-hide overflow-x-auto flex gap-2 justify-between">
+          <TabsList>
+            <TabsTrigger v-for="tab in tabs" :key="tab.value" :value="tab.value"
+              class="flex-shrink-0 px-4 py-2 text-sm font-medium data-[state=active]:bg-green-600 data-[state=inactive]:bg-gray-100 data-[state=active]:text-white data-[state=inactive]:text-gray-700">
+              {{ tab.label }}
+            </TabsTrigger>
+          </TabsList>
+          <div class="flex gap-2 items-center">
+
+            <!-- Search Input -->
+
+            <AppSatusehatPicker/>
+            <div class="relative w-full max-w-sm">
+
+              <Dialog>
+                <DialogTrigger>
+                  <Input type="text" placeholder="Cari pasien..." class="pl-3 h-9" />
+                </DialogTrigger>
+                <DialogContent>
+                  <DialogHeader class="border-b-1">
+                    <DialogTitle class="pb-2">Pencarian</DialogTitle>
+                  </DialogHeader>
+                  <Form>
+                    <FormField v-slot="{ componentField }" name="username">
+                      <FormItem>
+                        <FormLabel>Pasien</FormLabel>
+                        <FormControl>
+                          <Input type="text" placeholder="nama pasien, id pasien" v-bind="componentField" />
+                        </FormControl>
+                      </FormItem>
+                    </FormField>
+                    <FormField v-slot="{ componentField }" name="status">
+                      <FormItem>
+                        <FormLabel>Status</FormLabel>
+                        <FormControl>
+                          <Select v-bind="componentField">
+                            <SelectTrigger class="bg-white border border-gray-300">
+                              <SelectValue class="text-gray-400" placeholder="-- select item" />
+                            </SelectTrigger>
+                            <SelectContent class="bg-white ">
+                              <SelectItem value="0">
+                                Gagal
+                              </SelectItem>
+                              <SelectItem value="1">
+                                Pending
+                              </SelectItem>
+                              <SelectItem value="2">
+                                Terkirim
+                              </SelectItem>
+                            </SelectContent>
+                          </Select>
+                        </FormControl>
+                      </FormItem>
+                    </FormField>
+                    <FormField v-slot="{ componentField }" name="fhirId">
+                      <FormItem>
+                        <FormLabel>FHIR ID</FormLabel>
+                        <FormControl>
+                          <Input type="text" placeholder="fhir id" v-bind="componentField" />
+                        </FormControl>
+                      </FormItem>
+                    </FormField>
+                  </Form>
+
+                  <DialogFooter>
+                    <Button variant="outline">
+                      Reset
+                    </Button>
+                    <Button>
+                      Apply
+                    </Button>
+                  </DialogFooter>
+                </DialogContent>
+              </Dialog>
+            </div>
+
+            <!-- Action Buttons -->
+            <AppSatusehatButtonAction v-for="action in actions" :key="action.value" :icon="action.icon"
+              :text="action.label" />
+          </div>
+        </div>
+        <div class="mt-4">
+          <TabsContent v-for="tab in tabs" :key="`content-${tab.value}`" :value="tab.value">
+            <div class="rounded-md border p-4">
+              <AppSatusehatList v-if="!isLoading.satusehatConn" :data="data" />
+
+              <!-- Pagination -->
+              <div v-if="!isLoading.satusehatConn && !isLoading.isTableLoading && pagination.total > 0"
+                class="mt-4 flex justify-between items-center">
+                <div class="text-sm text-muted-foreground">
+                  Menampilkan {{ ((pagination.page - 1) * pagination.limit) + 1 }} -
+                  {{ Math.min(pagination.page * pagination.limit, pagination.total) }}
+                  dari {{ pagination.total }} data
+                </div>
+                <div class="flex gap-2">
+                  <Button v-if="pagination.has_prev" variant="outline" size="sm" @click="queryParams.page--">
+                    Sebelumnya
+                  </Button>
+                  <Button v-if="pagination.has_next" variant="outline" size="sm" @click="queryParams.page++">
+                    Selanjutnya
+                  </Button>
+                </div>
+              </div>
+            </div>
+          </TabsContent>
+        </div>
+      </Tabs>
+    </div>
+  </div>
+</template>
diff --git a/app/components/flow/satusehat/schema.query.ts b/app/components/flow/satusehat/schema.query.ts
new file mode 100644
index 00000000..aab8340f
--- /dev/null
+++ b/app/components/flow/satusehat/schema.query.ts
@@ -0,0 +1,23 @@
+import * as z from 'zod'
+
+const resourceTabEnum = z.enum(['all', 'patient', 'encounter', 'observation'])
+
+export const tabSwitcher = resourceTabEnum.default('all').catch('all')
+export const querySchema = z.object({
+  q: z.string().min(3).optional().catch(''),
+  resource_type: tabSwitcher,
+  date_from: z.string().optional().catch(''),
+  date_to: z.string().optional().catch(''),
+  page: z.coerce.number().int().min(1).default(1).catch(1),
+  limit: z.coerce.number().int().min(1).max(20).default(10).catch(10),
+})
+
+export const defaultQuery = {
+  q: '',
+  status: '',
+  resource_type: 'all',
+  date_from: '',
+  date_to: '',
+  page: 1,
+  limit: 10,
+}
diff --git a/app/components/layout/AppSidebar.vue b/app/components/layout/AppSidebar.vue
index 813d9bd8..1e18534a 100644
--- a/app/components/layout/AppSidebar.vue
+++ b/app/components/layout/AppSidebar.vue
@@ -12,12 +12,12 @@ const teams: {
   logo: string
   plan: string
 }[] = [
-    {
-      name: 'SIMRS - RSSA',
-      logo: '/rssa-logo.png',
-      plan: 'Saiful Anwar Hospital',
-    },
-  ]
+  {
+    name: 'SIMRS - RSSA',
+    logo: '/rssa-logo.png',
+    plan: 'Saiful Anwar Hospital',
+  },
+]
 const sidebar = {
   collapsible: 'offcanvas', // 'offcanvas' | 'icon' | 'none'
   side: 'left', // 'left' | 'right'
@@ -59,8 +59,10 @@ async function setMenu() {
         <SidebarGroupLabel>
           {{ navMenu.heading }}
         </SidebarGroupLabel>
-        <component :is="resolveNavItemComponent(item)" v-for="(item, index) in navMenu.items" :key="index" :item="item"
-          class="my-2 mb-2" />
+        <component
+:is="resolveNavItemComponent(item)" v-for="(item, index) in navMenu.items" :key="index" :item="item"
+          class="my-2 mb-2"
+/>
       </SidebarGroup>
       <template v-else>
         <div class="p-5">
@@ -68,8 +70,10 @@ async function setMenu() {
         </div>
       </template>
       <SidebarGroup class="mt-auto">
-        <component :is="resolveNavItemComponent(item)" v-for="(item, index) in navMenuBottom" :key="index" :item="item"
-          size="sm" />
+        <component
+:is="resolveNavItemComponent(item)" v-for="(item, index) in navMenuBottom" :key="index" :item="item"
+          size="sm"
+/>
       </SidebarGroup>
     </SidebarContent>
     <SidebarFooter>
diff --git a/app/components/pub/base/data-table/data-table.vue b/app/components/pub/base/data-table/data-table.vue
index 983559b8..257996f0 100644
--- a/app/components/pub/base/data-table/data-table.vue
+++ b/app/components/pub/base/data-table/data-table.vue
@@ -1,43 +1,64 @@
 <script setup lang="ts">
+import type { DataTableLoader } from './type'
+import { Info } from 'lucide-vue-next'
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '~/components/pub/ui/table'
 
 defineProps<{
   rows: unknown[]
-  cols: object
-  header: object[]
+  cols: any[]
+  header: any[]
   keys: string[]
-  funcParsed: object
-  funcHtml: object
-  funcComponent: object
+  funcParsed: Record<string, (row: any) => any>
+  funcHtml: Record<string, (row: any) => string>
+  funcComponent: Record<string, (row: any, idx: number) => any>
 }>()
+
+const loader = inject('table_data_loader') as DataTableLoader
 </script>
 
 <template>
   <Table>
-    <TableHeader>
+    <TableHeader class="bg-gray-50">
       <TableRow>
-        <TableHead
-          v-for="(h, idx) in header[0]"
-          :key="`head-${idx}`"
-          :style="{ width: cols[idx]?.width ? `${cols[idx].width}px` : undefined }"
-        >
+        <TableHead v-for="(h, idx) in header[0]" :key="`head-${idx}`" class="border"
+          :style="{ width: cols[idx]?.width ? `${cols[idx].width}px` : undefined }">
           {{ h.label }}
         </TableHead>
       </TableRow>
     </TableHeader>
 
-    <TableBody>
+    <TableBody v-if="loader.isTableLoading">
+      <!-- Loading state with 5 skeleton rows -->
+      <TableRow v-for="n in 5" :key="`skeleton-${n}`">
+        <TableCell v-for="(key, cellIndex) in keys" :key="`cell-skel-${n}-${cellIndex}`" class="border">
+          <Skeleton class="bg-gray-100 animate-pulse text-muted-foreground w-full h-6" />
+        </TableCell>
+      </TableRow>
+    </TableBody>
+    <TableBody v-else-if="rows.length === 0">
+      <TableRow>
+        <TableCell :colspan="keys.length" class="text-center py-8">
+          <div class="flex items-center justify-center">
+            <Info class="size-5 text-muted-foreground" />
+            <span class="ml-2">Tidak ada data tersedia</span>
+          </div>
+        </TableCell>
+      </TableRow>
+    </TableBody>
+    <TableBody v-else>
       <TableRow v-for="(row, rowIndex) in rows" :key="`row-${rowIndex}`">
-        <TableCell v-for="(key, cellIndex) in keys" :key="`cell-${rowIndex}-${cellIndex}`">
+        <TableCell v-for="(key, cellIndex) in keys" :key="`cell-${rowIndex}-${cellIndex}`" class="border">
           <!-- If funcComponent has a renderer -->
-          <component
-            :is="funcComponent[key](row, rowIndex).component"
-            v-if="funcComponent[key]"
-            v-bind="funcComponent[key](row, rowIndex)"
-          />
+          <component :is="funcComponent[key](row, rowIndex).component" v-if="funcComponent[key]"
+            v-bind="funcComponent[key](row, rowIndex)" />
           <!-- If funcParsed or funcHtml returns a value -->
           <template v-else>
-            {{ funcParsed[key]?.(row) ?? funcHtml[key]?.(row) ?? row[key] }}
+            <!-- Use v-html for funcHtml to render HTML content -->
+            <div v-if="funcHtml[key]" v-html="funcHtml[key]?.(row)"></div>
+            <!-- Use normal interpolation for funcParsed and regular data -->
+            <template v-else>
+              {{ funcParsed[key]?.(row) ?? (row as any)[key] }}
+            </template>
           </template>
         </TableCell>
       </TableRow>
diff --git a/app/components/pub/base/data-table/type.ts b/app/components/pub/base/data-table/type.ts
new file mode 100644
index 00000000..019bb037
--- /dev/null
+++ b/app/components/pub/base/data-table/type.ts
@@ -0,0 +1,4 @@
+export interface DataTableLoader {
+  isTableLoading: boolean
+  [key: string]: boolean
+}
diff --git a/app/components/pub/base/service-status/service-status.vue b/app/components/pub/base/service-status/service-status.vue
new file mode 100644
index 00000000..3ba2736f
--- /dev/null
+++ b/app/components/pub/base/service-status/service-status.vue
@@ -0,0 +1,72 @@
+<script setup lang="ts">
+import type { ServiceStatus } from './type'
+import { Loader, Loader2 } from 'lucide-vue-next'
+import { cn } from '~/lib/utils'
+
+const props = defineProps<ServiceStatus>()
+
+const tokenStatus = computed((): string => {
+  return props.sessionActive ? 'Valid' : 'Invalid'
+})
+</script>
+
+<template>
+  <Card v-if="props.isSkeleton" class="py-6">
+    <div class="flex gap-4 justify-between px-6">
+      <div class="flex gap-2 items-center">
+        <span class="bg-gray-100">
+          <Skeleton class="bg-gray-100 w-6 h-6 sm:w-8 sm:h-8" />
+        </span>
+        <div>
+          <Skeleton class="w-64 h-8 bg-gray-100 text-xs md:text-sm text-muted-foreground" />
+        </div>
+      </div>
+      <div class="text-right flex flex-col items-end">
+        <Skeleton class="w-32 h-2 bg-gray-100 text-xs md:text-md text-muted-foreground" />
+        <Skeleton class="w-32 h-3 bg-gray-100 text-xs md:text-md font-bold" />
+      </div>
+    </div>
+  </Card>
+  <Card v-else class="py-6">
+    <div class="flex gap-4 justify-between px-6">
+      <div class="flex gap-2 items-center">
+        <span
+:class="cn(' rounded-md w-12 h-12 flex items-center justify-center',
+          { 'bg-red-500': props.status === 'error' },
+          { 'bg-blue-500': props.status !== 'error' },
+        )"
+>
+          <Icon v-if="props.status === 'error'" name="i-lucide-cable" class="text-white w-6 h-6 sm:w-8 sm:h-8" />
+          <Icon v-else name="i-lucide-bring-to-front" class="text-white w-6 h-6 sm:w-8 sm:h-8" />
+        </span>
+        <div>
+          <p v-if="props.status === 'connected'" class="text-xs md:text-md font-bold">Koneksi {{ props.serviceName }}
+            Aktif</p>
+          <p v-if="props.status === 'connecting'" class="flex flex-row text-xs md:text-md font-bold">Menghubungkan ke
+            API {{
+              props.serviceName }}
+            <Loader2 class="ml-2 h-4 w-4 animate-spin" />
+          </p>
+          <p v-if="props.status === 'error'" class="text-xs md:text-md font-bold">Koneksi ke API {{ props.serviceName
+          }}
+            Gagal</p>
+          <p v-if="props.status === 'connected'" class="text-xs md:text-sm text-muted-foreground">Koneksi Terhubung ke
+            API {{ props.serviceDesc }}
+          </p>
+        </div>
+      </div>
+      <div class="text-right flex flex-col items-end">
+        <p class="text-xs md:text-md text-muted-foreground">Session Token</p>
+        <p v-if="props.status === 'connecting'">
+          <Loader class="ml-2 h-4 w-4 animate-spin" />
+        </p>
+        <p
+v-else :class="cn('text-xs md:text-md font-bold',
+          { 'text-blue-500': props.sessionActive },
+          { 'text-red-500': !props.sessionActive },
+        )"
+>{{ tokenStatus }}</p>
+      </div>
+    </div>
+  </Card>
+</template>
diff --git a/app/components/pub/base/service-status/type.ts b/app/components/pub/base/service-status/type.ts
new file mode 100644
index 00000000..f3d15cd0
--- /dev/null
+++ b/app/components/pub/base/service-status/type.ts
@@ -0,0 +1,7 @@
+export interface ServiceStatus {
+  serviceName: string
+  serviceDesc: string
+  sessionActive: boolean
+  status: 'connected' | 'connecting' | 'error' | 'disconnected'
+  isSkeleton?: boolean
+}
diff --git a/app/components/pub/base/summary-card/summary-card.vue b/app/components/pub/base/summary-card/summary-card.vue
index 7b45af84..35a5b17f 100644
--- a/app/components/pub/base/summary-card/summary-card.vue
+++ b/app/components/pub/base/summary-card/summary-card.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { Summary } from './summary-card.type'
+import type { Summary } from './type'
 import { ChevronDown, ChevronUp } from 'lucide-vue-next'
 import { cn } from '~/lib/utils'
 
@@ -41,7 +41,7 @@ const isTrending = computed<boolean>(() => (props.stat?.trend ?? 0) > 0)
     </CardHeader>
     <CardContent>
       <Skeleton class="mb-2 h-6 w-48 bg-gray-100 text-2xl" />
-      <Skeleton class="h-4 w-64 bg-gray-100 text-xs font-medium" />
+      <Skeleton v-if="props.stat?.trend" class="h-4 w-64 bg-gray-100 text-xs font-medium" />
     </CardContent>
   </Card>
   <Card v-else-if="props.stat && !props.isSkeleton" class="h-42">
@@ -55,9 +55,9 @@ const isTrending = computed<boolean>(() => (props.stat?.trend ?? 0) > 0)
       </div>
       <p v-if="props.stat.trend !== 0" class="text-muted-foreground flex items-center gap-1 text-xs">
         <component
-          :is="isTrending ? ChevronUp : ChevronDown"
+:is="isTrending ? ChevronUp : ChevronDown"
           :class="cn('h-4 w-4', { 'text-green-500': isTrending }, { 'text-red-500': !isTrending })"
-        />
+/>
         <span :class="cn('font-medium', { 'text-green-500': isTrending }, { 'text-red-500': !isTrending })">
           {{ props.stat.trend.toFixed(1) }}%
           <!-- {{ Math.abs(props.stat.trend).toFixed(1) }}% -->
diff --git a/app/components/pub/base/summary-card/summary-card.type.ts b/app/components/pub/base/summary-card/type.ts
similarity index 83%
rename from app/components/pub/base/summary-card/summary-card.type.ts
rename to app/components/pub/base/summary-card/type.ts
index 64304eaf..be04a9ce 100644
--- a/app/components/pub/base/summary-card/summary-card.type.ts
+++ b/app/components/pub/base/summary-card/type.ts
@@ -1,7 +1,7 @@
 export interface Summary {
   title: string
   icon: Component
-  metric: number
+  metric: number | string
   trend: number
   timeframe: 'yearly' | 'monthly' | 'weekly' | 'daily'
 }
diff --git a/app/components/pub/custom-ui/nav-header/prep.vue b/app/components/pub/custom-ui/nav-header/prep.vue
index 8bd33696..d83aaeb4 100644
--- a/app/components/pub/custom-ui/nav-header/prep.vue
+++ b/app/components/pub/custom-ui/nav-header/prep.vue
@@ -3,19 +3,19 @@ import type { HeaderPrep, RefSearchNav } from '../types.ts'
 
 const props = defineProps<{
   prep: HeaderPrep
-  refSearchNav: RefSearchNav
+  refSearchNav?: RefSearchNav
 }>()
 
 function emitSearchNavClick() {
-  props.refSearchNav.onClick()
+  props.refSearchNav?.onClick()
 }
 
 function onInput(event: Event) {
-  props.refSearchNav.onInput((event.target as HTMLInputElement).value)
+  props.refSearchNav?.onInput((event.target as HTMLInputElement).value)
 }
 
 function btnClick() {
-  props.prep.addNav?.onClick()
+  props.prep?.addNav?.onClick()
 }
 </script>
 
@@ -24,12 +24,13 @@ function btnClick() {
     <div class="flex items-center justify-between">
       <div class="flex items-center">
         <div class="ml-3 text-lg font-bold text-gray-900">
-          <Icon :name="prep.icon" class="mr-2 h-4 w-4 align-middle" />
+          <Icon :name="prep.icon" class="mr-2 size-4 md:size-6 align-middle" />
           {{ prep.title }}
         </div>
       </div>
       <div class="flex items-center">
-        <div class="ml-3 text-lg text-gray-900">
+        <div v-if="props.refSearchNav"
+        class="ml-3 text-lg text-gray-900">
           <Input
             type="text"
             placeholder="Search"
diff --git a/app/components/pub/ui/button/Button.vue b/app/components/pub/ui/button/Button.vue
index 7b3478e7..cfb2c15a 100644
--- a/app/components/pub/ui/button/Button.vue
+++ b/app/components/pub/ui/button/Button.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import type { PrimitiveProps } from 'reka-ui'
+import type { PrimitiveProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
 import type { ButtonVariants } from '.'
-import { Primitive } from 'reka-ui'
 import { cn } from '~/lib/utils'
+import { Primitive } from 'radix-vue'
 import { buttonVariants } from '.'
 
 interface Props extends PrimitiveProps {
@@ -19,7 +19,6 @@ const props = withDefaults(defineProps<Props>(), {
 
 <template>
   <Primitive
-    data-slot="button"
     :as="as"
     :as-child="asChild"
     :class="cn(buttonVariants({ variant, size }), props.class)"
diff --git a/app/components/pub/ui/button/index.ts b/app/components/pub/ui/button/index.ts
index 66fa9888..9720740f 100644
--- a/app/components/pub/ui/button/index.ts
+++ b/app/components/pub/ui/button/index.ts
@@ -4,27 +4,26 @@ import { cva } from 'class-variance-authority'
 export { default as Button } from './Button.vue'
 
 export const buttonVariants = cva(
-  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*=\'size-\'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
   {
     variants: {
       variant: {
-        default:
-          'bg-primary text-primary-foreground shadow-xs hover:bg-primary/90',
+        default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',
         destructive:
-          'bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
+          'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
         outline:
-          'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',
+          'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
         secondary:
-          'bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80',
-        ghost:
-          'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
+          'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
+        ghost: 'hover:bg-accent hover:text-accent-foreground',
         link: 'text-primary underline-offset-4 hover:underline',
       },
       size: {
-        default: 'h-9 px-4 py-2 has-[>svg]:px-3',
-        sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',
-        lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
-        icon: 'size-9',
+        default: 'h-9 px-4 py-2',
+        xs: 'h-7 rounded px-2',
+        sm: 'h-8 rounded-md px-3 text-xs',
+        lg: 'h-10 rounded-md px-8',
+        icon: 'h-9 w-9',
       },
     },
     defaultVariants: {
diff --git a/app/components/pub/ui/pagination/PaginationEllipsis.vue b/app/components/pub/ui/pagination/PaginationEllipsis.vue
index a85d4075..6499de41 100644
--- a/app/components/pub/ui/pagination/PaginationEllipsis.vue
+++ b/app/components/pub/ui/pagination/PaginationEllipsis.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
 import type { PaginationEllipsisProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
+import { cn } from '~/lib/utils'
+import { DotsHorizontalIcon } from '@radix-icons/vue'
 import { PaginationEllipsis } from 'radix-vue'
 import { computed } from 'vue'
-import { cn } from '~/lib/utils'
-
 
 const props = defineProps<PaginationEllipsisProps & { class?: HTMLAttributes['class'] }>()
 
@@ -18,7 +18,7 @@ const delegatedProps = computed(() => {
 <template>
   <PaginationEllipsis v-bind="delegatedProps" :class="cn('w-9 h-9 flex items-center justify-center', props.class)">
     <slot>
-      <Icon name="i-radix-icons-dots-horizontal" />
+      <DotsHorizontalIcon />
     </slot>
   </PaginationEllipsis>
 </template>
diff --git a/app/components/pub/ui/pagination/PaginationFirst.vue b/app/components/pub/ui/pagination/PaginationFirst.vue
index eb9e9264..677a859c 100644
--- a/app/components/pub/ui/pagination/PaginationFirst.vue
+++ b/app/components/pub/ui/pagination/PaginationFirst.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import type { PaginationFirstProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
+import {
+  Button,
+} from '~/components/pub/ui/button'
+import { cn } from '~/lib/utils'
+import { DoubleArrowLeftIcon } from '@radix-icons/vue'
 import { PaginationFirst } from 'radix-vue'
 import { computed } from 'vue'
-import { Button } from '~/components/pub/ui/button'
-import { cn } from '~/lib/utils'
-
 
 const props = withDefaults(defineProps<PaginationFirstProps & { class?: HTMLAttributes['class'] }>(), {
   asChild: true,
@@ -20,9 +22,9 @@ const delegatedProps = computed(() => {
 
 <template>
   <PaginationFirst v-bind="delegatedProps">
-    <Button :class="cn('h-9 w-9 p-0', props.class)" variant="outline">
+    <Button :class="cn('w-9 h-9 p-0', props.class)" variant="outline">
       <slot>
-        <Icon name="i-radix-icons-double-arrow-left" />
+        <DoubleArrowLeftIcon />
       </slot>
     </Button>
   </PaginationFirst>
diff --git a/app/components/pub/ui/pagination/PaginationLast.vue b/app/components/pub/ui/pagination/PaginationLast.vue
index 8474a865..2421ce78 100644
--- a/app/components/pub/ui/pagination/PaginationLast.vue
+++ b/app/components/pub/ui/pagination/PaginationLast.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import type { PaginationLastProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
+import {
+  Button,
+} from '~/components/pub/ui/button'
+import { cn } from '~/lib/utils'
+import { DoubleArrowRightIcon } from '@radix-icons/vue'
 import { PaginationLast } from 'radix-vue'
 import { computed } from 'vue'
-import { Button } from '~/components/pub/ui/button'
-import { cn } from '~/lib/utils'
-
 
 const props = withDefaults(defineProps<PaginationLastProps & { class?: HTMLAttributes['class'] }>(), {
   asChild: true,
@@ -20,9 +22,9 @@ const delegatedProps = computed(() => {
 
 <template>
   <PaginationLast v-bind="delegatedProps">
-    <Button :class="cn('h-9 w-9 p-0', props.class)" variant="outline">
+    <Button :class="cn('w-9 h-9 p-0', props.class)" variant="outline">
       <slot>
-        <Icon name="i-radix-icons-double-arrow-right" />
+        <DoubleArrowRightIcon />
       </slot>
     </Button>
   </PaginationLast>
diff --git a/app/components/pub/ui/pagination/PaginationNext.vue b/app/components/pub/ui/pagination/PaginationNext.vue
index 0fa5ce3e..9262575b 100644
--- a/app/components/pub/ui/pagination/PaginationNext.vue
+++ b/app/components/pub/ui/pagination/PaginationNext.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import type { PaginationNextProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
+import {
+  Button,
+} from '~/components/pub/ui/button'
+import { cn } from '~/lib/utils'
+import { ChevronRightIcon } from '@radix-icons/vue'
 import { PaginationNext } from 'radix-vue'
 import { computed } from 'vue'
-import { Button } from '~/components/pub/ui/button'
-import { cn } from '~/lib/utils'
-
 
 const props = withDefaults(defineProps<PaginationNextProps & { class?: HTMLAttributes['class'] }>(), {
   asChild: true,
@@ -20,9 +22,9 @@ const delegatedProps = computed(() => {
 
 <template>
   <PaginationNext v-bind="delegatedProps">
-    <Button :class="cn('h-9 w-9 p-0', props.class)" variant="outline">
+    <Button :class="cn('w-9 h-9 p-0', props.class)" variant="outline">
       <slot>
-        <Icon name="i-radix-icons-chevron-right" />
+        <ChevronRightIcon />
       </slot>
     </Button>
   </PaginationNext>
diff --git a/app/components/pub/ui/pagination/PaginationPrev.vue b/app/components/pub/ui/pagination/PaginationPrev.vue
index ba115f5a..44292f6d 100644
--- a/app/components/pub/ui/pagination/PaginationPrev.vue
+++ b/app/components/pub/ui/pagination/PaginationPrev.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import type { PaginationPrevProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
+import {
+  Button,
+} from '~/components/pub/ui/button'
+import { cn } from '~/lib/utils'
+import { ChevronLeftIcon } from '@radix-icons/vue'
 import { PaginationPrev } from 'radix-vue'
 import { computed } from 'vue'
-import { Button } from '~/components/pub/ui/button'
-import { cn } from '~/lib/utils'
-
 
 const props = withDefaults(defineProps<PaginationPrevProps & { class?: HTMLAttributes['class'] }>(), {
   asChild: true,
@@ -20,9 +22,9 @@ const delegatedProps = computed(() => {
 
 <template>
   <PaginationPrev v-bind="delegatedProps">
-    <Button :class="cn('h-9 w-9 p-0', props.class)" variant="outline">
+    <Button :class="cn('w-9 h-9 p-0', props.class)" variant="outline">
       <slot>
-        <Icon name="i-radix-icons-chevron-left" />
+        <ChevronLeftIcon />
       </slot>
     </Button>
   </PaginationPrev>
diff --git a/app/lib/page-permission.ts b/app/lib/page-permission.ts
index 8c05780a..3d06cfdc 100644
--- a/app/lib/page-permission.ts
+++ b/app/lib/page-permission.ts
@@ -17,4 +17,12 @@ export const PAGE_PERMISSIONS = {
     billing: ['R'],
     management: ['R'],
   },
+  '/satusehat': {
+    doctor: ['R'],
+    nurse: ['R'],
+    admisi: ['C', 'R', 'U', 'D'],
+    pharmacy: ['R'],
+    billing: ['R'],
+    management: ['R'],
+  },
 } as const satisfies Record<string, RoleAccess>
diff --git a/app/lib/utils.ts b/app/lib/utils.ts
index abba253f..d32b0fe6 100644
--- a/app/lib/utils.ts
+++ b/app/lib/utils.ts
@@ -1,5 +1,4 @@
-import type { ClassValue } from 'clsx'
-import { clsx } from 'clsx'
+import { type ClassValue, clsx } from 'clsx'
 import { twMerge } from 'tailwind-merge'
 
 export function cn(...inputs: ClassValue[]) {
diff --git a/app/pages/(features)/satusehat/[id]/detail.vue b/app/pages/(features)/satusehat/[id]/detail.vue
new file mode 100644
index 00000000..c1014755
--- /dev/null
+++ b/app/pages/(features)/satusehat/[id]/detail.vue
@@ -0,0 +1,9 @@
+<script setup lang="ts">
+definePageMeta({
+  roles: ['sys', 'doc'],
+})
+</script>
+
+<template>
+  <div>detail satusehat</div>
+</template>
diff --git a/app/pages/(features)/satusehat/[id]/edit.vue b/app/pages/(features)/satusehat/[id]/edit.vue
new file mode 100644
index 00000000..351fe46e
--- /dev/null
+++ b/app/pages/(features)/satusehat/[id]/edit.vue
@@ -0,0 +1,9 @@
+<script setup lang="ts">
+definePageMeta({
+  roles: ['sys', 'doc'],
+})
+</script>
+
+<template>
+  <div>edit satusehat</div>
+</template>
diff --git a/app/pages/(features)/satusehat/add.vue b/app/pages/(features)/satusehat/add.vue
new file mode 100644
index 00000000..d1fee557
--- /dev/null
+++ b/app/pages/(features)/satusehat/add.vue
@@ -0,0 +1,40 @@
+<script setup lang="ts">
+import type { PagePermission } from '~/models/role'
+import { PAGE_PERMISSIONS } from '~/lib/page-permission'
+
+definePageMeta({
+  middleware: ['rbac'],
+  roles: ['doctor', 'nurse', 'admisi', 'pharmacy', 'billing', 'management'],
+  title: 'Tambah Pasien',
+  contentFrame: 'cf-full-width',
+})
+
+const route = useRoute()
+
+useHead({
+  title: () => route.meta.title as string,
+})
+
+const roleAccess: PagePermission = PAGE_PERMISSIONS['/satusehat']
+
+const { checkRole, hasCreateAccess } = useRBAC()
+
+// Check if user has access to this page
+const hasAccess = checkRole(roleAccess)
+if (!hasAccess) {
+  throw createError({
+    statusCode: 403,
+    statusMessage: 'Access denied',
+  })
+}
+
+// Define permission-based computed properties
+const canCreate = hasCreateAccess(roleAccess)
+</script>
+
+<template>
+  <div v-if="canCreate">
+    <FlowPatientAdd />
+  </div>
+  <PubBaseError v-else :status-code="403" />
+</template>
diff --git a/app/pages/(features)/satusehat/index.vue b/app/pages/(features)/satusehat/index.vue
new file mode 100644
index 00000000..2c7bb9f5
--- /dev/null
+++ b/app/pages/(features)/satusehat/index.vue
@@ -0,0 +1,39 @@
+<script setup lang="ts">
+import type { PagePermission } from '~/models/role'
+import { PAGE_PERMISSIONS } from '~/lib/page-permission'
+
+definePageMeta({
+  middleware: ['rbac'],
+  roles: ['doctor', 'nurse', 'admisi', 'pharmacy', 'billing', 'management'],
+  title: 'SATUSEHAT Integration',
+  contentFrame: 'cf-full-width',
+})
+
+const route = useRoute()
+
+useHead({
+  title: () => route.meta.title as string,
+})
+
+const roleAccess: PagePermission = PAGE_PERMISSIONS['/satusehat']
+
+const { checkRole, hasReadAccess } = useRBAC()
+
+// Check if user has access to this page
+const hasAccess = checkRole(roleAccess)
+if (!hasAccess) {
+  navigateTo('/403')
+}
+
+// Define permission-based computed properties
+const canRead = hasReadAccess(roleAccess)
+</script>
+
+<template>
+  <div>
+    <div v-if="canRead">
+      <FlowSatusehatList />
+    </div>
+    <PubBaseError v-else :status-code="403" />
+  </div>
+</template>
diff --git a/app/pages/index.vue b/app/pages/index.vue
index 99afb9dd..5d6072e5 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -8,7 +8,7 @@ definePageMeta({
 
 const route = useRoute()
 useHead({
-  title: () => route.meta.title,
+  title: () => route.meta.title as string,
 })
 </script>
 
diff --git a/components.json b/components.json
index 9eb92e6b..a23fb04f 100644
--- a/components.json
+++ b/components.json
@@ -1,20 +1,18 @@
 {
-  "$schema": "https://shadcn-vue.com/schema.json",
+  "$schema": "https://radix.shadcn-vue.com/schema.json",
   "style": "new-york",
   "typescript": true,
+  "tsConfigPath": ".nuxt/tsconfig.json",
   "tailwind": {
-    "config": "",
-    "css": "app/assets/css/tailwind.css",
+    "config": "tailwind.config.ts",
+    "css": "app/assets/css/main.css",
     "baseColor": "neutral",
     "cssVariables": true,
     "prefix": ""
   },
+  "framework": "nuxt",
   "aliases": {
     "components": "~/components/pub",
-    "composables": "~/composables",
-    "utils": "~/lib/utils",
-    "ui": "~/components/pub/ui",
-    "lib": "~/lib"
-  },
-  "iconLibrary": "lucide"
+    "utils": "~/lib/utils"
+  }
 }
diff --git a/nuxt.config.ts b/nuxt.config.ts
index c4c226a0..fb2ac447 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,17 +1,22 @@
+import process from 'node:process'
+
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
   devtools: { enabled: true },
   runtimeConfig: {
     API_ORIGIN: process.env.API_ORIGIN || 'https://main-api.dev-hopis.sabbi.id',
   },
+  ssr: false,
+
   modules: [
     '@unocss/nuxt',
-    'shadcn-nuxt',
     '@vueuse/nuxt',
     '@nuxt/eslint',
     '@nuxt/icon',
     '@pinia/nuxt',
     '@nuxtjs/color-mode',
+    '@nuxtjs/tailwindcss',
+    'shadcn-nuxt',
   ],
 
   css: ['@unocss/reset/tailwind.css', '~/assets/css/main.css'],
diff --git a/package.json b/package.json
index ed5ec93b..00158330 100644
--- a/package.json
+++ b/package.json
@@ -2,6 +2,7 @@
   "name": "nuxt-app",
   "type": "module",
   "private": true,
+  "packageManager": "pnpm@8.15.9+sha512.499434c9d8fdd1a2794ebf4552b3b25c0a633abcee5bb15e7b5de90f32f47b513aca98cd5cfd001c31f0db454bc3804edccd578501e4ca293a6816166bbd9f81",
   "scripts": {
     "build": "nuxt build",
     "dev": "nuxt dev",
@@ -16,6 +17,7 @@
     "@iconify-json/lucide": "^1.2.30",
     "@iconify-json/radix-icons": "^1.2.2",
     "@internationalized/date": "^3.7.0",
+    "@radix-icons/vue": "^1.0.0",
     "@unovis/ts": "^1.5.1",
     "@unovis/vue": "^1.5.1",
     "embla-carousel": "^8.5.2",
@@ -23,7 +25,7 @@
     "h3": "^1.15.4",
     "pinia": "^3.0.3",
     "pinia-plugin-persistedstate": "^4.4.1",
-    "reka-ui": "^2.4.1"
+    "tailwindcss-animate": "^1.0.7"
   },
   "devDependencies": {
     "@antfu/eslint-config": "^4.10.1",
@@ -31,12 +33,13 @@
     "@nuxt/icon": "^1.15.0",
     "@nuxt/test-utils": "^3.19.2",
     "@nuxtjs/color-mode": "^3.5.2",
+    "@nuxtjs/tailwindcss": "6.14.0",
     "@pinia/nuxt": "^0.11.2",
     "@unocss/eslint-plugin": "^66.0.0",
     "@unocss/nuxt": "^66.0.0",
     "@vee-validate/zod": "^4.15.0",
     "@vue/test-utils": "^2.4.6",
-    "@vueuse/core": "^12.2.0",
+    "@vueuse/core": "^12.8.2",
     "@vueuse/math": "^12.2.0",
     "@vueuse/nuxt": "^12.2.0",
     "class-variance-authority": "^0.7.1",
@@ -65,6 +68,5 @@
     "vue-sonner": "^1.3.0",
     "vue-tsc": "^2.1.10",
     "zod": "^3.24.2"
-  },
-  "packageManager": "pnpm@8.15.9+sha512.499434c9d8fdd1a2794ebf4552b3b25c0a633abcee5bb15e7b5de90f32f47b513aca98cd5cfd001c31f0db454bc3804edccd578501e4ca293a6816166bbd9f81"
+  }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f00e4ce1..7a3ef8de 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -14,6 +14,9 @@ dependencies:
   '@internationalized/date':
     specifier: ^3.7.0
     version: 3.8.2
+  '@radix-icons/vue':
+    specifier: ^1.0.0
+    version: 1.0.0(vue@3.5.18)
   '@unovis/ts':
     specifier: ^1.5.1
     version: 1.5.2
@@ -35,9 +38,9 @@ dependencies:
   pinia-plugin-persistedstate:
     specifier: ^4.4.1
     version: 4.5.0(@pinia/nuxt@0.11.2)(pinia@3.0.3)
-  reka-ui:
-    specifier: ^2.4.1
-    version: 2.4.1(typescript@5.9.2)(vue@3.5.18)
+  tailwindcss-animate:
+    specifier: ^1.0.7
+    version: 1.0.7(tailwindcss@3.4.17)
 
 devDependencies:
   '@antfu/eslint-config':
@@ -55,6 +58,9 @@ devDependencies:
   '@nuxtjs/color-mode':
     specifier: ^3.5.2
     version: 3.5.2
+  '@nuxtjs/tailwindcss':
+    specifier: 6.14.0
+    version: 6.14.0
   '@pinia/nuxt':
     specifier: ^0.11.2
     version: 0.11.2(pinia@3.0.3)
@@ -71,7 +77,7 @@ devDependencies:
     specifier: ^2.4.6
     version: 2.4.6
   '@vueuse/core':
-    specifier: ^12.2.0
+    specifier: ^12.8.2
     version: 12.8.2(typescript@5.9.2)
   '@vueuse/math':
     specifier: ^12.2.0
@@ -160,6 +166,10 @@ devDependencies:
 
 packages:
 
+  /@alloc/quick-lru@5.2.0:
+    resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
+    engines: {node: '>=10'}
+
   /@ampproject/remapping@2.3.0:
     resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
     engines: {node: '>=6.0.0'}
@@ -578,6 +588,24 @@ packages:
     engines: {node: '>=0.1.90'}
     dev: true
 
+  /@csstools/selector-resolve-nested@3.1.0(postcss-selector-parser@7.1.0):
+    resolution: {integrity: sha512-mf1LEW0tJLKfWyvn5KdDrhpxHyuxpbNwTIwOYLIvsTffeyOf85j5oIzfG0yosxDgx/sswlqBnESYUcQH0vgZ0g==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss-selector-parser: ^7.0.0
+    dependencies:
+      postcss-selector-parser: 7.1.0
+    dev: true
+
+  /@csstools/selector-specificity@5.0.0(postcss-selector-parser@7.1.0):
+    resolution: {integrity: sha512-PCqQV3c4CoVm3kdPhyeZ07VmBRdH2EpMFA/pd9OASpOEC3aXNGoqPDAZ80D0cLpMBxnmk0+yNhGsEx31hq7Gtw==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss-selector-parser: ^7.0.0
+    dependencies:
+      postcss-selector-parser: 7.1.0
+    dev: true
+
   /@dabh/diagnostics@2.0.3:
     resolution: {integrity: sha512-hrlQOIi7hAfzsMqlGSFyVucrx38O+j6wiGOf//H2ecvIEqYN4ADBSS2iLMh5UFyDunCNniUIPk/q3riFv45xRA==}
     dependencies:
@@ -1334,15 +1362,18 @@ packages:
     resolution: {integrity: sha512-sGnvb5dmrJaKEZ+LDIpguvdX3bDlEllmv4/ClQ9awcmCZrlx5jQyyMWFM5kBI+EyNOCDDiKk8il0zeuX3Zlg/w==}
     dependencies:
       '@floating-ui/utils': 0.2.10
+    dev: true
 
   /@floating-ui/dom@1.7.3:
     resolution: {integrity: sha512-uZA413QEpNuhtb3/iIKoYMSK07keHPYeXF02Zhd6e213j+d1NamLix/mCLxBUDW/Gx52sPH2m+chlUsyaBs/Ag==}
     dependencies:
       '@floating-ui/core': 1.7.3
       '@floating-ui/utils': 0.2.10
+    dev: true
 
   /@floating-ui/utils@0.2.10:
     resolution: {integrity: sha512-aGTxbpbg8/b5JfU1HXSrbH3wXZuLPJcNEcZQFMxLs3oSzgtVu6nFPkbbGGUvBcUjKV2YyB9Wxxabo+HEH9tcRQ==}
+    dev: true
 
   /@floating-ui/vue@1.1.8(vue@3.5.18):
     resolution: {integrity: sha512-SNJAa1jbT8Gh1LvWw2uIIViLL0saV2bCY59ISCvJzhbut5DSb2H3LKUK49Xkd7SixTNHKX4LFu59nbwIXt9jjQ==}
@@ -1353,6 +1384,7 @@ packages:
     transitivePeerDependencies:
       - '@vue/composition-api'
       - vue
+    dev: true
 
   /@humanfs/core@0.19.1:
     resolution: {integrity: sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==}
@@ -1451,6 +1483,7 @@ packages:
     resolution: {integrity: sha512-P+/h+RDaiX8EGt3shB9AYM1+QgkvHmJ5rKi4/59k4sg9g58k9rqsRW0WxRO7jCoHyvVbFRRFKmVTdFYdehrxHg==}
     dependencies:
       '@swc/helpers': 0.5.17
+    dev: true
 
   /@ioredis/commands@1.3.0:
     resolution: {integrity: sha512-M/T6Zewn7sDaBQEqIZ8Rb+i9y8qfGmq+5SDFSf9sA2lUZTmdDLVdOiQaeDp+Q4wElZ9HG1GAX5KhDaidp6LQsQ==}
@@ -1478,7 +1511,6 @@ packages:
       strip-ansi-cjs: /strip-ansi@6.0.1
       wrap-ansi: 8.1.0
       wrap-ansi-cjs: /wrap-ansi@7.0.0
-    dev: true
 
   /@isaacs/fs-minipass@4.0.1:
     resolution: {integrity: sha512-wgm9Ehl2jpeqP3zw/7mo3kRHFp5MEDhqAdwy1fTGkHAwnkGOVsgpvQhL8B5n1qlb01jV3n/bI0ZfZp5lWA1k4w==}
@@ -1517,6 +1549,19 @@ packages:
     resolution: {integrity: sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA==}
     dev: false
 
+  /@koa/router@12.0.2:
+    resolution: {integrity: sha512-sYcHglGKTxGF+hQ6x67xDfkE9o+NhVlRHBqq6gLywaMc6CojK/5vFZByphdonKinYlMLkEkacm+HEse9HzwgTA==}
+    engines: {node: '>= 12'}
+    dependencies:
+      debug: 4.4.1
+      http-errors: 2.0.0
+      koa-compose: 4.1.0
+      methods: 1.1.2
+      path-to-regexp: 6.3.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /@kwsites/file-exists@1.1.1:
     resolution: {integrity: sha512-m9/5YGR18lIwxSFDwfE3oA7bWuq9kdau6ugN4H2rJeyhFQZcG9AgSHkQtSD15a8WvTgfz9aikZMrKPHvbpqFiw==}
     dependencies:
@@ -1727,7 +1772,6 @@ packages:
     dependencies:
       '@nodelib/fs.stat': 2.0.5
       run-parallel: 1.2.0
-    dev: true
 
   /@nodelib/fs.scandir@4.0.1:
     resolution: {integrity: sha512-vAkI715yhnmiPupY+dq+xenu5Tdf2TBQ66jLvBIcCddtz+5Q8LbMKaf9CIJJreez8fQ8fgaY+RaywQx8RJIWpw==}
@@ -1740,7 +1784,6 @@ packages:
   /@nodelib/fs.stat@2.0.5:
     resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==}
     engines: {node: '>= 8'}
-    dev: true
 
   /@nodelib/fs.stat@4.0.0:
     resolution: {integrity: sha512-ctr6bByzksKRCV0bavi8WoQevU6plSp2IkllIsEqaiKe2mwNNnaluhnRhcsgGZHrrHk57B3lf95MkLMO3STYcg==}
@@ -1753,7 +1796,6 @@ packages:
     dependencies:
       '@nodelib/fs.scandir': 2.1.5
       fastq: 1.19.1
-    dev: true
 
   /@nodelib/fs.walk@3.0.1:
     resolution: {integrity: sha512-nIh/M6Kh3ZtOmlY00DaUYB4xeeV6F3/ts1l29iwl3/cfyY/OuCfUx+v08zgx8TKPTifXRcjjqVQ4KB2zOYSbyw==}
@@ -2223,6 +2265,31 @@ packages:
       - magicast
     dev: true
 
+  /@nuxtjs/tailwindcss@6.14.0:
+    resolution: {integrity: sha512-30RyDK++LrUVRgc2A85MktGWIZoRQgeQKjE4CjjD64OXNozyl+4ScHnnYgqVToMM6Ch2ZG2W4wV2J0EN6F0zkQ==}
+    dependencies:
+      '@nuxt/kit': 3.18.1(magicast@0.3.5)
+      autoprefixer: 10.4.21(postcss@8.5.6)
+      c12: 3.2.0(magicast@0.3.5)
+      consola: 3.4.2
+      defu: 6.1.4
+      h3: 1.15.4
+      klona: 2.0.6
+      ohash: 2.0.11
+      pathe: 2.0.3
+      pkg-types: 2.2.0
+      postcss: 8.5.6
+      postcss-nesting: 13.0.2(postcss@8.5.6)
+      tailwind-config-viewer: 2.0.4(tailwindcss@3.4.17)
+      tailwindcss: 3.4.17
+      ufo: 1.6.1
+      unctx: 2.4.1
+    transitivePeerDependencies:
+      - magicast
+      - supports-color
+      - ts-node
+    dev: true
+
   /@one-ini/wasm@0.1.1:
     resolution: {integrity: sha512-XuySG1E38YScSJoMlqovLru4KTUNSjgVTIjyh7qMX6aNN5HY5Ct5LhRJdxO79JtTzKfzV/bnWpz+zquYrISsvw==}
     dev: true
@@ -2810,7 +2877,6 @@ packages:
     resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
     engines: {node: '>=14'}
     requiresBuild: true
-    dev: true
     optional: true
 
   /@pkgr/core@0.1.2:
@@ -2851,6 +2917,14 @@ packages:
       quansync: 0.2.10
     dev: true
 
+  /@radix-icons/vue@1.0.0(vue@3.5.18):
+    resolution: {integrity: sha512-gKWWk9tTK/laDRRNe5KLLR8A0qUwx4q4+DN8Fq48hJ904u78R82ayAO3TrxbNLgyn2D0h6rRiGdLzQWj7rPcvA==}
+    peerDependencies:
+      vue: '>= 3'
+    dependencies:
+      vue: 3.5.18(typescript@5.9.2)
+    dev: false
+
   /@rolldown/pluginutils@1.0.0-beta.29:
     resolution: {integrity: sha512-NIJgOsMjbxAXvoGq/X0gD7VPMQ8j9g0BiDaNjVNVjvl+iKXxL3Jre0v31RmBYeLEmkbj2s02v8vFTbUXi5XS2Q==}
     dev: true
@@ -3175,6 +3249,7 @@ packages:
 
   /@tanstack/virtual-core@3.13.12:
     resolution: {integrity: sha512-1YBOJfRHV4sXUmWsFSf5rQor4Ss82G8dQWLRbnk3GA4jeP8hQt1hxXh0tmflpC0dz3VgEv/1+qwPyLeWkQuPFA==}
+    dev: true
 
   /@tanstack/vue-virtual@3.13.12(vue@3.5.18):
     resolution: {integrity: sha512-vhF7kEU9EXWXh+HdAwKJ2m3xaOnTTmgcdXcF2pim8g4GvI7eRrk2YRuV5nUlZnd/NbCIX4/Ja2OZu5EjJL06Ww==}
@@ -3183,6 +3258,7 @@ packages:
     dependencies:
       '@tanstack/virtual-core': 3.13.12
       vue: 3.5.18(typescript@5.9.2)
+    dev: true
 
   /@tybys/wasm-util@0.10.0:
     resolution: {integrity: sha512-VyyPYFlOMNylG45GoAe0xDoLwWuowvf92F9kySqzYh8vmYm7D2u4iUJKa1tOUpS70Ku13ASrOkS4ScXFsTaCNQ==}
@@ -3564,6 +3640,7 @@ packages:
 
   /@types/web-bluetooth@0.0.21:
     resolution: {integrity: sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA==}
+    dev: true
 
   /@types/whatwg-mimetype@3.0.2:
     resolution: {integrity: sha512-c2AKvDT8ToxLIOUlN51gTiHXflsfIFisS4pO7pDPoKouJCESkhZnEy623gwP9laCy5lnLDAw1vAzu2vM2YLOrA==}
@@ -4627,6 +4704,7 @@ packages:
       vue: 3.5.18(typescript@5.9.2)
     transitivePeerDependencies:
       - typescript
+    dev: true
 
   /@vueuse/math@12.8.2(typescript@5.9.2):
     resolution: {integrity: sha512-hAhazPaKb4wlS/EXu11+dYaEaX60jvb+zil3uGR4he5yWLKAxcqGMhupuHAa0uIKcSK11GJMm0GdEA7mQYx2Aw==}
@@ -4643,6 +4721,7 @@ packages:
 
   /@vueuse/metadata@12.8.2:
     resolution: {integrity: sha512-rAyLGEuoBJ/Il5AmFHiziCPdQzRt88VxR+Y/A/QhJ1EWtWqPBBAxTAFaSkviwEuOEZNtW8pvkPgoCZQ+HxqW1A==}
+    dev: true
 
   /@vueuse/nuxt@12.8.2(nuxt@4.0.3)(typescript@5.9.2):
     resolution: {integrity: sha512-jDsMli+MmxlhzaMwu8a2varKlkiBTPCdb+I457F7bTb1GazC6HDbGbLmhkpVQ8bNA1FzqfhwhAsOEsESF7wOkw==}
@@ -4675,6 +4754,7 @@ packages:
       vue: 3.5.18(typescript@5.9.2)
     transitivePeerDependencies:
       - typescript
+    dev: true
 
   /@webassemblyjs/ast@1.14.1:
     resolution: {integrity: sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==}
@@ -4850,6 +4930,14 @@ packages:
       event-target-shim: 5.0.1
     dev: true
 
+  /accepts@1.3.8:
+    resolution: {integrity: sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==}
+    engines: {node: '>= 0.6'}
+    dependencies:
+      mime-types: 2.1.35
+      negotiator: 0.6.3
+    dev: true
+
   /acorn-import-attributes@1.9.5(acorn@8.15.0):
     resolution: {integrity: sha512-n02Vykv5uA3eHGM/Z2dQrcD56kL8TyDb2p1+0P83PClMnC/nc+anbQRhIOWnSq4Ke/KvDPrY3C9hDtC/A3eHnQ==}
     peerDependencies:
@@ -4934,37 +5022,35 @@ packages:
   /ansi-regex@5.0.1:
     resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
     engines: {node: '>=8'}
-    dev: true
 
   /ansi-regex@6.1.0:
     resolution: {integrity: sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==}
     engines: {node: '>=12'}
-    dev: true
 
   /ansi-styles@4.3.0:
     resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
     engines: {node: '>=8'}
     dependencies:
       color-convert: 2.0.1
-    dev: true
 
   /ansi-styles@6.2.1:
     resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==}
     engines: {node: '>=12'}
-    dev: true
 
   /ansis@4.1.0:
     resolution: {integrity: sha512-BGcItUBWSMRgOCe+SVZJ+S7yTRG0eGt9cXAHev72yuGcY23hnLA7Bky5L/xLyPINoSN95geovfBkqoTlNZYa7w==}
     engines: {node: '>=14'}
     dev: true
 
+  /any-promise@1.3.0:
+    resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
+
   /anymatch@3.1.3:
     resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
     engines: {node: '>= 8'}
     dependencies:
       normalize-path: 3.0.0
       picomatch: 2.3.1
-    dev: true
 
   /archiver-utils@5.0.2:
     resolution: {integrity: sha512-wuLJMmIBQYCsGZgYLTy5FIB2pF6Lfb6cXMSF8Qywwk3t20zWnAi7zLcQFdKQmIB8wyZpY5ER38x08GbwtR2cLA==}
@@ -4997,6 +5083,9 @@ packages:
     engines: {node: '>=14'}
     dev: true
 
+  /arg@5.0.2:
+    resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
+
   /argparse@2.0.1:
     resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
     dev: true
@@ -5006,6 +5095,7 @@ packages:
     engines: {node: '>=10'}
     dependencies:
       tslib: 2.8.1
+    dev: true
 
   /assertion-error@2.0.1:
     resolution: {integrity: sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==}
@@ -5041,6 +5131,11 @@ packages:
     resolution: {integrity: sha512-htCUDlxyyCLMgaM3xXg0C0LW2xqfuQ6p05pCEIsXuyQ+a1koYKTuBMzRNwmybfLgvJDMd0r1LTn4+E0Ti6C2AA==}
     dev: true
 
+  /at-least-node@1.0.0:
+    resolution: {integrity: sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==}
+    engines: {node: '>= 4.0.0'}
+    dev: true
+
   /autoprefixer@10.4.21(postcss@8.5.6):
     resolution: {integrity: sha512-O+A6LWV5LDHSJD3LjHYoNi4VLsj/Whi7k6zG12xTYaU4cQ8oxQGckXNX8cRHK5yOZ/ppVHe0ZBXGzSV9jXdVbQ==}
     engines: {node: ^10 || ^12 || >=14}
@@ -5072,7 +5167,6 @@ packages:
 
   /balanced-match@1.0.2:
     resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
-    dev: true
 
   /bare-events@2.6.1:
     resolution: {integrity: sha512-AuTJkq9XmE6Vk0FJVNq5QxETrSA/vKHarWVBG5l/JbdCL1prJemiyJqUS0jrlXO0MftuPq4m3YVYhoNc5+aE/g==}
@@ -5087,7 +5181,6 @@ packages:
   /binary-extensions@2.3.0:
     resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==}
     engines: {node: '>=8'}
-    dev: true
 
   /bindings@1.5.0:
     resolution: {integrity: sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==}
@@ -5113,14 +5206,12 @@ packages:
     resolution: {integrity: sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==}
     dependencies:
       balanced-match: 1.0.2
-    dev: true
 
   /braces@3.0.3:
     resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==}
     engines: {node: '>=8'}
     dependencies:
       fill-range: 7.1.1
-    dev: true
 
   /browserslist@4.25.2:
     resolution: {integrity: sha512-0si2SJK3ooGzIawRu61ZdPCO1IncZwS8IzuX73sPZsXW6EQ/w/DAfPyKI8l1ETTCr2MnvqWitmlCUxgdul45jA==}
@@ -5207,6 +5298,14 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
+  /cache-content-type@1.0.1:
+    resolution: {integrity: sha512-IKufZ1o4Ut42YUrZSo8+qnMTrFuKkvyoLXUywKz9GJ5BrhOFGhLdkx9sG4KAnVvbY6kEcSFjLQul+DVmBm2bgA==}
+    engines: {node: '>= 6.0.0'}
+    dependencies:
+      mime-types: 2.1.35
+      ylru: 1.4.0
+    dev: true
+
   /call-bind-apply-helpers@1.0.2:
     resolution: {integrity: sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==}
     engines: {node: '>= 0.4'}
@@ -5231,6 +5330,10 @@ packages:
     resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
     engines: {node: '>=6'}
 
+  /camelcase-css@2.0.1:
+    resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
+    engines: {node: '>= 6'}
+
   /caniuse-api@3.0.0:
     resolution: {integrity: sha512-bsTwuIg/BZZK/vreVTYYbSWoe2F+71P7K5QGEX+pT250DZbfU1MQ5prOKpPR+LL6uWKK3KMwMCAS74QB3Um1uw==}
     dependencies:
@@ -5293,7 +5396,6 @@ packages:
       readdirp: 3.6.0
     optionalDependencies:
       fsevents: 2.3.3
-    dev: true
 
   /chokidar@4.0.3:
     resolution: {integrity: sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==}
@@ -5362,6 +5464,11 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: true
 
+  /co@4.6.0:
+    resolution: {integrity: sha512-QVb0dM5HvG+uaxitm8wONl7jltx8dqhfU33DcqtOZcLSVIKSDDLDi7+0LbAKiyI8hD9u42m2YxXSkMGWThaecQ==}
+    engines: {iojs: '>= 1.0.0', node: '>= 0.12.0'}
+    dev: true
+
   /color-convert@1.9.3:
     resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
     dependencies:
@@ -5373,7 +5480,6 @@ packages:
     engines: {node: '>=7.0.0'}
     dependencies:
       color-name: 1.1.4
-    dev: true
 
   /color-name@1.1.3:
     resolution: {integrity: sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==}
@@ -5381,7 +5487,6 @@ packages:
 
   /color-name@1.1.4:
     resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
-    dev: true
 
   /color-string@1.9.1:
     resolution: {integrity: sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==}
@@ -5430,6 +5535,15 @@ packages:
   /commander@2.20.3:
     resolution: {integrity: sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==}
 
+  /commander@4.1.1:
+    resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
+    engines: {node: '>= 6'}
+
+  /commander@6.2.1:
+    resolution: {integrity: sha512-U7VdrJFnJgo4xjrHpTzu0yrHPGImdsmD95ZlgYSEajAn2JKzDhDTPG9kBTefmObL2w/ngeZnilk+OV9CG3d7UA==}
+    engines: {node: '>= 6'}
+    dev: true
+
   /commander@7.2.0:
     resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==}
     engines: {node: '>= 10'}
@@ -5484,6 +5598,18 @@ packages:
     resolution: {integrity: sha512-5IKcdX0nnYavi6G7TtOhwkYzyjfJlatbjMjuLSfE2kYT5pMDOilZ4OvMhi637CcDICTmz3wARPoyhqyX1Y+XvA==}
     engines: {node: ^14.18.0 || >=16.10.0}
 
+  /content-disposition@0.5.4:
+    resolution: {integrity: sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==}
+    engines: {node: '>= 0.6'}
+    dependencies:
+      safe-buffer: 5.2.1
+    dev: true
+
+  /content-type@1.0.5:
+    resolution: {integrity: sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==}
+    engines: {node: '>= 0.6'}
+    dev: true
+
   /convert-source-map@1.9.0:
     resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==}
     dev: false
@@ -5504,6 +5630,14 @@ packages:
     engines: {node: '>=18'}
     dev: true
 
+  /cookies@0.9.1:
+    resolution: {integrity: sha512-TG2hpqe4ELx54QER/S3HQ9SRVnQnGBtKUz5bLQWtYAQ+o6GpgMs6sYUvaiJjVxb+UXwhRhAEP3m7LbsIZ77Hmw==}
+    engines: {node: '>= 0.8'}
+    dependencies:
+      depd: 2.0.0
+      keygrip: 1.1.0
+    dev: true
+
   /copy-anything@3.0.5:
     resolution: {integrity: sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==}
     engines: {node: '>=12.13'}
@@ -5572,7 +5706,6 @@ packages:
       path-key: 3.1.1
       shebang-command: 2.0.0
       which: 2.0.2
-    dev: true
 
   /crossws@0.3.5:
     resolution: {integrity: sha512-ojKiDvcmByhwa8YYqbQI/hg7MEU0NC03+pSdEq4ZUnZR9xXpwk7E43SMNGkn+JxJGPFtNvQ48+vV2p+P1ml5PA==}
@@ -5627,7 +5760,6 @@ packages:
     resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
     engines: {node: '>=4'}
     hasBin: true
-    dev: true
 
   /cssnano-preset-default@7.0.8(postcss@8.5.6):
     resolution: {integrity: sha512-d+3R2qwrUV3g4LEMOjnndognKirBZISylDZAF/TPeCWVjEwlXS2e4eN4ICkoobRe7pD3H6lltinKVyS1AJhdjQ==}
@@ -6020,6 +6152,17 @@ packages:
     resolution: {integrity: sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==}
     dev: true
 
+  /debug@3.2.7:
+    resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+    dependencies:
+      ms: 2.1.3
+    dev: true
+
   /debug@4.4.1:
     resolution: {integrity: sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==}
     engines: {node: '>=6.0'}
@@ -6048,6 +6191,10 @@ packages:
     engines: {node: '>=6'}
     dev: true
 
+  /deep-equal@1.0.1:
+    resolution: {integrity: sha512-bHtC0iYvWhyaTzvV3CZgPeZQqCOBGyGsVV7v4eevpdkLHfiSrXUdBG+qAuSz4RI70sszvjQ1QSZ98An1yNwpSw==}
+    dev: true
+
   /deep-is@0.1.4:
     resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
     dev: true
@@ -6093,11 +6240,20 @@ packages:
       robust-predicates: 3.0.2
     dev: false
 
+  /delegates@1.0.0:
+    resolution: {integrity: sha512-bd2L678uiWATM6m5Z1VzNCErI3jiGzt6HGY8OVICs40JQq/HALfbyNJmp0UDakEY4pMMaN0Ly5om/B1VI/+xfQ==}
+    dev: true
+
   /denque@2.1.0:
     resolution: {integrity: sha512-HVQE3AAb/pxF8fQAoiqpvg9i3evqug3hoiwakOyZAwJm+6vZehbkYXZ0l4JxS+I3QxM97v5aaRNhj8v5oBhekw==}
     engines: {node: '>=0.10'}
     dev: true
 
+  /depd@1.1.2:
+    resolution: {integrity: sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ==}
+    engines: {node: '>= 0.6'}
+    dev: true
+
   /depd@2.0.0:
     resolution: {integrity: sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==}
     engines: {node: '>= 0.8'}
@@ -6111,6 +6267,11 @@ packages:
   /destr@2.0.5:
     resolution: {integrity: sha512-ugFTXCtDZunbzasqBxrK93Ik/DRYsO6S/fedkWEMKqt04xZ4csmnmwGDBAb07QWNaGMAmnTIemsYZCksjATwsA==}
 
+  /destroy@1.2.0:
+    resolution: {integrity: sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==}
+    engines: {node: '>= 0.8', npm: 1.2.8000 || >= 1.4.16}
+    dev: true
+
   /detect-libc@1.0.3:
     resolution: {integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==}
     engines: {node: '>=0.10'}
@@ -6222,11 +6383,17 @@ packages:
       dequal: 2.0.3
     dev: true
 
+  /didyoumean@1.2.2:
+    resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
+
   /diff@8.0.2:
     resolution: {integrity: sha512-sSuxWU5j5SR9QQji/o2qMvqRNYRDOcBTgsJ/DeCf4iSN4gW+gNMXM7wFIP+fdXZxoNiAnHUTGjCr+TSWXdRDKg==}
     engines: {node: '>=0.3.1'}
     dev: true
 
+  /dlv@1.1.3:
+    resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==}
+
   /dom-serializer@2.0.0:
     resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
     dependencies:
@@ -6289,7 +6456,6 @@ packages:
 
   /eastasianwidth@0.2.0:
     resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
-    dev: true
 
   /editorconfig@1.0.4:
     resolution: {integrity: sha512-L9Qe08KWTlqYMVvMcTIvMAdl1cDUubzRNYL+WfA4bLDMHe4nemKkpmYzkznE1FwLKu0EEmy6obgQKzMJrg4x9Q==}
@@ -6338,16 +6504,19 @@ packages:
 
   /emoji-regex@8.0.0:
     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
-    dev: true
 
   /emoji-regex@9.2.2:
     resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
-    dev: true
 
   /enabled@2.0.0:
     resolution: {integrity: sha512-AKrN98kuwOzMIdAizXGI86UFBoo26CL21UM763y1h/GMSJ4/OHU9k2YlsmBpyScFo/wbLzWQJBMCW4+IO3/+OQ==}
     dev: true
 
+  /encodeurl@1.0.2:
+    resolution: {integrity: sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==}
+    engines: {node: '>= 0.8'}
+    dev: true
+
   /encodeurl@2.0.0:
     resolution: {integrity: sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==}
     engines: {node: '>= 0.8'}
@@ -7151,7 +7320,6 @@ packages:
       glob-parent: 5.1.2
       merge2: 1.4.1
       micromatch: 4.0.8
-    dev: true
 
   /fast-json-stable-stringify@2.1.0:
     resolution: {integrity: sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==}
@@ -7173,7 +7341,6 @@ packages:
     resolution: {integrity: sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==}
     dependencies:
       reusify: 1.1.0
-    dev: true
 
   /fault@2.0.1:
     resolution: {integrity: sha512-WtySTkS4OKev5JtpHXnib4Gxiurzh5NCGvWrFaZ34m6JehfTUhKZvn9njTfw48t6JumVQOmrKqpmGcdwxnhqBQ==}
@@ -7225,7 +7392,6 @@ packages:
     engines: {node: '>=8'}
     dependencies:
       to-regex-range: 5.0.1
-    dev: true
 
   /filter-obj@6.1.0:
     resolution: {integrity: sha512-xdMtCAODmPloU9qtmPcdBV9Kd27NtMse+4ayThxqIHUES5Z2S6bGpap5PpdmNM56ub7y3i1eyr+vJJIIgWGKmA==}
@@ -7280,7 +7446,6 @@ packages:
     dependencies:
       cross-spawn: 7.0.6
       signal-exit: 4.1.0
-    dev: true
 
   /format@0.2.2:
     resolution: {integrity: sha512-wzsgA6WOq+09wrU1tsJ09udeR/YZRaeArL9e1wPbFg3GG2yDnC2ldKpxs4xunpFF9DgqCqOIra3bc1HWrJ37Ww==}
@@ -7298,17 +7463,35 @@ packages:
     resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
     dev: true
 
+  /fresh@0.5.2:
+    resolution: {integrity: sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==}
+    engines: {node: '>= 0.6'}
+    dev: true
+
   /fresh@2.0.0:
     resolution: {integrity: sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==}
     engines: {node: '>= 0.8'}
     dev: true
 
+  /fs-extra@9.1.0:
+    resolution: {integrity: sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==}
+    engines: {node: '>=10'}
+    dependencies:
+      at-least-node: 1.0.0
+      graceful-fs: 4.2.11
+      jsonfile: 6.2.0
+      universalify: 2.0.1
+    dev: true
+
+  /fs.realpath@1.0.0:
+    resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
+    dev: true
+
   /fsevents@2.3.3:
     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
     engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
     os: [darwin]
     requiresBuild: true
-    dev: true
     optional: true
 
   /function-bind@1.1.2:
@@ -7434,14 +7617,12 @@ packages:
     engines: {node: '>= 6'}
     dependencies:
       is-glob: 4.0.3
-    dev: true
 
   /glob-parent@6.0.2:
     resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==}
     engines: {node: '>=10.13.0'}
     dependencies:
       is-glob: 4.0.3
-    dev: true
 
   /glob-to-regexp@0.4.1:
     resolution: {integrity: sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==}
@@ -7457,6 +7638,17 @@ packages:
       minipass: 7.1.2
       package-json-from-dist: 1.0.1
       path-scurry: 1.11.1
+
+  /glob@7.2.3:
+    resolution: {integrity: sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==}
+    deprecated: Glob versions prior to v9 are no longer supported
+    dependencies:
+      fs.realpath: 1.0.0
+      inflight: 1.0.6
+      inherits: 2.0.4
+      minimatch: 3.1.2
+      once: 1.4.0
+      path-is-absolute: 1.0.1
     dev: true
 
   /global-directory@4.0.1:
@@ -7573,6 +7765,13 @@ packages:
     engines: {node: '>= 0.4'}
     dev: true
 
+  /has-tostringtag@1.0.2:
+    resolution: {integrity: sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==}
+    engines: {node: '>= 0.4'}
+    dependencies:
+      has-symbols: 1.1.0
+    dev: true
+
   /hasown@2.0.2:
     resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==}
     engines: {node: '>= 0.4'}
@@ -7594,6 +7793,35 @@ packages:
       lru-cache: 10.4.3
     dev: true
 
+  /http-assert@1.5.0:
+    resolution: {integrity: sha512-uPpH7OKX4H25hBmU6G1jWNaqJGpTXxey+YOUizJUAgu0AjLUeC8D73hTrhvDS5D+GJN1DN1+hhc/eF/wpxtp0w==}
+    engines: {node: '>= 0.8'}
+    dependencies:
+      deep-equal: 1.0.1
+      http-errors: 1.8.1
+    dev: true
+
+  /http-errors@1.6.3:
+    resolution: {integrity: sha512-lks+lVC8dgGyh97jxvxeYTWQFvh4uw4yC12gVl63Cg30sjPX4wuGcdkICVXDAESr6OJGjqGA8Iz5mkeN6zlD7A==}
+    engines: {node: '>= 0.6'}
+    dependencies:
+      depd: 1.1.2
+      inherits: 2.0.3
+      setprototypeof: 1.1.0
+      statuses: 1.5.0
+    dev: true
+
+  /http-errors@1.8.1:
+    resolution: {integrity: sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==}
+    engines: {node: '>= 0.6'}
+    dependencies:
+      depd: 1.1.2
+      inherits: 2.0.4
+      setprototypeof: 1.2.0
+      statuses: 1.5.0
+      toidentifier: 1.0.1
+    dev: true
+
   /http-errors@2.0.0:
     resolution: {integrity: sha512-FtwrG/euBzaEjYeRqOgly7G0qviiXoJWnvEH2Z1plBdXgbyjv34pHTSb9zoeHMyDy33+DWy5Wt9Wo+TURtOYSQ==}
     engines: {node: '>= 0.8'}
@@ -7684,6 +7912,18 @@ packages:
     engines: {node: '>=18'}
     dev: true
 
+  /inflight@1.0.6:
+    resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
+    deprecated: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
+    dependencies:
+      once: 1.4.0
+      wrappy: 1.0.2
+    dev: true
+
+  /inherits@2.0.3:
+    resolution: {integrity: sha512-x00IRNXNy63jwGkJmzPigoySHbaqpNuzKbBOmzK+g2OdZpQ9w+sxCN+VSB3ja7IAge2OP2qpfxTjeNcyjmW1uw==}
+    dev: true
+
   /inherits@2.0.4:
     resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
     dev: true
@@ -7738,7 +7978,6 @@ packages:
     engines: {node: '>=8'}
     dependencies:
       binary-extensions: 2.3.0
-    dev: true
 
   /is-builtin-module@3.2.1:
     resolution: {integrity: sha512-BSLE3HnV2syZ0FK0iMA/yUGplUeMmNz4AW5fnTunbCIqZi4vG3WjJT9FHMy5D69xmAYBHXQhJdALdpwVxV501A==}
@@ -7775,11 +8014,19 @@ packages:
   /is-extglob@2.1.1:
     resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
     engines: {node: '>=0.10.0'}
-    dev: true
 
   /is-fullwidth-code-point@3.0.0:
     resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
     engines: {node: '>=8'}
+
+  /is-generator-function@1.1.0:
+    resolution: {integrity: sha512-nPUB5km40q9e8UfN/Zc24eLlzdSf9OfKByBw9CIdw4H1giPMeA0OIJvbchsCu4npfI2QcMVBsGEBHKZ7wLTWmQ==}
+    engines: {node: '>= 0.4'}
+    dependencies:
+      call-bound: 1.0.4
+      get-proto: 1.0.1
+      has-tostringtag: 1.0.2
+      safe-regex-test: 1.1.0
     dev: true
 
   /is-glob@4.0.3:
@@ -7787,7 +8034,6 @@ packages:
     engines: {node: '>=0.10.0'}
     dependencies:
       is-extglob: 2.1.1
-    dev: true
 
   /is-inside-container@1.0.0:
     resolution: {integrity: sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==}
@@ -7812,7 +8058,6 @@ packages:
   /is-number@7.0.0:
     resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
     engines: {node: '>=0.12.0'}
-    dev: true
 
   /is-path-inside@4.0.0:
     resolution: {integrity: sha512-lJJV/5dYS+RcL8uQdBDW9c9uWFLLBNRyFhnAKXw5tVqLlKZ4RMGZKv+YQ/IA3OhD+RpbJa1LLFM1FQPGyIXvOA==}
@@ -7830,6 +8075,16 @@ packages:
       '@types/estree': 1.0.8
     dev: true
 
+  /is-regex@1.2.1:
+    resolution: {integrity: sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==}
+    engines: {node: '>= 0.4'}
+    dependencies:
+      call-bound: 1.0.4
+      gopd: 1.2.0
+      has-tostringtag: 1.0.2
+      hasown: 2.0.2
+    dev: true
+
   /is-ssh@1.4.1:
     resolution: {integrity: sha512-JNeu1wQsHjyHgn9NcWTaXq6zWSR6hqE0++zhfZlkFBbScNkyvxCdeV8sRkSBaeLKxmbpR21brail63ACNxJ0Tg==}
     dependencies:
@@ -7903,7 +8158,6 @@ packages:
       '@isaacs/cliui': 8.0.2
     optionalDependencies:
       '@pkgjs/parseargs': 0.11.0
-    dev: true
 
   /jest-worker@27.5.1:
     resolution: {integrity: sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==}
@@ -7914,6 +8168,10 @@ packages:
       supports-color: 8.1.1
     dev: true
 
+  /jiti@1.21.7:
+    resolution: {integrity: sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==}
+    hasBin: true
+
   /jiti@2.5.1:
     resolution: {integrity: sha512-twQoecYPiVA5K/h6SxtORw/Bs3ar+mLUtoPSc7iMXzQzK8d7eJ/R09wmTwAjiamETn1cXYPGfNnu7DMoHgu12w==}
     hasBin: true
@@ -8006,6 +8264,14 @@ packages:
       semver: 7.7.2
     dev: true
 
+  /jsonfile@6.2.0:
+    resolution: {integrity: sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==}
+    dependencies:
+      universalify: 2.0.1
+    optionalDependencies:
+      graceful-fs: 4.2.11
+    dev: true
+
   /junk@4.0.1:
     resolution: {integrity: sha512-Qush0uP+G8ZScpGMZvHUiRfI0YBWuB3gVBYlI0v0vvOJt5FLicco+IkP0a50LqTTQhmts/m6tP5SWE+USyIvcQ==}
     engines: {node: '>=12.20'}
@@ -8020,6 +8286,13 @@ packages:
     resolution: {integrity: sha512-hRkd6/XW4HTsA9vjVpY9tuXJYLSlelnkTmVFu4M9/7MIYQtFcHpbugAU7UbOfjOiVSVYl2fqgBuJ32JUmRo5Ew==}
     dev: false
 
+  /keygrip@1.1.0:
+    resolution: {integrity: sha512-iYSchDJ+liQ8iwbSI2QqsQOvqv58eJCEanyJPJi+Khyu8smkcKSFUCbPwzFcL7YVtZ6eONjqRX/38caJ7QjRAQ==}
+    engines: {node: '>= 0.6'}
+    dependencies:
+      tsscmp: 1.0.6
+    dev: true
+
   /keyv@4.5.4:
     resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
     dependencies:
@@ -8048,6 +8321,70 @@ packages:
   /knitwork@1.2.0:
     resolution: {integrity: sha512-xYSH7AvuQ6nXkq42x0v5S8/Iry+cfulBz/DJQzhIyESdLD7425jXsPy4vn5cCXU+HhRN2kVw51Vd1K6/By4BQg==}
 
+  /koa-compose@4.1.0:
+    resolution: {integrity: sha512-8ODW8TrDuMYvXRwra/Kh7/rJo9BtOfPc6qO8eAfC80CnCvSjSl0bkRM24X6/XBBEyj0v1nRUQ1LyOy3dbqOWXw==}
+    dev: true
+
+  /koa-convert@2.0.0:
+    resolution: {integrity: sha512-asOvN6bFlSnxewce2e/DK3p4tltyfC4VM7ZwuTuepI7dEQVcvpyFuBcEARu1+Hxg8DIwytce2n7jrZtRlPrARA==}
+    engines: {node: '>= 10'}
+    dependencies:
+      co: 4.6.0
+      koa-compose: 4.1.0
+    dev: true
+
+  /koa-send@5.0.1:
+    resolution: {integrity: sha512-tmcyQ/wXXuxpDxyNXv5yNNkdAMdFRqwtegBXUaowiQzUKqJehttS0x2j0eOZDQAyloAth5w6wwBImnFzkUz3pQ==}
+    engines: {node: '>= 8'}
+    dependencies:
+      debug: 4.4.1
+      http-errors: 1.8.1
+      resolve-path: 1.4.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /koa-static@5.0.0:
+    resolution: {integrity: sha512-UqyYyH5YEXaJrf9S8E23GoJFQZXkBVJ9zYYMPGz919MSX1KuvAcycIuS0ci150HCoPf4XQVhQ84Qf8xRPWxFaQ==}
+    engines: {node: '>= 7.6.0'}
+    dependencies:
+      debug: 3.2.7
+      koa-send: 5.0.1
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /koa@2.16.2:
+    resolution: {integrity: sha512-+CCssgnrWKx9aI3OeZwroa/ckG4JICxvIFnSiOUyl2Uv+UTI+xIw0FfFrWS7cQFpoePpr9o8csss7KzsTzNL8Q==}
+    engines: {node: ^4.8.4 || ^6.10.1 || ^7.10.1 || >= 8.1.4}
+    dependencies:
+      accepts: 1.3.8
+      cache-content-type: 1.0.1
+      content-disposition: 0.5.4
+      content-type: 1.0.5
+      cookies: 0.9.1
+      debug: 4.4.1
+      delegates: 1.0.0
+      depd: 2.0.0
+      destroy: 1.2.0
+      encodeurl: 1.0.2
+      escape-html: 1.0.3
+      fresh: 0.5.2
+      http-assert: 1.5.0
+      http-errors: 1.8.1
+      is-generator-function: 1.1.0
+      koa-compose: 4.1.0
+      koa-convert: 2.0.0
+      on-finished: 2.4.1
+      only: 0.0.2
+      parseurl: 1.3.3
+      statuses: 1.5.0
+      type-is: 1.6.18
+      vary: 1.1.2
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /kolorist@1.8.0:
     resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==}
     dev: true
@@ -8095,11 +8432,9 @@ packages:
   /lilconfig@3.1.3:
     resolution: {integrity: sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==}
     engines: {node: '>=14'}
-    dev: true
 
   /lines-and-columns@1.2.4:
     resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
-    dev: false
 
   /listhen@1.9.0:
     resolution: {integrity: sha512-I8oW2+QL5KJo8zXNWX046M134WchxsXC7SawLPvRQpogCbkyQIaFxPE89A2HiwR7vAK2Dm2ERBAmyjTYGYEpBg==}
@@ -8210,7 +8545,6 @@ packages:
 
   /lru-cache@10.4.3:
     resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==}
-    dev: true
 
   /lru-cache@5.1.1:
     resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==}
@@ -8446,6 +8780,11 @@ packages:
     resolution: {integrity: sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==}
     dev: true
 
+  /media-typer@0.3.0:
+    resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==}
+    engines: {node: '>= 0.6'}
+    dev: true
+
   /merge-options@3.0.4:
     resolution: {integrity: sha512-2Sug1+knBjkaMsMgf1ctR1Ujx+Ayku4EdJN4Z+C2+JzoeF7A3OZ9KM2GY0CpQS51NR61LTurMJrRKPhSs3ZRTQ==}
     engines: {node: '>=10'}
@@ -8460,6 +8799,10 @@ packages:
   /merge2@1.4.1:
     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
     engines: {node: '>= 8'}
+
+  /methods@1.1.2:
+    resolution: {integrity: sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==}
+    engines: {node: '>= 0.6'}
     dev: true
 
   /micro-api-client@3.3.0:
@@ -8728,7 +9071,6 @@ packages:
     dependencies:
       braces: 3.0.3
       picomatch: 2.3.1
-    dev: true
 
   /mime-db@1.52.0:
     resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
@@ -8808,7 +9150,6 @@ packages:
     engines: {node: '>=16 || 14 >=14.17'}
     dependencies:
       brace-expansion: 2.0.2
-    dev: true
 
   /minimist@1.2.8:
     resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==}
@@ -8816,7 +9157,6 @@ packages:
   /minipass@7.1.2:
     resolution: {integrity: sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==}
     engines: {node: '>=16 || 14 >=14.17'}
-    dev: true
 
   /minizlib@3.0.2:
     resolution: {integrity: sha512-oG62iEk+CYt5Xj2YqI5Xi9xWUeZhDI8jjQmC5oThVH5JGCTgIjr7ciJDzC7MBzYd//WvR1OTmP5Q38Q8ShQtVA==}
@@ -8871,6 +9211,13 @@ packages:
     resolution: {integrity: sha512-TvmkNhkv8yct0SVBSy+o8wYzXjE4Zz3PCesbfs8HiCXXdcTuocApFv11UWlNFWKYsP2okqrhb7JNlSm9InBhIw==}
     dev: false
 
+  /mz@2.7.0:
+    resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
+    dependencies:
+      any-promise: 1.3.0
+      object-assign: 4.1.1
+      thenify-all: 1.6.0
+
   /nanoid@3.3.11:
     resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==}
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
@@ -8901,6 +9248,11 @@ packages:
     engines: {node: '>=18'}
     dev: true
 
+  /negotiator@0.6.3:
+    resolution: {integrity: sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==}
+    engines: {node: '>= 0.6'}
+    dev: true
+
   /neo-async@2.6.2:
     resolution: {integrity: sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==}
     dev: true
@@ -9119,7 +9471,6 @@ packages:
   /normalize-path@3.0.0:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
     engines: {node: '>=0.10.0'}
-    dev: true
 
   /normalize-range@0.1.2:
     resolution: {integrity: sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==}
@@ -9290,6 +9641,14 @@ packages:
       pkg-types: 2.2.0
       tinyexec: 1.0.1
 
+  /object-assign@4.1.1:
+    resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
+    engines: {node: '>=0.10.0'}
+
+  /object-hash@3.0.0:
+    resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==}
+    engines: {node: '>= 6'}
+
   /object-inspect@1.13.4:
     resolution: {integrity: sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==}
     engines: {node: '>= 0.4'}
@@ -9337,6 +9696,10 @@ packages:
       mimic-fn: 4.0.0
     dev: true
 
+  /only@0.0.2:
+    resolution: {integrity: sha512-Fvw+Jemq5fjjyWz6CpKx6w9s7xxqo3+JCyM0WXWeCSOboZ8ABkyvP8ID4CZuChA/wxSx+XSJmdOm8rGVyJ1hdQ==}
+    dev: true
+
   /open@10.2.0:
     resolution: {integrity: sha512-YgBpdJHPyQ2UE5x+hlSXcnejzAvD0b22U2OuAP+8OnlJT+PjWPxtgmGqKKc+RgTM63U9gN0YzrYc71R2WT/hTA==}
     engines: {node: '>=18'}
@@ -9347,6 +9710,14 @@ packages:
       wsl-utils: 0.1.0
     dev: true
 
+  /open@7.4.2:
+    resolution: {integrity: sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==}
+    engines: {node: '>=8'}
+    dependencies:
+      is-docker: 2.2.1
+      is-wsl: 2.2.0
+    dev: true
+
   /open@8.4.2:
     resolution: {integrity: sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==}
     engines: {node: '>=12'}
@@ -9497,7 +9868,6 @@ packages:
 
   /package-json-from-dist@1.0.1:
     resolution: {integrity: sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==}
-    dev: true
 
   /package-manager-detector@1.3.0:
     resolution: {integrity: sha512-ZsEbbZORsyHuO00lY1kV3/t72yp6Ysay6Pd17ZAlNGuGwmWDLCJxFpRs0IzfXfj1o4icJOkUEioexFHzyPurSQ==}
@@ -9580,10 +9950,14 @@ packages:
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
     dev: true
 
+  /path-is-absolute@1.0.1:
+    resolution: {integrity: sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==}
+    engines: {node: '>=0.10.0'}
+    dev: true
+
   /path-key@3.1.1:
     resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
     engines: {node: '>=8'}
-    dev: true
 
   /path-key@4.0.0:
     resolution: {integrity: sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==}
@@ -9599,6 +9973,9 @@ packages:
     dependencies:
       lru-cache: 10.4.3
       minipass: 7.1.2
+
+  /path-to-regexp@6.3.0:
+    resolution: {integrity: sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==}
     dev: true
 
   /path-type@4.0.0:
@@ -9644,12 +10021,15 @@ packages:
   /picomatch@2.3.1:
     resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
     engines: {node: '>=8.6'}
-    dev: true
 
   /picomatch@4.0.3:
     resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
     engines: {node: '>=12'}
 
+  /pify@2.3.0:
+    resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
+    engines: {node: '>=0.10.0'}
+
   /pinia-plugin-persistedstate@4.5.0(@pinia/nuxt@0.11.2)(pinia@3.0.3):
     resolution: {integrity: sha512-QTkP1xJVyCdr2I2p3AKUZM84/e+IS+HktRxKGAIuDzkyaKKV48mQcYkJFVVDuvTxlI5j6X3oZObpqoVB8JnWpw==}
     peerDependencies:
@@ -9684,6 +10064,10 @@ packages:
       typescript: 5.9.2
       vue: 3.5.18(typescript@5.9.2)
 
+  /pirates@4.0.7:
+    resolution: {integrity: sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==}
+    engines: {node: '>= 6'}
+
   /pkg-types@1.3.1:
     resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
     dependencies:
@@ -9715,6 +10099,16 @@ packages:
       yaml: 2.8.1
     dev: true
 
+  /portfinder@1.0.37:
+    resolution: {integrity: sha512-yuGIEjDAYnnOex9ddMnKZEMFE0CcGo6zbfzDklkmT1m5z734ss6JMzN9rNB3+RR7iS+F10D4/BVIaXOyh8PQKw==}
+    engines: {node: '>= 10.12'}
+    dependencies:
+      async: 3.2.6
+      debug: 4.4.1
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /postcss-calc@10.1.1(postcss@8.5.6):
     resolution: {integrity: sha512-NYEsLHh8DgG/PRH2+G9BTuUdtf9ViS+vdoQ0YA5OQdGsfN4ztiwtDWNtBl9EKeqNMFnIu8IKZ0cLxEQ5r5KVMw==}
     engines: {node: ^18.12 || ^20.9 || >=22.0}
@@ -9787,6 +10181,42 @@ packages:
       postcss: 8.5.6
     dev: true
 
+  /postcss-import@15.1.0(postcss@8.5.6):
+    resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      postcss: ^8.0.0
+    dependencies:
+      postcss: 8.5.6
+      postcss-value-parser: 4.2.0
+      read-cache: 1.0.0
+      resolve: 1.22.10
+
+  /postcss-js@4.0.1(postcss@8.5.6):
+    resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
+    engines: {node: ^12 || ^14 || >= 16}
+    peerDependencies:
+      postcss: ^8.4.21
+    dependencies:
+      camelcase-css: 2.0.1
+      postcss: 8.5.6
+
+  /postcss-load-config@4.0.2(postcss@8.5.6):
+    resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==}
+    engines: {node: '>= 14'}
+    peerDependencies:
+      postcss: '>=8.0.9'
+      ts-node: '>=9.0.0'
+    peerDependenciesMeta:
+      postcss:
+        optional: true
+      ts-node:
+        optional: true
+    dependencies:
+      lilconfig: 3.1.3
+      postcss: 8.5.6
+      yaml: 2.8.1
+
   /postcss-merge-longhand@7.0.5(postcss@8.5.6):
     resolution: {integrity: sha512-Kpu5v4Ys6QI59FxmxtNB/iHUVDn9Y9sYw66D6+SZoIk4QTz1prC4aYkhIESu+ieG1iylod1f8MILMs1Em3mmIw==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
@@ -9856,6 +10286,27 @@ packages:
       postcss-selector-parser: 7.1.0
     dev: true
 
+  /postcss-nested@6.2.0(postcss@8.5.6):
+    resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==}
+    engines: {node: '>=12.0'}
+    peerDependencies:
+      postcss: ^8.2.14
+    dependencies:
+      postcss: 8.5.6
+      postcss-selector-parser: 6.1.2
+
+  /postcss-nesting@13.0.2(postcss@8.5.6):
+    resolution: {integrity: sha512-1YCI290TX+VP0U/K/aFxzHzQWHWURL+CtHMSbex1lCdpXD1SoR2sYuxDu5aNI9lPoXpKTCggFZiDJbwylU0LEQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss: ^8.4
+    dependencies:
+      '@csstools/selector-resolve-nested': 3.1.0(postcss-selector-parser@7.1.0)
+      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.0)
+      postcss: 8.5.6
+      postcss-selector-parser: 7.1.0
+    dev: true
+
   /postcss-normalize-charset@7.0.1(postcss@8.5.6):
     resolution: {integrity: sha512-sn413ofhSQHlZFae//m9FTOfkmiZ+YQXsbosqOWRiVQncU2BA3daX3n0VF3cG6rGLSFVc5Di/yns0dFfh8NFgQ==}
     engines: {node: ^18.12.0 || ^20.9.0 || >=22.0}
@@ -9984,7 +10435,6 @@ packages:
     dependencies:
       cssesc: 3.0.0
       util-deprecate: 1.0.2
-    dev: true
 
   /postcss-selector-parser@7.1.0:
     resolution: {integrity: sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==}
@@ -10017,7 +10467,6 @@ packages:
 
   /postcss-value-parser@4.2.0:
     resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
-    dev: true
 
   /postcss-values-parser@6.0.2(postcss@8.5.6):
     resolution: {integrity: sha512-YLJpK0N1brcNJrs9WatuJFtHaV9q5aAOj+S4DI5S7jgHlRfm0PIbDCAFRYMQD5SHq7Fy6xsDhyutgS0QOAs0qw==}
@@ -10198,7 +10647,6 @@ packages:
 
   /queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
-    dev: true
 
   /quickselect@2.0.0:
     resolution: {integrity: sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw==}
@@ -10249,6 +10697,11 @@ packages:
       defu: 6.1.4
       destr: 2.0.5
 
+  /read-cache@1.0.0:
+    resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
+    dependencies:
+      pify: 2.3.0
+
   /read-package-up@11.0.0:
     resolution: {integrity: sha512-MbgfoNPANMdb4oRBNg5eqLbB2t2r+o5Ua1pNt8BqGp4I0FJZhuVSOj3PaBPni4azWuSzEdNn2evevzVmEk1ohQ==}
     engines: {node: '>=18'}
@@ -10312,7 +10765,6 @@ packages:
     engines: {node: '>=8.10.0'}
     dependencies:
       picomatch: 2.3.1
-    dev: true
 
   /readdirp@4.1.2:
     resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==}
@@ -10357,31 +10809,20 @@ packages:
       jsesc: 3.0.2
     dev: true
 
-  /reka-ui@2.4.1(typescript@5.9.2)(vue@3.5.18):
-    resolution: {integrity: sha512-NB7DrCsODN8MH02BWtgiExygfFcuuZ5/PTn6fMgjppmFHqePvNhmSn1LEuF35nel6PFbA4v+gdj0IoGN1yZ+vw==}
-    peerDependencies:
-      vue: '>= 3.2.0'
-    dependencies:
-      '@floating-ui/dom': 1.7.3
-      '@floating-ui/vue': 1.1.8(vue@3.5.18)
-      '@internationalized/date': 3.8.2
-      '@internationalized/number': 3.6.4
-      '@tanstack/vue-virtual': 3.13.12(vue@3.5.18)
-      '@vueuse/core': 12.8.2(typescript@5.9.2)
-      '@vueuse/shared': 12.8.2(typescript@5.9.2)
-      aria-hidden: 1.2.6
-      defu: 6.1.4
-      ohash: 2.0.11
-      vue: 3.5.18(typescript@5.9.2)
-    transitivePeerDependencies:
-      - '@vue/composition-api'
-      - typescript
-    dev: false
-
   /remove-trailing-separator@1.1.0:
     resolution: {integrity: sha512-/hS+Y0u3aOfIETiaiirUFwDBDzmXPvO+jAfKTitUngIPzdKc6Z0LoFjM/CK5PL4C+eKwHohlHAb6H0VFfmmUsw==}
     dev: true
 
+  /replace-in-file@6.3.5:
+    resolution: {integrity: sha512-arB9d3ENdKva2fxRnSjwBEXfK1npgyci7ZZuwysgAp7ORjHSyxz6oqIjTEv8R0Ydl4Ll7uOAZXL4vbkhGIizCg==}
+    engines: {node: '>=10'}
+    hasBin: true
+    dependencies:
+      chalk: 4.1.2
+      glob: 7.2.3
+      yargs: 17.7.2
+    dev: true
+
   /require-directory@2.1.1:
     resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==}
     engines: {node: '>=0.10.0'}
@@ -10405,6 +10846,14 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
+  /resolve-path@1.4.0:
+    resolution: {integrity: sha512-i1xevIst/Qa+nA9olDxLWnLk8YZbi8R/7JPbCMcgyWaFR6bKWaexgJgEB5oc2PKMjYdrHynyz0NY+if+H98t1w==}
+    engines: {node: '>= 0.8'}
+    dependencies:
+      http-errors: 1.6.3
+      path-is-absolute: 1.0.1
+    dev: true
+
   /resolve-pkg-maps@1.0.0:
     resolution: {integrity: sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==}
     dev: true
@@ -10436,7 +10885,6 @@ packages:
   /reusify@1.1.0:
     resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==}
     engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
-    dev: true
 
   /rfdc@1.4.1:
     resolution: {integrity: sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==}
@@ -10504,7 +10952,6 @@ packages:
     resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
     dependencies:
       queue-microtask: 1.2.3
-    dev: true
 
   /rw@1.3.3:
     resolution: {integrity: sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==}
@@ -10518,6 +10965,15 @@ packages:
     resolution: {integrity: sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==}
     dev: true
 
+  /safe-regex-test@1.1.0:
+    resolution: {integrity: sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==}
+    engines: {node: '>= 0.4'}
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      is-regex: 1.2.1
+    dev: true
+
   /safe-stable-stringify@2.5.0:
     resolution: {integrity: sha512-b3rppTKm9T+PsVCBEOUR46GWI7fdOs00VKZ1+9c1EWDaDMvjQc6tUwuFyIprgGgTcWoVHSKrU8H31ZHA2e0RHA==}
     engines: {node: '>=10'}
@@ -10606,6 +11062,10 @@ packages:
       - supports-color
     dev: true
 
+  /setprototypeof@1.1.0:
+    resolution: {integrity: sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ==}
+    dev: true
+
   /setprototypeof@1.2.0:
     resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==}
     dev: true
@@ -10624,12 +11084,10 @@ packages:
     engines: {node: '>=8'}
     dependencies:
       shebang-regex: 3.0.0
-    dev: true
 
   /shebang-regex@3.0.0:
     resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
     engines: {node: '>=8'}
-    dev: true
 
   /shell-quote@1.8.3:
     resolution: {integrity: sha512-ObmnIF4hXNg1BqhnHmgbDETF8dLPCggZWBjkQfhZpbszZnYur5DUljTcCHii5LC3J5E0yeO/1LIMyH+UvHQgyw==}
@@ -10683,7 +11141,6 @@ packages:
   /signal-exit@4.1.0:
     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
     engines: {node: '>=14'}
-    dev: true
 
   /simple-git@3.28.0:
     resolution: {integrity: sha512-Rs/vQRwsn1ILH1oBUy8NucJlXmnnLeLCfcvbSehkPzbv3wwoFWIdtfd6Ndo6ZPhlPsCZ60CPI4rxurnwAa+a2w==}
@@ -10799,6 +11256,11 @@ packages:
     resolution: {integrity: sha512-qoRRSyROncaz1z0mvYqIE4lCd9p2R90i6GxW3uZv5ucSu8tU7B5HXUP1gG8pVZsYNVaXjk8ClXHPttLyxAL48A==}
     dev: true
 
+  /statuses@1.5.0:
+    resolution: {integrity: sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA==}
+    engines: {node: '>= 0.6'}
+    dev: true
+
   /statuses@2.0.1:
     resolution: {integrity: sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==}
     engines: {node: '>= 0.8'}
@@ -10828,7 +11290,6 @@ packages:
       emoji-regex: 8.0.0
       is-fullwidth-code-point: 3.0.0
       strip-ansi: 6.0.1
-    dev: true
 
   /string-width@5.1.2:
     resolution: {integrity: sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==}
@@ -10837,7 +11298,6 @@ packages:
       eastasianwidth: 0.2.0
       emoji-regex: 9.2.2
       strip-ansi: 7.1.0
-    dev: true
 
   /string_decoder@1.1.1:
     resolution: {integrity: sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==}
@@ -10856,14 +11316,12 @@ packages:
     engines: {node: '>=8'}
     dependencies:
       ansi-regex: 5.0.1
-    dev: true
 
   /strip-ansi@7.1.0:
     resolution: {integrity: sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==}
     engines: {node: '>=12'}
     dependencies:
       ansi-regex: 6.1.0
-    dev: true
 
   /strip-final-newline@3.0.0:
     resolution: {integrity: sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==}
@@ -10910,6 +11368,19 @@ packages:
     resolution: {integrity: sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==}
     dev: false
 
+  /sucrase@3.35.0:
+    resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==}
+    engines: {node: '>=16 || 14 >=14.17'}
+    hasBin: true
+    dependencies:
+      '@jridgewell/gen-mapping': 0.3.13
+      commander: 4.1.1
+      glob: 10.4.5
+      lines-and-columns: 1.2.4
+      mz: 2.7.0
+      pirates: 4.0.7
+      ts-interface-checker: 0.1.13
+
   /supercluster@7.1.5:
     resolution: {integrity: sha512-EulshI3pGUM66o6ZdH3ReiFcvHpM3vAigyK+vcxdjpJyEbIIrtbmBdY23mGgnI24uXiGFvrGq9Gkum/8U7vJWg==}
     dependencies:
@@ -10979,10 +11450,68 @@ packages:
     engines: {node: '>=18'}
     dev: true
 
+  /tailwind-config-viewer@2.0.4(tailwindcss@3.4.17):
+    resolution: {integrity: sha512-icvcmdMmt9dphvas8wL40qttrHwAnW3QEN4ExJ2zICjwRsPj7gowd1cOceaWG3IfTuM/cTNGQcx+bsjMtmV+cw==}
+    engines: {node: '>=13'}
+    hasBin: true
+    peerDependencies:
+      tailwindcss: 1 || 2 || 2.0.1-compat || 3
+    dependencies:
+      '@koa/router': 12.0.2
+      commander: 6.2.1
+      fs-extra: 9.1.0
+      koa: 2.16.2
+      koa-static: 5.0.0
+      open: 7.4.2
+      portfinder: 1.0.37
+      replace-in-file: 6.3.5
+      tailwindcss: 3.4.17
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /tailwind-merge@2.6.0:
     resolution: {integrity: sha512-P+Vu1qXfzediirmHOC3xKGAYeZtPcV9g76X+xg2FD4tYgR71ewMA35Y3sCz3zhiN/dwefRpJX0yBcgwi1fXNQA==}
     dev: true
 
+  /tailwindcss-animate@1.0.7(tailwindcss@3.4.17):
+    resolution: {integrity: sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==}
+    peerDependencies:
+      tailwindcss: '>=3.0.0 || insiders'
+    dependencies:
+      tailwindcss: 3.4.17
+    dev: false
+
+  /tailwindcss@3.4.17:
+    resolution: {integrity: sha512-w33E2aCvSDP0tW9RZuNXadXlkHXqFzSkQew/aIa2i/Sj8fThxwovwlXHSPXTbAHwEIhBFXAedUhP2tueAKP8Og==}
+    engines: {node: '>=14.0.0'}
+    hasBin: true
+    dependencies:
+      '@alloc/quick-lru': 5.2.0
+      arg: 5.0.2
+      chokidar: 3.6.0
+      didyoumean: 1.2.2
+      dlv: 1.1.3
+      fast-glob: 3.3.3
+      glob-parent: 6.0.2
+      is-glob: 4.0.3
+      jiti: 1.21.7
+      lilconfig: 3.1.3
+      micromatch: 4.0.8
+      normalize-path: 3.0.0
+      object-hash: 3.0.0
+      picocolors: 1.1.1
+      postcss: 8.5.6
+      postcss-import: 15.1.0(postcss@8.5.6)
+      postcss-js: 4.0.1(postcss@8.5.6)
+      postcss-load-config: 4.0.2(postcss@8.5.6)
+      postcss-nested: 6.2.0(postcss@8.5.6)
+      postcss-selector-parser: 6.1.2
+      resolve: 1.22.10
+      sucrase: 3.35.0
+    transitivePeerDependencies:
+      - ts-node
+
   /tapable@2.2.2:
     resolution: {integrity: sha512-Re10+NauLTMCudc7T5WLFLAwDhQ0JWdrMK+9B2M8zR5hRExKmsRDCBA7/aV/pNJFltmBFO5BAMlQFi/vq3nKOg==}
     engines: {node: '>=6'}
@@ -11054,6 +11583,17 @@ packages:
     resolution: {integrity: sha512-uuVGNWzgJ4yhRaNSiubPY7OjISw4sw4E5Uv0wbjp+OzcbmVU/rsT8ujgcXJhn9ypzsgr5vlzpPqP+MBBKcGvbg==}
     dev: true
 
+  /thenify-all@1.6.0:
+    resolution: {integrity: sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==}
+    engines: {node: '>=0.8'}
+    dependencies:
+      thenify: 3.3.1
+
+  /thenify@3.3.1:
+    resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==}
+    dependencies:
+      any-promise: 1.3.0
+
   /three@0.135.0:
     resolution: {integrity: sha512-kuEpuuxRzLv0MDsXai9huCxOSQPZ4vje6y0gn80SRmQvgz6/+rI0NAvCRAw56zYaWKMGMfqKWsxF9Qa2Z9xymQ==}
     dev: false
@@ -11126,7 +11666,6 @@ packages:
     engines: {node: '>=8.0'}
     dependencies:
       is-number: 7.0.0
-    dev: true
 
   /toidentifier@1.0.1:
     resolution: {integrity: sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==}
@@ -11183,9 +11722,17 @@ packages:
       typescript: 5.9.2
     dev: true
 
+  /ts-interface-checker@0.1.13:
+    resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
+
   /tslib@2.8.1:
     resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
 
+  /tsscmp@1.0.6:
+    resolution: {integrity: sha512-LxhtAkPDTkVCMQjt2h6eBVY28KCjikZqZfMcC15YBeNjkgUpdCfBu5HoiOTDu86v6smE8yOjyEktJ8hlbANHQA==}
+    engines: {node: '>=0.6.x'}
+    dev: true
+
   /type-check@0.4.0:
     resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
     engines: {node: '>= 0.8.0'}
@@ -11198,6 +11745,14 @@ packages:
     engines: {node: '>=16'}
     dev: true
 
+  /type-is@1.6.18:
+    resolution: {integrity: sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==}
+    engines: {node: '>= 0.6'}
+    dependencies:
+      media-typer: 0.3.0
+      mime-types: 2.1.35
+    dev: true
+
   /type-level-regexp@0.1.17:
     resolution: {integrity: sha512-wTk4DH3cxwk196uGLK/E9pE45aLfeKJacKmcEgEOA/q5dnPGNxXt0cfYdFxb57L+sEpf1oJH4Dnx/pnRcku9jg==}
     dev: true
@@ -11315,6 +11870,11 @@ packages:
       unist-util-visit-parents: 6.0.1
     dev: true
 
+  /universalify@2.0.1:
+    resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==}
+    engines: {node: '>= 10.0.0'}
+    dev: true
+
   /unixify@1.0.0:
     resolution: {integrity: sha512-6bc58dPYhCMHHuwxldQxO3RRNZ4eCogZ/st++0+fcC1nr0jiGUtAdBJ2qzmLQWSxbtz42pWt4QQMiZ9HvZf5cg==}
     engines: {node: '>=0.10.0'}
@@ -11596,7 +12156,6 @@ packages:
 
   /util-deprecate@1.0.2:
     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
-    dev: true
 
   /uuid@11.1.0:
     resolution: {integrity: sha512-0/A9rDy9P7cJ+8w1c9WD9V//9Wj15Ce2MPz8Ri6032usz+NfePxx5AcN3bN+r6ZL6jEo066/yNYB3tn4pQEx+A==}
@@ -11610,6 +12169,11 @@ packages:
       spdx-expression-parse: 3.0.1
     dev: true
 
+  /vary@1.1.2:
+    resolution: {integrity: sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==}
+    engines: {node: '>= 0.8'}
+    dev: true
+
   /vaul-vue@0.2.1(radix-vue@1.9.17)(vue@3.5.18):
     resolution: {integrity: sha512-iF91R1JQZzxb9mb9uGNHYv8rVFxR5bL5Fj51iqvyXjzMPAzNMciCrXb9OUBu2NdlhcF6rVtEADXnQoTY+pKIeA==}
     peerDependencies:
@@ -11937,6 +12501,7 @@ packages:
         optional: true
     dependencies:
       vue: 3.5.18(typescript@5.9.2)
+    dev: true
 
   /vue-devtools-stub@0.1.0:
     resolution: {integrity: sha512-RutnB7X8c5hjq39NceArgXg28WZtZpGc3+J16ljMiYnFhKvd8hITxSWQSQ5bvldxMDU6gG5mkxl1MTQLXckVSQ==}
@@ -12093,7 +12658,6 @@ packages:
     hasBin: true
     dependencies:
       isexe: 2.0.0
-    dev: true
 
   /which@5.0.0:
     resolution: {integrity: sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==}
@@ -12150,7 +12714,6 @@ packages:
       ansi-styles: 4.3.0
       string-width: 4.2.3
       strip-ansi: 6.0.1
-    dev: true
 
   /wrap-ansi@8.1.0:
     resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==}
@@ -12159,7 +12722,6 @@ packages:
       ansi-styles: 6.2.1
       string-width: 5.1.2
       strip-ansi: 7.1.0
-    dev: true
 
   /wrappy@1.0.2:
     resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
@@ -12229,7 +12791,6 @@ packages:
     resolution: {integrity: sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==}
     engines: {node: '>= 14.6'}
     hasBin: true
-    dev: true
 
   /yargs-parser@21.1.1:
     resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==}
@@ -12256,6 +12817,11 @@ packages:
       fd-slicer: 1.1.0
     dev: true
 
+  /ylru@1.4.0:
+    resolution: {integrity: sha512-2OQsPNEmBCvXuFlIni/a+Rn+R2pHW9INm0BxXJ4hVDA8TirqMj+J/Rp9ItLatT/5pZqWwefVrTQcHpixsxnVlA==}
+    engines: {node: '>= 4.0.0'}
+    dev: true
+
   /yocto-queue@0.1.0:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
     engines: {node: '>=10'}
diff --git a/server/api/v1/satusehat/list.post.ts b/server/api/v1/satusehat/list.post.ts
new file mode 100644
index 00000000..7f840863
--- /dev/null
+++ b/server/api/v1/satusehat/list.post.ts
@@ -0,0 +1,171 @@
+export default defineEventHandler(async (event) => {
+  const body = await readBody(event)
+  
+  // Mock data lengkap
+  const mockData = [
+    {
+      id: 'RSC001',
+      resource_type: 'Encounter',
+      patient: {
+        name: 'Ahmad Wepe',
+        mrn: 'RM001234',
+      },
+      status: 2, // 0: failed, 1: pending, 2: success
+      updated_at: '2025-01-15',
+      fhir_id: 'ENC-00123',
+    },
+    {
+      id: 'RSC002',
+      resource_type: 'Patient',
+      patient: {
+        name: 'Siti Aminah',
+        mrn: 'RM001235',
+      },
+      status: 1,
+      updated_at: '2025-01-10',
+      fhir_id: 'PAT-001235',
+    },
+    {
+      id: 'RSC003',
+      resource_type: 'Observation',
+      patient: {
+        name: 'Budi Antono',
+        mrn: 'RM001236',
+      },
+      status: 0,
+      updated_at: '2025-01-11',
+      fhir_id: 'OBS-001236',
+    },
+    {
+      id: 'RSC004',
+      resource_type: 'Encounter',
+      patient: {
+        name: 'Maria Sari',
+        mrn: 'RM001237',
+      },
+      status: 2,
+      updated_at: '2025-01-12',
+      fhir_id: 'ENC-001237',
+    },
+    {
+      id: 'RSC005',
+      resource_type: 'Patient',
+      patient: {
+        name: 'Joko Widodo',
+        mrn: 'RM001238',
+      },
+      status: 1,
+      updated_at: '2025-01-13',
+      fhir_id: 'PAT-001238',
+    },
+    {
+      id: 'RSC006',
+      resource_type: 'Observation',
+      patient: {
+        name: 'Dewi Sartika',
+        mrn: 'RM001239',
+      },
+      status: 2,
+      updated_at: '2025-01-14',
+      fhir_id: 'OBS-001239',
+    },
+    {
+      id: 'RSC007',
+      resource_type: 'Encounter',
+      patient: {
+        name: 'Rudi Hartono',
+        mrn: 'RM001240',
+      },
+      status: 0,
+      updated_at: '2025-01-16',
+      fhir_id: 'ENC-001240',
+    },
+    {
+      id: 'RSC008',
+      resource_type: 'Patient',
+      patient: {
+        name: 'Sri Mulyani',
+        mrn: 'RM001241',
+      },
+      status: 2,
+      updated_at: '2025-01-17',
+      fhir_id: 'PAT-001241',
+    }
+  ]
+
+  // Ekstrak parameter filter dari request body
+  const {
+    status,
+    resource_type,
+    date_from,
+    date_to,
+    search,
+    page = 1,
+    limit = 10
+  } = body
+
+  let filteredData = [...mockData]
+
+  // Filter berdasarkan status
+  if (status !== undefined && status !== null && status !== '') {
+    filteredData = filteredData.filter(item => item.status === Number(status))
+  }
+
+  // Filter berdasarkan resource_type (transaction type)
+  if (resource_type && resource_type !== 'all') {
+    filteredData = filteredData.filter(item => 
+      item.resource_type.toLowerCase() === resource_type.toLowerCase()
+    )
+  }
+
+  // Filter berdasarkan rentang tanggal
+  if (date_from) {
+    filteredData = filteredData.filter(item => 
+      new Date(item.updated_at) >= new Date(date_from)
+    )
+  }
+
+  if (date_to) {
+    filteredData = filteredData.filter(item => 
+      new Date(item.updated_at) <= new Date(date_to)
+    )
+  }
+
+  // Filter berdasarkan pencarian nama pasien atau MRN
+  if (search) {
+    filteredData = filteredData.filter(item => 
+      item.patient.name.toLowerCase().includes(search.toLowerCase()) ||
+      item.patient.mrn.toLowerCase().includes(search.toLowerCase()) ||
+      item.fhir_id.toLowerCase().includes(search.toLowerCase())
+    )
+  }
+
+  // Pagination
+  const totalItems = filteredData.length
+  const totalPages = Math.ceil(totalItems / limit)
+  const offset = (page - 1) * limit
+  const paginatedData = filteredData.slice(offset, offset + limit)
+
+  // Simulasi delay untuk loading state
+  await new Promise(resolve => setTimeout(resolve, 300))
+
+  return {
+    success: true,
+    data: paginatedData,
+    meta: {
+      total: totalItems,
+      page: Number(page),
+      limit: Number(limit),
+      total_pages: totalPages,
+      has_next: page < totalPages,
+      has_prev: page > 1
+    },
+    filters: {
+      status,
+      resource_type,
+      date_from,
+      date_to,
+      search
+    }
+  }
+})
diff --git a/tailwind.config.ts b/tailwind.config.ts
new file mode 100644
index 00000000..3b037e25
--- /dev/null
+++ b/tailwind.config.ts
@@ -0,0 +1,86 @@
+import animate from 'tailwindcss-animate'
+
+/** @type {import('tailwindcss').Config} */
+export default {
+  darkMode: ['class'],
+  safelist: ['dark'],
+  prefix: '',
+
+  theme: {
+    container: {
+      center: true,
+      padding: '2rem',
+      screens: {
+        '2xl': '1400px',
+      },
+    },
+    extend: {
+      colors: {
+        border: 'hsl(var(--border))',
+        input: 'hsl(var(--input))',
+        ring: 'hsl(var(--ring))',
+        background: 'hsl(var(--background))',
+        foreground: 'hsl(var(--foreground))',
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
+        secondary: {
+          DEFAULT: 'hsl(var(--secondary))',
+          foreground: 'hsl(var(--secondary-foreground))',
+        },
+        destructive: {
+          DEFAULT: 'hsl(var(--destructive))',
+          foreground: 'hsl(var(--destructive-foreground))',
+        },
+        muted: {
+          DEFAULT: 'hsl(var(--muted))',
+          foreground: 'hsl(var(--muted-foreground))',
+        },
+        accent: {
+          DEFAULT: 'hsl(var(--accent))',
+          foreground: 'hsl(var(--accent-foreground))',
+        },
+        popover: {
+          DEFAULT: 'hsl(var(--popover))',
+          foreground: 'hsl(var(--popover-foreground))',
+        },
+        card: {
+          DEFAULT: 'hsl(var(--card))',
+          foreground: 'hsl(var(--card-foreground))',
+        },
+      },
+      borderRadius: {
+        xl: 'calc(var(--radius) + 4px)',
+        lg: 'var(--radius)',
+        md: 'calc(var(--radius) - 2px)',
+        sm: 'calc(var(--radius) - 4px)',
+      },
+      keyframes: {
+        'accordion-down': {
+          from: { height: 0 },
+          to: { height: 'var(--radix-accordion-content-height)' },
+        },
+        'accordion-up': {
+          from: { height: 'var(--radix-accordion-content-height)' },
+          to: { height: 0 },
+        },
+        'collapsible-down': {
+          from: { height: 0 },
+          to: { height: 'var(--radix-collapsible-content-height)' },
+        },
+        'collapsible-up': {
+          from: { height: 'var(--radix-collapsible-content-height)' },
+          to: { height: 0 },
+        },
+      },
+      animation: {
+        'accordion-down': 'accordion-down 0.2s ease-out',
+        'accordion-up': 'accordion-up 0.2s ease-out',
+        'collapsible-down': 'collapsible-down 0.2s ease-in-out',
+        'collapsible-up': 'collapsible-up 0.2s ease-in-out',
+      },
+    },
+  },
+  plugins: [animate],
+}
diff --git a/uno.config.ts b/uno.config.ts
index fb109dd6..a34f3725 100644
--- a/uno.config.ts
+++ b/uno.config.ts
@@ -29,4 +29,5 @@ export default defineConfig({
   rules: [
     // Custom rules if needed
   ],
+  inspector: true,
 })