<?php

declare(strict_types=1);

$fieldId      = (int) ($field['id'] ?? 0);
$fieldType    = strtolower((string) ($field['field_type'] ?? 'text'));
$fieldLabel   = (string) ($field['field_label'] ?? '');
$placeholder  = (string) ($field['placeholder'] ?? '');
$helpText     = (string) ($field['help_text'] ?? '');
$required     = !empty($field['is_required']);
$width        = (int) ($field['column_width'] ?? 12);
$defaultValue = (string) ($field['default_value'] ?? '');
$validation   = (string) ($field['validation_rules'] ?? '{}');
$options      = $fieldOptions[$fieldId] ?? [];
?>

<div
    class="col-md-<?= $width ?> sortable-field"
    data-field-id="<?= $fieldId ?>">

    <div class="designer-field-card shadow-sm">

        <div class="field-card-toolbar">

            <div>

                <strong><?= htmlspecialchars($fieldLabel) ?></strong>

                <?php if ($required): ?>

                    <span class="text-danger">*</span>

                <?php endif; ?>

            </div>

            <div class="btn-group btn-group-sm">

                <button
                    type="button"
                    class="btn btn-outline-primary edit-field-btn"

                    data-id="<?= $fieldId ?>"

                    data-field-type="<?= htmlspecialchars($fieldType) ?>"

                    data-label="<?= htmlspecialchars($fieldLabel) ?>"

                    data-placeholder="<?= htmlspecialchars($placeholder) ?>"

                    data-help-text="<?= htmlspecialchars($helpText) ?>"

                    data-default-value="<?= htmlspecialchars($defaultValue) ?>"

                    data-required="<?= $required ? 1 : 0 ?>"

                    data-column-width="<?= $width ?>"

                    data-validation-rules="<?= htmlspecialchars($validation, ENT_QUOTES) ?>">

                    <i class="bi bi-pencil"></i>

                </button>

<form
    method="POST"
    action="/public/dynamic-forms/fields/deactivate"
    class="delete-field-form d-inline">

    <input
        type="hidden"
        name="id"
        value="<?= $fieldId ?>">

    <input
        type="hidden"
        name="form_id"
        value="<?= $formId ?>">

    <button
        type="submit"
        class="btn btn-outline-danger btn-sm delete-field-btn"
        title="Remove Field">

        <i class="bi bi-trash"></i>

    </button>

</form>

            </div>

        </div>

        <div class="field-preview">
            <?php

switch ($fieldType):

case 'text':
?>

<input
    class="form-control"
    type="text"
    placeholder="<?= htmlspecialchars($placeholder) ?>"
    value="<?= htmlspecialchars($defaultValue) ?>"
    disabled>

<?php
break;

case 'textarea':
?>

<textarea
    class="form-control"
    rows="3"
    placeholder="<?= htmlspecialchars($placeholder) ?>"
    disabled><?= htmlspecialchars($defaultValue) ?></textarea>

<?php
break;

case 'number':
?>

<input
    class="form-control"
    type="number"
    value="<?= htmlspecialchars($defaultValue) ?>"
    disabled>

<?php
break;

case 'date':
?>

<input
    class="form-control"
    type="date"
    disabled>

<?php
break;

case 'time':
?>

<input
    class="form-control"
    type="time"
    disabled>

<?php
break;

case 'email':
?>

<input
    class="form-control"
    type="email"
    placeholder="<?= htmlspecialchars($placeholder) ?>"
    disabled>

<?php
break;

case 'phone':
?>

<input
    class="form-control"
    type="tel"
    placeholder="<?= htmlspecialchars($placeholder) ?>"
    disabled>

<?php
break;

case 'file':
?>

<input
    class="form-control"
    type="file"
    disabled>

<?php
break;

case 'select':
?>

<select class="form-select" disabled>

    <option>Select...</option>

    <?php foreach ($options as $option): ?>

        <option><?= htmlspecialchars($option['option_label']) ?></option>

    <?php endforeach; ?>

</select>

<?php
break;

case 'radio':

foreach ($options as $option):
?>

<div class="form-check">

    <input
        class="form-check-input"
        type="radio"
        disabled>

    <label class="form-check-label">

        <?= htmlspecialchars($option['option_label']) ?>

    </label>

</div>

<?php
endforeach;

break;

case 'checkbox':

foreach ($options as $option):
?>

<div class="form-check">

    <input
        class="form-check-input"
        type="checkbox"
        disabled>

    <label class="form-check-label">

        <?= htmlspecialchars($option['option_label']) ?>

    </label>

</div>

<?php
endforeach;

break;

endswitch;
?>
<?php if ($helpText !== ''): ?>

    <div class="field-help">

        <?= nl2br(htmlspecialchars($helpText)) ?>

    </div>

<?php endif; ?>

        </div>

    </div>

</div>