@sapphire-ion/framework 1.2.43 → 1.2.45

package/src/lib/components/inputs/inputs.module.ts

@@ -1,74 +0,0 @@
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { MaskitoDirective } from '@maskito/angular';
-import { CommonModule } from '@angular/common';
-import { IonicModule } from '@ionic/angular';
-import { NgModule } from '@angular/core';
-
-import { InputTextareaComponent } from './input-textarea/input-textarea.component';
-import { InputStringComponent } from './input-string/input-string.component';
-import { InputDecimalComponent } from './input-decimal/input-decimal.component';
-import { InputBoolComponent } from './input-bool/input-bool.component';
-import { InputFileComponent } from './input-file/input-file.component';
-import { ImageComponent } from '../image/image.component';
-import { InputDateComponent } from './input-date/input-date.component';
-import { InputSelectComponent } from './input-select/input-select.component';
-import { SIonPopoverModule } from '../popover/sion-popover.module';
-import { SIonLabelTemplateDirective } from './input-select/directives/sion-label-template.directive';
-import { SIonOptionTemplateDirective } from './input-select/directives/sion-option-template.directive';
-import { SIonPlaceholderTemplateDirective } from './input-select/directives/sion-placeholder-template.directive';
-import { InputCpfCnpjComponent } from './input-cpf-cnpj/input-cpf-cnpj.component';
-import { DownloadButtonComponent } from './input-file/download-button/download-button.component';
-import { LoadingComponent } from '../loading/loading.component';
-import { NgVarDirective } from '../../directives/ng-var.directive';
-import { InputColorComponent } from './input-color/input-color.component';
-import { InputCepComponent } from './input-cep/input-cep.component';
-import { InputTelefoneComponent } from './input-telefone/input-telefone.component';
-import { InputIconComponent } from './input-icon/input-icon.component';
-import { OverlayModule } from '@angular/cdk/overlay';
-import { MatDatepickerModule } from '@angular/material/datepicker';
-import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';
-import { MAT_MOMENT_DATE_FORMATS, MomentDateAdapter } from '@angular/material-moment-adapter';
-import { MatCardModule } from '@angular/material/card';
-
-const lstComponents = [
-  InputBoolComponent,
-  InputCepComponent,
-  InputColorComponent,
-  InputCpfCnpjComponent,
-  InputDateComponent,
-  InputDecimalComponent,
-  InputFileComponent,
-  InputIconComponent,
-  InputSelectComponent,
-    SIonLabelTemplateDirective,
-    SIonOptionTemplateDirective,
-    SIonPlaceholderTemplateDirective,
-  InputStringComponent,
-  InputTelefoneComponent,
-  InputTextareaComponent,
-  DownloadButtonComponent,
-]
-
-@NgModule({
-  declarations: [ ...lstComponents ],
-  exports     : [ ...lstComponents ],
-  imports: [
-    IonicModule,
-    CommonModule,
-    ReactiveFormsModule,
-    FormsModule,
-    ImageComponent,
-    MaskitoDirective,
-    SIonPopoverModule,
-    LoadingComponent,
-    NgVarDirective,
-    OverlayModule,
-    MatDatepickerModule,
-    MatCardModule
-  ],
-  providers: [
-    {provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE]},
-    {provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS},
-  ]
-})
-export class InputsModule { }

package/src/lib/components/loading/loading.component.html

@@ -1,28 +0,0 @@
-@switch (type) {
-  @case (1) {
-    <div class="w-full text-center h-16 flex items-center justify-center">
-      <div class="flex items-center justify-center">
-        <ion-spinner></ion-spinner>
-      </div>
-      @if(text){
-        <span>{{text}}</span>
-      }
-    </div>
-  }
-  @case (2) {
-    <div class="w-full text-center h-16 flex items-center justify-center">
-      <div class="flex items-center justify-center">
-        <ion-spinner></ion-spinner> 
-        @if (text) {
-          <span class="ml-3">{{text}}</span>
-        }
-      </div>
-    </div>
-  }
-  @case (3) {
-    <div class="absolute top-0 left-0 size-full opacity-0 -z-50 default-transition -translate-y-12 flex items-center justify-center !translucid-background" 
-      [ngClass]="{'!z-20 !opacity-100 !translate-y-0': loading}">
-      <loading [type]="2" [text]="text"></loading>   
-    </div>
-  }
-}

