Mind-Vision-Code/app/Views/employees/create.php

<section class="content-stack" x-data="employeeDirectory()">
    <div class="section-heading">
        <span class="eyebrow"><?= e($model->eyebrow) ?></span>
        <h1><?= e($model->title) ?></h1>
        <p><?= e($model->intro) ?></p>
    </div>

    <section class="section-panel controls-panel">
        <div class="panel-header controls-header">
            <div>
                <h2>Employee Workspace</h2>
                <p>Use htmx for server updates, Alpine for page state, and Tabulator for a richer table experience.</p>
            </div>

            <button class="button button-secondary" type="button" x-on:click="reloadTable()">Refresh Table</button>
        </div>

        <div class="search-row">
            <label class="field field-full">
                <span>Search employees</span>
                <input
                    id="employee-search"
                    class="input"
                    type="search"
                    name="search"
                    placeholder="Search by name, email, department, title, or date"
                    x-model.debounce.300ms="search"
                    x-on:input.debounce.300ms="applySearch()"
                    value="<?= e($model->search) ?>"
                >
            </label>
        </div>
    </section>

    <div class="employee-layout">
        <div id="employee-form-panel">
            <?php require __DIR__ . '/partials/form.php'; ?>
        </div>

        <section class="section-panel table-shell directory-panel">
            <div class="panel-header">
                <h2>Employee Directory Table</h2>
                <p>Browse, search, and sort all employees in one place. The table refreshes after new employee records are saved.</p>
            </div>

            <div class="table-toolbar">
                <span class="table-pill">HTMX + Alpine + Tabulator</span>
                <span class="table-caption">Live data endpoint: <code>/employees/data</code></span>
            </div>

            <div id="employee-table" class="tabulator-host"></div>
        </section>
    </div>
</section>