@cauca-911/material 21.0.1-beta.5 → 21.0.2

package/src/lib/components/deprecated-components/cauca-menu-vertical/cauca-menu-vertical.component.html

@@ -1,49 +0,0 @@
-@for (menu of menuItems; track menu) {
-  <h4 [class]="menu.activated ? 'selected' : ''">
-    <div (click)="goTo(menu.path, $event)" class="menu">
-      @if (menu.icon) {
-        <div class="menu-icon">
-          @if (isIconArray(menu.icon)) {
-            <fa-icon [icon]="menu.icon"></fa-icon>
-          }
-          @if (!isIconArray(menu.icon)) {
-            <img [src]="menu.icon" />
-          }
-        </div>
-      }
-      @if (menu.label) {
-        <div class="menu-caption">
-          <span>{{menu.label | translate}}</span>
-        </div>
-      }
-    </div>
-    @if (menu.childs.length && menu.activated) {
-      <div class="submenu">
-        @for (submenu of menu.childs; track submenu) {
-          <div
-            [class]="submenu.activated ? 'menu selected' : 'menu'"
-            (click)="goTo(submenu.path, $event)">
-            @if (!submenu.icon) {
-              <div class="menu-dot">&bull;</div>
-            }
-            @if (submenu.icon) {
-              <div class="menu-icon">
-                @if (isIconArray(submenu.icon)) {
-                  <fa-icon [icon]="submenu.icon"></fa-icon>
-                }
-                @if (!isIconArray(submenu.icon)) {
-                  <img [src]="submenu.icon" />
-                }
-              </div>
-            }
-            @if (submenu.label) {
-              <div class="menu-caption">
-                <span>{{submenu.label | translate}}</span>
-              </div>
-            }
-          </div>
-        }
-      </div>
-    }
-  </h4>
-}

package/src/lib/components/deprecated-components/cauca-menu-vertical/cauca-menu-vertical.component.ts

@@ -1,56 +0,0 @@
-import { Component, EventEmitter, Input, Output, inject } from '@angular/core';
-
-import {NavigationEnd, Router} from '@angular/router';
-import {MenuItem} from '../shared/models/menu-item';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { TranslateModule } from '@ngx-translate/core';
-
-@Component({
-    selector: 'cauca-menu-vertical',
-    templateUrl: './cauca-menu-vertical.component.html',
-    styleUrls: ['./cauca-menu-vertical.component.scss'],
-    imports: [
-    FaIconComponent,
-    TranslateModule
-]
-})
-export class CaucaMenuVerticalComponent {
-
-    @Output() public itemClick = new EventEmitter();
-    @Input() public menuItems: MenuItem[] = [];
-
-    private readonly router = inject(Router);
-
-    public constructor() {
-        this.router.events.subscribe((route: NavigationEnd) => {
-            if (route instanceof NavigationEnd) {
-                this.selectActiveRoute(route);
-            }
-        });
-    }
-
-    public goTo(path: string, e: any): void {
-        this.router.navigate([path]);
-        this.itemClick.emit();
-
-        e.stopPropagation();
-    }
-
-    public isIconArray(icon: string | string[] | null | undefined): icon is string[] {
-        return Array.isArray(icon);
-    }
-
-    private selectActiveRoute(route: NavigationEnd): void {
-        this.menuItems.forEach((menu: MenuItem) => {
-            if (route.url) {
-                menu.activated = (route.url === menu.path || (menu.childs.length && route.url.indexOf(menu.path) > -1));
-            }
-
-            menu.childs.forEach((subMenu: MenuItem) => {
-                if (route.url) {
-                    subMenu.activated = (route.url === subMenu.path || route.urlAfterRedirects === subMenu.path);
-                }
-            });
-        });
-    }
-}

package/src/lib/components/deprecated-components/cauca-simple-dialog/cauca-simple-dialog.component.html

@@ -1,11 +0,0 @@
-<h1 mat-dialog-title>{{data.title}}</h1>
-<div mat-dialog-content>
-  <div [innerHTML]="data.message"></div>
-</div>
-@if (data.buttons) {
-  <div mat-dialog-actions>
-    @for (label of data.buttons; track label; let i = $index) {
-      <button mat-raised-button (click)="onClick(i)">{{label}}</button>
-    }
-  </div>
-}

package/src/lib/components/deprecated-components/cauca-simple-dialog/cauca-simple-dialog.component.scss

@@ -1,4 +0,0 @@
-div[mat-dialog-actions] {
-  margin-top: 20px;
-  text-align: center;
-}

package/src/lib/components/deprecated-components/cauca-simple-dialog/cauca-simple-dialog.component.spec.ts