package/src/lib/components/loading/loading.component.ts

@@ -1,29 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { Component, Input, OnInit } from '@angular/core';
-import { IonicModule } from '@ionic/angular';
-
-@Component({
-  standalone: true,
-  imports: [ CommonModule, IonicModule ],
-  selector: 'loading',
-  templateUrl: './loading.component.html',
-  styleUrls: ['./loading.component.scss'],
-})
-export class LoadingComponent  implements OnInit {
-
-  /** Texto exibido */
-  @Input() text    : string = "Carregando, por favor aguarde...";
-  /** Tipo do loading
-   *  1 - Componente basico - h-16 de altura 
-   *  2 - Componente basico - h-16 de altura 
-   *  3 - Componente absoluto, preenche o elemento superior relativo
-   */
-  @Input() type    : 1 | 2 | 3 = 1;
-  /** Utilizado no tipo 3, quando inativo é hidden */
-  @Input() loading : boolean = true;
-
-  constructor() { }
-
-  ngOnInit() {}
-
-}

package/src/lib/components/login/login-admin/login-admin.component.html

@@ -1,28 +0,0 @@
-@if (this.authService.isAdmin || !this.apiUrlProviderService.production) {
-  <ion-button (click)="adminPopover.present($event)" fill="outline" class="aspect-square h-8 z-50" size="small">
-    <ion-icon name="shield" slot="icon-only"></ion-icon>
-  </ion-button>
-  <ion-popover id="admin-popover" #adminPopover>
-    <ng-template>
-      <ion-content class="p-2 bg-transparent">
-      <div class="p-2">
-        <input-select
-          [(ngModel)]="idUsuario"
-          label="Logar como..."
-          (change)="SelectUser($event)"
-          [configuration]="selectUserConfiguration"
-        ></input-select>
-  
-        <div class="rounded-2xl mt-2 overflow-hidden border border-primary/30">
-          <div class="py-2 text-center border-b border-b-medium/30">
-            <span class="font-poppins"> API </span>
-          </div>
-          <ion-item lines="none" style="--border-width: 0 !important;">
-            <ion-input [(ngModel)]="apiUrl" (ngModelChange)="SetApiUrl()"></ion-input>
-          </ion-item>
-        </div>
-      </div>
-      </ion-content>
-    </ng-template>
-  </ion-popover>
-}

package/src/lib/components/login/login-admin/login-admin.component.ts

@@ -1,51 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { Component, OnInit } from '@angular/core';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { IonicModule } from '@ionic/angular';
-
-import { ApiUrlProviderService } from '../../../services/web/api-url-provider.service';
-import { UsuarioService        } from '../../../services/usuario.service';
-import { AuthService           } from '../../../services/auth.service';
-
-import { InputsModule             } from '../../../components/inputs/inputs.module';
-import { InputSelectConfiguration } from '../../../components/inputs/input-select/input.select.configuration';
-
-@Component({
-  standalone: true,
-  imports: [
-    CommonModule,
-    IonicModule,
-    FormsModule,
-    ReactiveFormsModule,
-    InputsModule
-  ],
-  selector: 'login-admin',
-  templateUrl: './login-admin.component.html',
-  styleUrls: ['./login-admin.component.scss'],
-})
-export class LoginAdminComponent  implements OnInit {
-
-  constructor(
-    public apiUrlProviderService: ApiUrlProviderService,
-    public authService: AuthService,
-    private usuarioService: UsuarioService,
-  ) { }
-
-  idUsuario: number | null;
-
-  async ngOnInit() {
-    try{
-      this.idUsuario = (await this.authService.LoadToken()).id;
-    }catch{}
-  }
-
-  public selectUserConfiguration: InputSelectConfiguration = new InputSelectConfiguration('id', ((v) => { return v.nome + ' - ' + v.apelido; }), false, true, this.usuarioService);
-  SelectUser(event: number){
-    if(event){ this.authService.BypassLogin(event).then(() => window.location.reload() ) }
-  }
-
-  apiUrl: string = this.apiUrlProviderService.apiUrl;
-  SetApiUrl(){
-    this.apiUrlProviderService.apiUrl = this.apiUrl;
-  }
-}

