SMS

 UI 

app-record-editor-sidewise

this is a shared that will help to add record and it will appear side ways and good for

short forms

How to call

<app-record-editor-sidewise

[show]="showEditor"

 [recordStructure]="staffRecordStructure"

  [initialValues]="selectedStaff"

  title="School Staff"

  (recordAdded)="handleRecordAdded($event)"

   (recordUpdated)="handleRecordUpdated($event)"

  (cancel)="showEditor = false">

</app-record-editor-sidewise>

please also refere each value example

 showEditor:boolean=false;

  staffRecordStructure!:IRecordStructure[];

  selectedStaff:any={};

  this.staffRecordStructure = [

    { name: 'firstName', type: 'text', label: 'First Name', required: true },

    { name: 'lastName', type: 'text', label: 'Last Name', required: true },

    { name: 'email', type: 'email', label: 'Email', required: true }

  ];

 openAddStaffPopup(): void {

    this.selectedStaff = {}; // Clear previous data for a new record

    this.showEditor = true;

  }

  openEditStaffPopup(user: any): void {

    this.selectedStaff = user;

    this.showEditor = true;

  }