Frame with ghost(no outer border) variant

<script setup lang="ts">
import { Frame, FrameDescription, FrameHeader, FramePanel, FrameTitle } from "@/components/reui/frame"
</script>

<template>
  <Frame class="w-full" variant="ghost">
    <FrameHeader>
      <FrameTitle>No Outer Border</FrameTitle>
      <FrameDescription>
        This frame uses variant="ghost" to remove the outer border.
      </FrameDescription>
    </FrameHeader>
    <FramePanel>
      <p class="text-muted-foreground text-sm">
        The outer container of this frame has no border, only the background
        and panels are visible.
      </p>
    </FramePanel>
  </Frame>
</template>