package/src/lib/components/login/login.component.html

@@ -1,104 +0,0 @@
-<!-- <div class="size-full flex justify-center items-center relative">
-  <div class="landscape:w-4/5 portrait:w-full landscape:h-2/3 portrait:h-full landscape:max-w-[60rem] translucid-border landscape:rounded-3xl landscape:backdrop-blur-xl overflow-hidden">
-    <div class="size-full flex portrait:flex-col" style="background-color: color-mix(in srgb, var(--ion-color-light) 20%, transparent 80%);">
-      <div class="shrink-0 w-96 portrait:w-full portrait:h-32 h-full p-3">
-        <div class="rounded-2xl size-full overflow-x-hidden">
-          <ng-content class="size-full"></ng-content>
-        </div>
-      </div>
-      <div class="grow flex items-center justify-center h-full py-3 pr-3 portrait:pl-3">
-        <div class="w-96 h-full flex flex-col items-center justify-center gap-2" *ngIf="frm" [formGroup]="frm">
-
-          <ion-text class="text-5xl my-10 portrait:mt-[-5rem]"> Login </ion-text>
-
-          <ion-card class="w-full backdrop-blur-xl">
-            <ion-card-content>
-              <ion-item lines="none" label="Senha" labelPlacement="stacked" class="rounded-2xl my-3 w-full">
-                <ion-icon name="person" slot="start"></ion-icon>
-                <ion-input placeholder="Usuário / User" formControlName="apelido"></ion-input>
-              </ion-item>
-            </ion-card-content>
-          </ion-card>
-
-          <ion-card class="w-full backdrop-blur-xl"> 
-            <ion-card-content>
-              <ion-item lines="none" class="rounded-2xl my-3 w-full">
-                <ion-icon name="lock-closed" slot="start"></ion-icon>
-                <ion-input type="password" formControlName="senha" placeholder="Senha / Password">
-                  <ion-input-password-toggle slot="end"></ion-input-password-toggle>
-                </ion-input>
-              </ion-item>
-            </ion-card-content>
-          </ion-card>
-
-          <div class="w-full">
-            <a href="">Esqueceu a senha?</a>
-          </div>
-
-          <div class="flex w-full">
-            <ion-button class="rounded-2xl shadow-xl default-transition w-full" expand="block" (click)="Login()" [disabled]="loading">
-              <ion-spinner class="default-transition" [ngClass]="{'-translate-x-12 opacity-0 size-0': !loading, 'mr-2' : loading}" slot="start"></ion-spinner>
-              <ion-icon    class="default-transition" [ngClass]="{'-translate-x-12 opacity-0 size-0':  loading}" name="enter-outline" slot="start" ></ion-icon>
-              <span class="default-transition" > Login </span>
-            </ion-button>
-
-            <ion-button class="shrink-0 aspect-square ml-3" color="dark" hidden>
-              <svg class="size-8" slot="icon-only" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="64" height="64"><defs><path id="A" d="M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z"/></defs><clipPath id="B"><use xlink:href="#A"/></clipPath><g transform="matrix(.727273 0 0 .727273 -.954545 -1.45455)"><path d="M0 37V11l17 13z" clip-path="url(#B)" fill="#fbbc05"/><path d="M0 11l17 13 7-6.1L48 14V0H0z" clip-path="url(#B)" fill="#ea4335"/><path d="M0 37l30-23 7.9 1L48 0v48H0z" clip-path="url(#B)" fill="#34a853"/><path d="M48 48L17 24l-4-3 35-10z" clip-path="url(#B)" fill="#4285f4"/></g></svg>
-            </ion-button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div> -->
-
-<div #loginContainer class="size-full flex justify-center items-center relative portrait:p-4">
-  <div class="landscape:w-4/5 landscape:h-2/3 landscape:xl:max-w-[60rem] portrait:size-full translucid-border backdrop-blur-xl rounded-3xl overflow-hidden">
-    <div class="size-full flex portrait:flex-col" style="background-color: color-mix(in srgb, var(--ion-color-light) 20%, transparent 80%);">
-      <div class="shrink-0 w-96 portrait:w-full portrait:h-40 landscape:h-full p-2">
-        <div class="size-full rounded-2xl overflow-hidden">
-          <ng-content select="[slot=logo]" class="size-full"></ng-content>
-        </div>
-      </div>
-      <div class="shrink size-full flex flex-col items-center justify-center gap-3 px-10 relative" *ngIf="frm" [formGroup]="frm">
-        <ion-text class="h-24 text-5xl"> Login </ion-text>
-
-        <ion-card class="w-full backdrop-blur-xl">
-          <ion-card-content>
-            <ion-item lines="none" label="Senha" labelPlacement="stacked" class="rounded-2xl my-3 w-full">
-              <ion-icon name="person" slot="start"></ion-icon>
-              <ion-input placeholder="Usuário / User" formControlName="apelido"></ion-input>
-            </ion-item>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card class="w-full backdrop-blur-xl"> 
-          <ion-card-content>
-            <ion-item lines="none" class="rounded-2xl my-3 w-full">
-              <ion-icon name="lock-closed" slot="start"></ion-icon>
-              <ion-input type="password" formControlName="senha" placeholder="Senha / Password">
-                <ion-input-password-toggle slot="end"></ion-input-password-toggle>
-              </ion-input>
-            </ion-item>
-          </ion-card-content>
-        </ion-card>
-
-        <div class="flex w-full">
-          <ion-button class="transition-all rounded-2xl shadow-xl default-transition w-full" expand="block" (click)="Login()" [disabled]="loading">
-            <ion-spinner class="default-transition" [ngClass]="{'-translate-x-12 opacity-0 size-0': !loading, 'mr-2' : loading}" slot="start"></ion-spinner>
-            <ion-icon    class="default-transition" [ngClass]="{'-translate-x-12 opacity-0 size-0':  loading}" name="enter-outline" slot="start" ></ion-icon>
-            <span class="default-transition"> Login </span>
-          </ion-button>
-
-          <!-- <ion-button class="shrink-0 aspect-square ml-3" color="dark" hidden>
-            <svg class="size-8" slot="icon-only" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" width="64" height="64"><defs><path id="A" d="M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z"/></defs><clipPath id="B"><use xlink:href="#A"/></clipPath><g transform="matrix(.727273 0 0 .727273 -.954545 -1.45455)"><path d="M0 37V11l17 13z" clip-path="url(#B)" fill="#fbbc05"/><path d="M0 11l17 13 7-6.1L48 14V0H0z" clip-path="url(#B)" fill="#ea4335"/><path d="M0 37l30-23 7.9 1L48 0v48H0z" clip-path="url(#B)" fill="#34a853"/><path d="M48 48L17 24l-4-3 35-10z" clip-path="url(#B)" fill="#4285f4"/></g></svg>
-          </ion-button> -->
-        </div>
-
-        <div class="w-full">
-          <ng-content select="[slot=end]"></ng-content>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>

