<template>
  <div class="rounded-lg border border-slate-200 bg-white shadow">
    <div class="border-b border-slate-200 px-4 py-3 text-sm font-semibold text-slate-700">
      Process Graph Editor
    </div>
    <iframe
      class="h-[640px] w-full"
      :src="editorUrl"
      title="AI Process Builder"
    />
  </div>
</template>

<script setup lang="ts">
const config = useRuntimeConfig()
const editorUrl = computed(() =>
  config.public.aiProcessEditorUrl || 'http://localhost:5174'
)
</script>
