<app-modal-shell title="Add Student" (closed)="cancelled.emit()">
    <div class="field">
        <label class="field-label">Name</label>
        <input class="field-input" type="text" [(ngModel)]="form.identifier"
            placeholder="Initials or other non-personally identifiable label" />
    </div>
    <div class="field">
        <label class="field-label">Next IEP Date</label>
        <input class="field-input" type="date" [(ngModel)]="form.nextIepDate" />
    </div>

    @if (errorMessage()) {
    <p class="error">{{ errorMessage() }}</p>
    }

    <div class="modal-actions">
        <button class="btn-secondary" (click)="cancelled.emit()">Cancel</button>
        <button class="btn-primary" (click)="onSubmit()" [disabled]="isSubmitting() || !form.identifier.trim()">
            {{ isSubmitting() ? 'Saving...' : 'Add Student' }}
        </button>
    </div>
</app-modal-shell>