package/src/lib/components/login/login.component.ts

@@ -1,96 +0,0 @@
-import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
-import { Component, EventEmitter, HostListener, OnInit, Output, ViewChild } from '@angular/core';
-import { IonicModule, NavController } from '@ionic/angular';
-import { CommonModule } from '@angular/common';
-import { Router } from '@angular/router';
-
-import { EnvironmentService } from '../../services/environment.service';
-import { ApiUrlProviderService } from '../../services/web/api-url-provider.service';
-import { GenericService } from '../../services/generic.service';
-import { AuthService } from '../../services/auth.service';
-
-@Component({
-  standalone: true,
-  imports: [
-    CommonModule,
-    IonicModule,
-    FormsModule,
-    ReactiveFormsModule,
-  ],
-  selector: 'login',
-  templateUrl: './login.component.html',
-  styleUrls: ['./login.component.scss'],
-})
-export class DefaultLoginComponent  implements OnInit {
-
-  constructor(
-    private fb: FormBuilder,
-    private genericService: GenericService,
-    private navController: NavController,
-    private authService: AuthService,
-    public apiUrlProviderService: ApiUrlProviderService,
-    public coreService: EnvironmentService,
-    private router: Router
-  ) { 
-    this.genericService.SetTitle("Login");
-  }
-  
-  async ngOnInit() {
-    this.CreateForm();
-
-    if(!this.coreService.environment.production){
-      this.frm.patchValue(this.coreService.environment.defaultCredentials); 
-    }
-    const Token = await this.authService.LoadToken()
-    if(this.authService.isTokenValid(Token)){
-      this.router.navigate(["/"]);
-    }
-  }
-  
-  frm: FormGroup;
-  CreateForm(): void{
-    this.frm = this.fb.group({
-      apelido : [null ,Validators.required],
-      senha   : [null, Validators.required]
-    });
-  }
-
-  loading: boolean;
-  submitted: boolean = false;
-
-  @Output() OnLogin: EventEmitter<any> = new EventEmitter<any>();
-  @ViewChild('loginContainer') loginContainer: HTMLElement;
-
-  @HostListener('window:keydown', ['$event'])
-  async Login($event?: KeyboardEvent): Promise<void>{
-    if($event && $event.key != 'Enter'){ return; }
-    if($event && !this.loginContainer.contains(document.activeElement)){
-      return; // Prevent login if the active element is not within the login container
-    }
-
-    this.submitted = true;
-    this.loading   = true;
-   
-    if(!this.frm.valid){
-      this.loading = false;
-      this.genericService.PresentToast("Usuario / Senha não informado!"); return;
-    }
-
-    try{
-      const Token = await this.authService.Login(this.frm.value);
-
-      this.loading = false;
-      this.navController.navigateRoot("/");
-      this.genericService.PresentToast("Logado com sucesso!", "checkmark-circle");
-      this.OnLogin.emit(Token);
-    }
-    catch (status){
-      if(status == 401){
-        this.genericService.PresentToast("Usuário / Senha inválido (s)!");
-      }else{
-        this.genericService.PresentToast("Ocorreu um erro ao realizar o login!");
-      }
-      this.loading = false;
-    }
-  }
-}

