@extends('layouts.base')
@section('heading')
    SIMPLE WORKFLOW MODELER
@endsection

@section('info')
        WORKFLOW MODELER
@endsection
@section('focus_action')
{{-- <span>
    <div class="mt-6_"  x-data="{ open: false }">
        <!-- Button (blue), duh! -->
        <div class="text-sm text-blue-500 hover:text-blue-700"  @click="open = true">
            ADD A NEW PROCESS INSTANCE
        </div>
        <!-- Dialog (full screen) -->

        <div class="absolute top-0 left-0 flex items-center justify-center w-full h-full" style="background-color: rgba(0,0,0,.5);z-index:1" x-show="open">
            <!-- A basic modal dialog with title, body and one button to close -->
            <div class="h-auto p-4 mx-2 text-left bg-white rounded shadow-xl m-auto" @click.away="open = false">
                <div class="mt-3 text-center sm:mt-0 sm:ml-4_ sm:text-left">
                    <div class="text-lg font-medium leading-6 text-gray-900 uppercase mb-2">
                        Add a business key to complete your task (optional)
                    </div>
                    <div>
                        <form action="{{ route('processes.newInstance', ['processDefinitionId' => $process->id]) }}" method="get">
                            @csrf
                                <div>
                                    <label for="business_key" class="block">Business Key</label>
                                    <input type="text" id="business_key" name="business_key" placeholder="Enter a business key" required="required">
                                </div>
                            <input type="hidden" name="variables" id="variables">

                            <div class="mt-4">

                                <button type="submit" class="inline-flex justify-center w-full px-4 py-2 text-white bg-blue-500 rounded hover:bg-blue-700">
                                    ADD PROCESS
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</span> --}}
@endsection
@section('body')
    <div class="m-auto_ py-6_ grid_ place-content-center_" style="height: 75vh">

        <div class="w-full h-full">
            <div id="" class="w-full h-full"><iframe src="{{ route('bpmn.modeler.v2') }}" class="w-full h-full"></iframe></div>
        </div>
    </div>
@endsection