@@ -1,39 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import {
-  MAT_DIALOG_DATA,
-  MatDialogModule,
-  MatDialogRef
-} from '@angular/material/dialog';
-import { CaucaSimpleDialogComponent } from './cauca-simple-dialog.component';
-
-describe('CaucaSimpleDialogComponent', () => {
-  let component: CaucaSimpleDialogComponent;
-  let fixture: ComponentFixture<CaucaSimpleDialogComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      imports: [ 
-        CaucaSimpleDialogComponent,
-        MatDialogModule,
-      ],
-      providers: [{
-        provide: MatDialogRef,
-        useValue: {}
-      }, {
-          provide: MAT_DIALOG_DATA,
-          useValue: {}
-      }]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(CaucaSimpleDialogComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/deprecated-components/cauca-simple-dialog/cauca-simple-dialog.component.ts

@@ -1,20 +0,0 @@
-import { Component, inject } from '@angular/core';
-
-import { MAT_DIALOG_DATA, MatDialogActions, MatDialogContent, MatDialogRef, MatDialogTitle } from '@angular/material/dialog';
-import { SimpleDialogData } from '../shared/models/simple-dialog-data';
-import { MatButtonModule } from '@angular/material/button';
-
-@Component({
-    selector: 'cauca-simple-dialog',
-    templateUrl: './cauca-simple-dialog.component.html',
-    styleUrls: ['./cauca-simple-dialog.component.scss'],
-    imports: [MatDialogTitle, MatDialogContent, MatDialogActions, MatButtonModule]
-})
-export class CaucaSimpleDialogComponent{
-  public readonly data = inject<SimpleDialogData>(MAT_DIALOG_DATA);
-  private readonly dialogRef = inject<MatDialogRef<CaucaSimpleDialogComponent>>(MatDialogRef);
-
-  public onClick(buttonIndex: number): void {
-    this.dialogRef.close(buttonIndex);
-  }
-}

package/src/lib/components/deprecated-components/cauca-slideshow/cauca-slideshow.component.html

@@ -1,7 +0,0 @@
-<div #container class="slideshow">
-  @for (url of images; track url; let index = $index) {
-    <div [class.active]="index === selectedIndex" [class.entering]="states[index] === 'in'" [class.leaving]="states[index] === 'out'">
-      <img [src]="url" />
-    </div>
-  }
-</div>

package/src/lib/components/deprecated-components/cauca-slideshow/cauca-slideshow.component.scss

@@ -1,41 +0,0 @@
-.slideshow {
-  margin: 0 auto;
-  position: relative;
-  overflow: hidden;
-}
-
-.slideshow > div {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  transition: transform 500ms ease-in, opacity 500ms ease-in;
-
-  /* Default state - off-screen to the right, ready to enter */
-  transform: translateX(100%);
-  opacity: 0;
-
-  &.active {
-    /* Active slide - centered */
-    transform: translateX(0%);
-    opacity: 1;
-  }
-
-  &.leaving {
-    /* Leaving slide - move off-screen to the left */
-    transform: translateX(-100%);
-    opacity: 0;
-  }
-
-  &.entering {
-    /* Entering slide - animate from right to center */
-    transform: translateX(0%);
-    opacity: 1;
-  }
-}
-
-img {
-  max-height: 100%;
-  max-width: 100%;
-  margin: 0 auto;
-  display: block;
-}

package/src/lib/components/deprecated-components/cauca-slideshow/cauca-slideshow.component.spec.ts

@@ -1,24 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { CaucaSlideshowComponent } from './cauca-slideshow.component';
-
-describe('CaucaSlideshowComponent', () => {
-  let component: CaucaSlideshowComponent;
-  let fixture: ComponentFixture<CaucaSlideshowComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      imports: [ CaucaSlideshowComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(CaucaSlideshowComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/deprecated-components/cauca-slideshow/cauca-slideshow.component.ts

@@ -1,67 +0,0 @@
-import { Component, OnInit, ElementRef, Input, ViewChild } from '@angular/core';
-
-
-@Component({
-    selector: 'cauca-slideshow',
-    templateUrl: './cauca-slideshow.component.html',
-    styleUrls: ['./cauca-slideshow.component.scss'],
-    imports: [],
-})
-export class CaucaSlideshowComponent implements OnInit {
-  @ViewChild('container', { static: true })
-  public container: ElementRef;
-  @Input()
-  public height = '150px';
-  @Input()
-  public autoPlay = true;
-  public states = [];
-  public selectedIndex = 0;
-
-  private timer = null;
-  private items = [];
-
-  @Input()
-  public set images(list: string[]) {
-    this.items = list;
-    this.restart();
-  }
-  public get images(): string[] {
-    return this.items;
-  }
-
-  public ngOnInit(): void {
-    this.container.nativeElement.style.height = this.height;
-    this.container.nativeElement.style.width = '100%';
-  }
-
-  public getState(index: number): string {
-    if (this.states[index]) {
-      return this.states[index];
-    }
-
-    return (this.selectedIndex === index ? 'in' : 'out');
-  }
-
-  public restart(): void {
-    if (this.timer) {
-      window.clearInterval(this.timer);
-    }
-    if (this.images && this.images.length) {
-      this.timer = window.setInterval(() => this.changed('next'), 5000);
-    }
-  }
-
-  public next(): void {
-    if (this.selectedIndex < this.items.length - 1) {
-      this.selectedIndex++;
-    } else {
-      this.selectedIndex = 0;
-    }
-  }
-
-  private changed(action: string): void {
-    this.states[this.selectedIndex] = 'out';
-    this[action]();
-    this.states[this.selectedIndex] = 'in';
-  }
-}

package/src/lib/components/deprecated-components/shared/models/menu-item.ts

@@ -1,11 +0,0 @@
-export class MenuItem {
-    public activated: boolean;
-    public childs: MenuItem[] = [];
-
-    public constructor(
-        public label: string,
-        public path: string,
-        public icon: string | string[] = '',
-    ) {
-    }
-}

package/src/lib/components/deprecated-components/shared/models/simple-dialog-data.ts

@@ -1,5 +0,0 @@
-export class SimpleDialogData {
-    public title: string;
-    public message: string;
-    public buttons: string[] = [];
-}

package/src/lib/components/dialogs/alert-dialog/alert-dialog.component.html

@@ -1,10 +0,0 @@
-<div mat-dialog-title>
-  <div class="h6">{{ title | translate }}</div>
-  <cauca-icon-button id="closeButton" (buttonClick)="closeClick()" icon="close" />
-</div>
-<div class="alert-dialog-content" mat-dialog-content>
-  <p>{{ message | translate }}</p>
-</div>
-<mat-dialog-actions align="end">
-  <cauca-raised-button id="okButton" label="ok" color="primary" (buttonClick)="closeClick()" />
-</mat-dialog-actions>

package/src/lib/components/dialogs/alert-dialog/alert-dialog.component.scss

@@ -1,14 +0,0 @@
-@use "../dialog-styles";
-
-:host > div:first-child {
-  display: flex;
-  align-items: center;
-
-  div:first-child {
-      flex: 1;
-  }
-}
-
-.alert-dialog-content {
-  white-space: pre-wrap;
-}

package/src/lib/components/dialogs/alert-dialog/alert-dialog.component.spec.ts

@@ -1,90 +0,0 @@
-import { ComponentFixture, fakeAsync, TestBed } from '@angular/core/testing';
-
-import { AlertDialogComponent } from './alert-dialog.component';
-import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
-import { TranslateModule, TranslatePipe } from '@ngx-translate/core';
-import { MockComponents, MockModule, MockPipe, ngMocks } from 'ng-mocks';
-import { BreakpointObserver, BreakpointState } from '@angular/cdk/layout';
-import { of } from 'rxjs';
-import { IconButtonComponent } from '../../buttons/icon-button/icon-button.component';
-import { RaisedButtonComponent } from '../../buttons/raised-button/raised-button.component';
-
-describe('AlertDialogComponent', () => {
-  let component: AlertDialogComponent;
-  let fixture: ComponentFixture<AlertDialogComponent>;
-  let mockMatDialog: any;
-  let breakpointObserverMock: jasmine.SpyObj<BreakpointObserver>;
-
-  beforeEach(async () => {
-    breakpointObserverMock = jasmine.createSpyObj('BreakpointObserver', ['observe']);
-    breakpointObserverMock.observe.and.returnValue(of({ matches: true, breakpoints: {} }));
-
-    mockMatDialog = jasmine.createSpyObj('MatDialogRef', ['close', 'addPanelClass', 'updateSize']);
-    await TestBed.configureTestingModule({
-      imports: [
-        AlertDialogComponent,
-        MockModule(TranslateModule)
-      ],
-      declarations: [
-        MockPipe(TranslatePipe, value => value),
-        ...MockComponents(IconButtonComponent, RaisedButtonComponent)
-      ],
-      providers: [
-        { provide: MatDialogRef, useValue: mockMatDialog },
-        { provide: MAT_DIALOG_DATA, useValue: [] },
-        { provide: BreakpointObserver, useValue: breakpointObserverMock },
-      ]
-    })
-      .compileComponents();
-
-    fixture = TestBed.createComponent(AlertDialogComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('should initially add a global style class', () => {
-    expect(mockMatDialog.addPanelClass).toHaveBeenCalledWith('dialog-global-style');
-  });
-
-  it('should update dialog size when breakpoint matches', fakeAsync(() => {
-    mockMatDialog.updateSize.calls.reset();
-    const breakpointState: BreakpointState = { matches: true, breakpoints: {} };
-    breakpointObserverMock.observe.and.returnValue(of(breakpointState));
-
-    TestBed.createComponent(AlertDialogComponent);
-    fixture.detectChanges();
-
-    expect(mockMatDialog.updateSize).toHaveBeenCalledWith('100vw');
-  }));
-
-  it('should update dialog size when breakpoint does not match', fakeAsync(() => {
-    mockMatDialog.updateSize.calls.reset();
-    const breakpointState: BreakpointState = { matches: false, breakpoints: {} };
-    breakpointObserverMock.observe.and.returnValue(of(breakpointState));
-
-    TestBed.createComponent(AlertDialogComponent);
-    fixture.detectChanges();
-
-    expect(mockMatDialog.updateSize).toHaveBeenCalledWith('auto');
-  }));
-
-  it('should close dialog when pressing ok', async () => {
-    const closeButton = ngMocks.find<RaisedButtonComponent>('#okButton', null)?.componentInstance;
-
-    closeButton.buttonClick.emit();
-
-    expect(mockMatDialog.close).toHaveBeenCalled();
-  });
-
-  it('should close dialog when pressing close', async () => {
-    const closeButton = ngMocks.find<IconButtonComponent>('#closeButton', null)?.componentInstance;
-
-    closeButton.buttonClick.emit();
-
-    expect(mockMatDialog.close).toHaveBeenCalled();
-  });
-});

package/src/lib/components/dialogs/alert-dialog/alert-dialog.component.ts

@@ -1,41 +0,0 @@
-import { Component, Inject } from '@angular/core';
-import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
-import { ConfirmationOptions } from '../services/dialog.service';
-import { TranslateModule } from '@ngx-translate/core';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import { BreakpointObserver } from '@angular/cdk/layout';
-import { RaisedButtonComponent } from '../../buttons/raised-button/raised-button.component';
-import { IconButtonComponent } from '../../buttons/icon-button/icon-button.component';
-
-@Component({
-  selector: 'cauca-alert-dialog',
-  templateUrl: './alert-dialog.component.html',
-  styleUrls: ['./alert-dialog.component.scss'],
-  standalone: true,
-  imports: [TranslateModule, RaisedButtonComponent, IconButtonComponent, MatDialogModule]
-})
-export class AlertDialogComponent {
-
-  public title: string = '';
-  public message: string = '';
-
-  public constructor(
-    public dialogRef: MatDialogRef<AlertDialogComponent>,
-    @Inject(MAT_DIALOG_DATA) public data: AlertDialogData,
-    breakdownObserver: BreakpointObserver) {
-    this.title = data.title;
-    this.message = data.message;
-    dialogRef.addPanelClass("dialog-global-style");
-    breakdownObserver.observe('(max-width: 500px)').pipe(takeUntilDestroyed()).subscribe(result => dialogRef.updateSize(result.matches ? '100vw' : 'auto'));
-  }
-
-  public closeClick(): void {
-    this.dialogRef.close();
-  }
-}
-
-export interface AlertDialogData {
-  title: string;
-  message: string;
-  options: ConfirmationOptions;
-}

package/src/lib/components/dialogs/confirm-dialog/confirm-dialog.component.html

@@ -1,11 +0,0 @@
-<div mat-dialog-title>
-    <div class="h6 title">{{ title | translate: options.titleArgs }}</div>
-    <cauca-icon-button id="close-button" (buttonClick)="cancelClick()" icon="close" />
-  </div>
-  <div mat-dialog-content>
-    <p class="message">{{ message | translate: options.messageArgs }}</p>
-  </div>
-  <mat-dialog-actions align="end" class="action-buttons">
-    <cauca-stroked-button class="no-button" [label]="options.noText" [color]="options.noColor" (buttonClick)="noClick()" />
-    <cauca-raised-button class="yes-button" [label]="options.yesText" [color]="options.yesColor" (buttonClick)="yesClick()" />
-  </mat-dialog-actions>

package/src/lib/components/dialogs/confirm-dialog/confirm-dialog.component.scss

@@ -1,29 +0,0 @@
-@use "../dialog-styles";
-
-:host > div:first-child {
-    display: flex;
-    align-items: center;
-
-    div:first-child {
-        flex: 1;
-    }
-}
-
-.yes-button {
-    padding-left: 8px;
-}
-
-.message {
-    white-space: pre-wrap;
-}
-
-.title {
-    padding-top: 8px;
-}
-
-.action-buttons {
-    display: flex;
-    align-items: center;
-    flex-direction: row;
-    gap: 8px;
-}