package/src/lib/components/main-content/main-content.component.html

@@ -1,145 +0,0 @@
-<div class="size-full flex flex-col" [ngClass]="{'bg-light/50': fullScreen}" #target>
-  <div class="w-full h-14 relative shrink-0">
-    <ion-card class="m-0 rounded-none size-full border-none">
-      <ion-card-content class="p-0 px-2 size-full flex">
-        <div class="w-1/2 h-full flex items-center justify-start">
-          @if (!fullScreen) {
-            <ion-menu-button  [routerLink]="['/']" [autoHide]="true"></ion-menu-button>
-          }
-          <ng-content select="[slot=start]"></ng-content>
-        </div>
-
-        <div class="w-1/2 h-full flex items-center justify-end gap-2">
-          <ng-content select="[slot=end]"></ng-content>
-
-          <ion-button (click)="FullScreen()" fill="outline" color="dark" size="small" class="size-10 aspect-square  portrait:hidden">
-            <ion-icon slot="icon-only" name="expand"></ion-icon>
-          </ion-button>
-
-
-          @if (!fullScreen) {
-            <div #anchor>
-              <ion-button (click)="userPopover.present($event)" size="small" class="size-10 aspect-square">
-                <span class="uppercase text-white">{{Token ? Token.Nome[0] : ''}}</span>
-              </ion-button>
-            </div>
-            <sion-popover #userPopover [anchor]="anchor" [flip]="false" width="13rem">
-              <div class="w-full flex flex-col overflow-hidden">
-                <div class="w-full flex p-2 gap-2 overflow-hidden">
-                  <div class="size-10 shrink-0 aspect-square rounded-2xl text-sm flex items-center justify-center bg-primary">
-                    <span class="uppercase text-white">{{Token ? Token.Nome[0] : ''}}</span>
-                  </div>
-
-                  <div class="shrink-0 w-full flex flex-col justify-center items-start overflow-hidden text-sm">
-                    <span class="truncate"> {{Token ? Token.Nome : ''}} </span>
-                    <span class="truncate text-secondary"> &#64;{{Token ? Token.Apelido : ''}} </span>
-                  </div>
-                </div>
-
-                <div class="w-full">
-                  <ng-content class="size-full" select="[slot=user-popover]"></ng-content>
-                </div>
-
-                <div class="w-full p-1 !pb-0 translucid-border !border-x-0 !border-b-0">
-                  <div class="rounded-xl flex gap-2 items-center justify-start default-transition py-1 px-2">
-                    <ion-icon name="contrast"></ion-icon>
-                    <ion-text> Tema </ion-text>
-                  </div>
-
-                  <div class="flex flex-col pl-4">
-                    <ion-radio-group alignment="start" [allowEmptySelection]="false" [value]="Theme" (ionChange)="SetTheme($event.detail.value)">
-                      <ion-item class="bg-transparent" lines="full">
-                        <ion-icon name="cog" slot="start"></ion-icon>
-                        <ion-radio class="w-full" [value]="0">Sistema</ion-radio>
-                      </ion-item>
-                      <ion-item class="bg-transparent" lines="full">
-                        <ion-icon name="sunny" slot="start"></ion-icon>
-                        <ion-radio class="w-full" [value]="1">Claro</ion-radio>
-                      </ion-item>
-                      <ion-item class="bg-transparent" lines="none">
-                        <ion-icon name="moon" slot="start"></ion-icon>
-                        <ion-radio class="w-full" [value]="2">Escuro</ion-radio>
-                      </ion-item>
-                    </ion-radio-group>
-
-
-                    <!-- <div class="w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden">
-                      <div class="rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2">
-                        <ion-checkbox [checked]="Theme == 0" (ionChange)="SetTheme(0)" ></ion-checkbox>
-                        <ion-icon name="cog"></ion-icon>
-                        <ion-text> Sistema </ion-text>
-                      </div>
-                    </div>
-                    <div class="w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden">
-                      <div class="rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2">
-                        <ion-checkbox [checked]="Theme == 1" (ionChange)="SetTheme(1)" ></ion-checkbox>
-                        <ion-icon name="sunny"></ion-icon>
-                        <ion-text> Claro </ion-text>
-                      </div>
-                    </div>
-                    <div class="w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden">
-                      <div class="rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2">
-                        <ion-checkbox [checked]="Theme == 2" (ionChange)="SetTheme(2)" ></ion-checkbox>
-                        <ion-icon name="moon"></ion-icon>
-                        <ion-text> Escuro </ion-text>
-                      </div>
-                    </div> -->
-                  </div>
-                </div>
-
-
-                <div class="w-full p-1 translucid-border !border-x-0 !border-b-0">
-                  <div (click)="authService.Loggout()" class="rounded-xl flex gap-2 cursor-pointer items-center justify-start hover:bg-medium/10 default-transition py-1 px-2">
-                    <ion-icon color="danger" name="exit"></ion-icon>
-                    <ion-text> Log Out </ion-text>
-                  </div>
-
-                  <!-- <ion-text> Log Out </ion-text>
-                  <ion-button (click)="authService.Loggout()" class="size-8 shrink-0" size="small" fill="clear" color="danger">
-                    <ion-icon slot="icon-only" name="exit-outline"></ion-icon> 
-                  </ion-button> -->
-                </div>
-              </div>
-
-              <!-- <div class="size-full">
-                <div class="w-full p-1 flex items-center">
-                  <div class="size-10 shrink-0 aspect-square rounded-2xl text-sm flex items-center justify-center default-transition" style="background-color: var(--ion-color-primary);">
-                    <span class="uppercase text-white">{{Token ? Token.Nome[0] : ''}}</span>
-                  </div>
-                  <div class="grow min-w-10 p-2 justify-center items-center whitespace-nowrap text-ellipsis overflow-hidden block default-transition" [ngClass]="{'opacity-0 w-0': colapsed}">
-                    <span>{{Token ? Token.Nome : ''}}</span> <br>
-                    <ion-text color="secondary" class="text-sm">
-                      &#64;{{Token ? Token.Apelido : ''}}
-                    </ion-text>
-                  </div>
-                </div>
-                <div class="w-full">
-                  <ng-content class="size-full" select="[slot=user-popover]"></ng-content>
-                </div>
-                <div class="w-full p-1 px-2 translucid-border !border-x-0 !border-b-0 flex items-center justify-between">
-                  <div class="hover:bg-medium/30 default-transition size-full">
-                    <ion-button color="dark" fill="clear" size="small" class="rounded-xl w-full text-left overflow-hidden">
-                      <ion-icon slot="start" name="contrast"></ion-icon>
-                      <ion-label class="text-sm">Tema</ion-label>
-                    </ion-button>
-                  </div>
-                </div>
-                <div class="w-full p-1 px-2 translucid-border !border-x-0 !border-b-0 flex items-center justify-between">
-                  <ion-text> Log Out </ion-text>
-                  <ion-button (click)="authService.Loggout()" class="size-8 shrink-0" size="small" fill="clear" color="danger">
-                    <ion-icon slot="icon-only" name="exit-outline"></ion-icon> 
-                  </ion-button>
-                </div>
-              </div> -->
-            </sion-popover>
-          }
-        </div>
-      </ion-card-content>
-    </ion-card>
-  </div>
-  <div class="size-full relative p-2 pt-0 bg-light">
-    <div class="size-full relative rounded-2xl content-shadow overflow-hidden {{backdrop}}" style="--shadow-color: {{shadowColor}}">
-      <ng-content></ng-content> 
-    </div>
-  </div>
-</div>

