boursecu_admin/src/components/mobile/MobileSheetHeader.vue

<template>
  <div class="space-y-3">
    <div class="flex items-start justify-between gap-2">
      <div class="min-w-0 flex-1 space-y-1">
        <div v-if="showTitle" class="text-lg font-700 text-gray-900">
          <slot name="title">{{ title }}</slot>
        </div>
        <div v-if="subtitle || $slots.subtitle" class="text-xs text-gray-500">
          <slot name="subtitle">{{ subtitle }}</slot>
        </div>
      </div>
      <div
        v-if="$slots.actions"
        class="flex shrink-0 flex-wrap items-center justify-end gap-1"
      >
        <slot name="actions" />
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
withDefaults(
  defineProps<{
    title?: string
    subtitle?: string
    showTitle?: boolean
  }>(),
  {
    showTitle: true
  }
)
</script>