package/src/lib/components/main-content/main-content.component.ts

@@ -1,93 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { Component, Input, OnInit, ViewChild } from '@angular/core';
-import { IonicModule } from '@ionic/angular';
-import { RouterLinkWithHref } from '@angular/router';
-import { Preferences } from '@capacitor/preferences';
-
-import { DrawerComponent } from '../drawer/drawer.component';
-import { AuthService } from '../../services/auth.service';
-import { SIonPopoverModule } from '../popover/sion-popover.module';
-
-@Component({
-  standalone: true,
-  imports: [ CommonModule, IonicModule, RouterLinkWithHref, SIonPopoverModule ],
-  selector: 'main-content',
-  templateUrl: './main-content.component.html',
-  styleUrls: ['./main-content.component.scss'],
-})
-export class MainContentComponent  implements OnInit {
-
-  @Input() backdrop: string = 'bg-primary/30';
-  @Input() shadowColor: string = 'color-mix(in srgb, var(--ion-color-primary) 15%, transparent)';
-
-  @Input() colapsed: boolean = false;
-  @Input() drawerComponent: DrawerComponent;
-
-  constructor(
-    public authService: AuthService,
-  ) { }
-
-  Token: any;
-  async ngOnInit(): Promise<void> {
-    this.Token = await this.authService.LoadToken();
-    this.Theme = Number((await Preferences.get({ key: 'theme' })).value) as Theme;
-
-    this.SetTheme(this.Theme);
-    window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
-      this.SetTheme(this.Theme);
-    });
-  }
-
-  Theme: Theme = Theme.System;
-  async SetTheme(theme: Theme) {
-    this.Theme = theme;
-    await Preferences.set({ key: 'theme', value: this.Theme.toString() });
-    if (this.Theme === Theme.System) {
-      var matches = window.matchMedia('(prefers-color-scheme: dark)').matches;
-      if (matches) {
-        document.body.classList.add('dark');
-      } else {
-        document.body.classList.remove('dark');
-      }
-    }
-    else 
-    if (this.Theme === Theme.Light) {
-      document.body.classList.remove('dark');
-    } else 
-    if (this.Theme === Theme.Dark) {
-      document.body.classList.add('dark'); 
-    }
-  }
-
-  get fullScreen(): boolean { 
-    if(document.fullscreenElement != null){
-      return true;
-    }
-    return false; 
-  };
-
-  @ViewChild('target') FullScreenConteiner;
-  FullScreen(): void{
-    if(!this.fullScreen){
-      const elem = this.FullScreenConteiner.nativeElement;
-  
-      if (elem.requestFullscreen) {
-        elem.requestFullscreen();
-      } else if (elem.msRequestFullscreen) {
-        elem.msRequestFullscreen();
-      } else if (elem.mozRequestFullScreen) {
-        elem.mozRequestFullScreen();
-      } else if (elem.webkitRequestFullscreen) {
-        elem.webkitRequestFullscreen();
-      }
-    }else{
-      document.exitFullscreen()
-    }
-  }
-}
-
-enum Theme {
-  System = 0,
-  Light  = 1,
-  Dark   = 2,
-}