inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2026-09-02 17:53:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

AAE-40911 Add adf-icon to core lib (#11471)

Browse Source 
* AAE-40911 Add adf-icon

* AAE-40911 Add adf-icon directive to remaining core lib components

* AAE-40911 Fix icon name

* AAE-40911 Remove doc change

* AAE-40911 Add icon module

* AAE-40911 Add icon module

* AAE-40911 Fix export

* AAE-40911 Fix export
This commit is contained in:
Diogo Bastos
2026-01-02 16:13:29 +00:00
committed by GitHub
parent d8720dbb59
commit 41b97eb835
70 changed files with 258 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.html
+1 -1
View File
@@ -15,7 +15,7 @@
[title]="'CORE.BREADCRUMBS.SHOWALL' | translate"
[attr.aria-label]="'CORE.BREADCRUMBS.SHOWALL' | translate"
>
<mat-icon class="adf-breadcrumb__show-all-button-icon--rotate">more_vert</mat-icon >
<mat-icon class="adf-breadcrumb__show-all-button-icon--rotate" adf-icon="more_vert" />
</button>
<div class="adf-breadcrumb__chevron" [class.adf-breadcrumb__chevron-after--compact]="compact" ></div>
</li>
lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.ts
+2 -2
View File
@@ -32,18 +32,18 @@ import {
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { map, startWith } from 'rxjs/operators';
import { TranslatePipe } from '@ngx-translate/core';
import { BreadcrumbFocusDirective } from '../../directives/breadcrumb-focus.directive';
import { BreadcrumbItemComponent } from '../breadcrumb-item/breadcrumb-item.component';
import { IconModule } from '@alfresco/adf-core';
@Component({
selector: 'adf-breadcrumb',
templateUrl: './breadcrumb.component.html',
styleUrls: ['./breadcrumb.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [CommonModule, MatIconModule, TranslatePipe, MatButtonModule, BreadcrumbFocusDirective]
imports: [CommonModule, IconModule, TranslatePipe, MatButtonModule, BreadcrumbFocusDirective]
})
export class BreadcrumbComponent implements AfterContentInit, OnChanges {
private _breadcrumbTemplateRefs: Array<TemplateRef<unknown>> = [];
lib/core/feature-flags/src/lib/components/flags/flags.component.html
+5 -8
View File
@@ -8,11 +8,8 @@
<mat-slide-toggle
[checked]="isEnabled"
(change)="onEnable($event.checked)" />
<button
class="adf-feature-flags-overrides-header-close"
mat-icon-button
mat-dialog-close>
<mat-icon>close</mat-icon>
<button class="adf-feature-flags-overrides-header-close" mat-icon-button mat-dialog-close>
<mat-icon adf-icon="close" />
</button>
</mat-toolbar>
@@ -20,7 +17,7 @@
<table mat-table [dataSource]="flags" class="adf-feature-flags-overrides-table mat-elevation-z0">
<ng-container matColumnDef="icon">
<th mat-header-cell class="adf-icon-col adf-header-cell" *matHeaderCellDef>
<mat-icon class="material-icons-outlined adf-search-icon">search</mat-icon>
<mat-icon class="material-icons-outlined adf-search-icon" adf-icon="search" />
</th>
<td mat-cell class="adf-icon-col" *matCellDef="let element">
<button mat-icon-button *ngIf="element.fictive; else flagFromApi" class="adf-fictive-flag-button" (click)="onDelete(element.flag)">
@@ -46,7 +43,7 @@
<mat-icon class="material-icons-outlined" fontIcon="add_circle" />
</button>
<button *ngIf="inputValue" matSuffix mat-icon-button aria-label="Clear" (click)="onClearInput()" class="adf-clear-button">
<mat-icon>cancel</mat-icon>
<mat-icon adf-icon="cancel" />
</button>
</div>
</th>
@@ -64,6 +61,6 @@
</ng-container>
<ng-template #flagFromApi>
<mat-icon class="material-icons-outlined">cloud</mat-icon>
<mat-icon class="material-icons-outlined" adf-icon="cloud" />
</ng-template>
lib/core/feature-flags/src/lib/components/flags/flags.component.ts
+2 -2
View File
@@ -30,7 +30,6 @@ import { debounceTime, map, take, tap } from 'rxjs/operators';
import { MatTableModule } from '@angular/material/table';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
import { MatInputModule } from '@angular/material/input';
import { FormsModule } from '@angular/forms';
@@ -38,6 +37,7 @@ import { FlagsOverrideComponent } from '../feature-override-indicator.component'
import { MatDialogModule } from '@angular/material/dialog';
import { TranslatePipe } from '@ngx-translate/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '@alfresco/adf-core';
@Component({
selector: 'adf-feature-flags-overrides',
@@ -48,7 +48,7 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
MatTableModule,
MatSlideToggleModule,
MatToolbarModule,
MatIconModule,
IconModule,
MatButtonModule,
MatInputModule,
MatDialogModule,
lib/core/src/lib/button/button.component.html
+3 -3
View File
@@ -80,7 +80,7 @@
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<mat-icon *ngIf="icon" class="adf-button__icon">{{ icon }}</mat-icon>
<mat-icon *ngIf="icon" class="adf-button__icon" [adf-icon]="icon" />
<ng-container [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
@@ -98,7 +98,7 @@
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<mat-icon *ngIf="icon" class="adf-button__icon">{{ icon }}</mat-icon>
<mat-icon *ngIf="icon" class="adf-button__icon" [adf-icon]="icon" />
<ng-container *ngIf="!icon" [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
@@ -116,7 +116,7 @@
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<mat-icon *ngIf="icon" class="adf-button__icon">{{ icon }}</mat-icon>
<mat-icon *ngIf="icon" class="adf-button__icon" [adf-icon]="icon" />
<ng-container *ngIf="!icon" [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
lib/core/src/lib/button/button.component.ts
+2 -2
View File
@@ -19,14 +19,14 @@ import { Component, HostBinding, Input, ViewEncapsulation } from '@angular/core'
import { CommonModule } from '@angular/common';
import { MatButtonModule } from '@angular/material/button';
import { ThemePalette } from '@angular/material/core';
import { MatIconModule } from '@angular/material/icon';
import { IconModule } from '../icon/icon.module';
export type ButtonVariant = 'basic' | 'raised' | 'stroked' | 'flat' | 'icon' | 'fab' | 'mini-fab' | undefined;
export type ButtonColor = ThemePalette;
@Component({
selector: 'adf-button',
imports: [CommonModule, MatButtonModule, MatIconModule],
imports: [CommonModule, MatButtonModule, IconModule],
templateUrl: './button.component.html',
styleUrls: ['./button.component.scss'],
encapsulation: ViewEncapsulation.None
lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.html
+4 -4
View File
@@ -9,7 +9,7 @@
(click)="clicked()"
[attr.data-automation-id]="'card-arrayitem-chip-' + item.value">
<div class="adf-card-view-array-chip-content">
<mat-icon *ngIf="item?.icon" class="adf-array-item-icon">{{item.icon}}</mat-icon>
<mat-icon *ngIf="item?.icon" class="adf-array-item-icon" [adf-icon]="item.icon" />
<span>{{item?.value}}</span>
</div>
</mat-chip>
@@ -27,7 +27,7 @@
(click)="clicked()"
[attr.data-automation-id]="'card-arrayitem-chip-' + item.value">
<div class="adf-card-view-array-chip-content">
<mat-icon *ngIf="item?.icon" class="adf-array-item-icon">{{item.icon}}</mat-icon>
<mat-icon *ngIf="item?.icon" class="adf-array-item-icon" [adf-icon]="item.icon" />
<span>{{item?.value}}</span>
</div>
</mat-chip>
@@ -41,7 +41,7 @@
*ngFor="let item of items.slice(displayCount, items.length)"
[attr.data-automation-id]="'card-arrayitem-chip-' + item.value">
<div class="adf-card-view-array-chip-content">
<mat-icon *ngIf="item?.icon" class="adf-array-item-icon">{{item.icon}}</mat-icon>
<mat-icon *ngIf="item?.icon" class="adf-array-item-icon" [adf-icon]="item.icon" />
<span>{{item?.value}}</span>
</div>
</mat-chip>
@@ -60,6 +60,6 @@
[attr.aria-label]="'CORE.METADATA.ACTIONS.EDIT' | translate"
[attr.title]="'CORE.METADATA.ACTIONS.EDIT' | translate"
[attr.data-automation-id]="'card-array-item-clickable-icon-' + property.key">
<mat-icon class="adf-array-item-button-icon">{{property.icon}}</mat-icon>
<mat-icon class="adf-array-item-button-icon" [adf-icon]="property.icon" />
</button>
</div>
lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.ts
+2 -2
View File
@@ -21,14 +21,14 @@ import { BaseCardView } from '../base-card-view';
import { CommonModule } from '@angular/common';
import { MatChipsModule } from '@angular/material/chips';
import { TranslatePipe } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatCardModule } from '@angular/material/card';
import { MatButtonModule } from '@angular/material/button';
import { IconModule } from '../../../icon/icon.module';
@Component({
selector: 'adf-card-view-arrayitem',
imports: [CommonModule, MatChipsModule, TranslatePipe, MatIconModule, MatMenuModule, MatCardModule, MatButtonModule],
imports: [CommonModule, MatChipsModule, TranslatePipe, IconModule, MatMenuModule, MatCardModule, MatButtonModule],
templateUrl: './card-view-arrayitem.component.html',
styleUrls: ['./card-view-arrayitem.component.scss'],
encapsulation: ViewEncapsulation.None
lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html
+3 -4
View File
@@ -60,9 +60,8 @@
(click)="onDateClear()"
[attr.title]="'CORE.METADATA.ACTIONS.CLEAR' | translate"
[attr.data-automation-id]="'datepicker-date-clear-' + property.key"
>
clear
</mat-icon>
adf-icon="clear"
/>
<mat-datetimepicker-toggle
matIconSuffix
[attr.tabindex]="-1"
@@ -92,7 +91,7 @@
(removed)="removeValueFromList(idx)"
>
{{ propertyValue }}
<mat-icon *ngIf="isEditable" matChipRemove>cancel</mat-icon>
<mat-icon *ngIf="isEditable" matChipRemove adf-icon="cancel" />
</mat-chip-option>
</mat-chip-listbox>
lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts
+2 -2
View File
@@ -35,13 +35,13 @@ import { isValid } from 'date-fns';
import { DateFnsUtils } from '../../../common/utils/date-fns-utils';
import { CommonModule } from '@angular/common';
import { TranslatePipe } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { MatChipsModule } from '@angular/material/chips';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { MatInputModule } from '@angular/material/input';
import { IconModule } from '../../../icon/icon.module';
@Component({
providers: [
@@ -54,7 +54,7 @@ import { MatInputModule } from '@angular/material/input';
imports: [
CommonModule,
TranslatePipe,
MatIconModule,
IconModule,
MatDatetimepickerModule,
MatChipsModule,
MatInputModule,
lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.html
+2 -2
View File
@@ -47,7 +47,7 @@
mat-icon-button
(click)="remove(i)"
class="adf-property-col-delete">
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</div>
</div>
@@ -57,7 +57,7 @@
class="adf-card-view__key-value-pairs__add-btn"
[attr.data-automation-id]="'card-key-value-pairs-button-' + property.key">
{{ 'CORE.CARDVIEW.KEYVALUEPAIRS.ADD' | translate }}
<mat-icon>add</mat-icon>
<mat-icon adf-icon="add" />
</button>
</div>
</div>
lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.ts
+2 -2
View File
@@ -25,11 +25,11 @@ import { TranslatePipe } from '@ngx-translate/core';
import { MatInputModule } from '@angular/material/input';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { IconModule } from '../../../icon/icon.module';
@Component({
selector: 'adf-card-view-key-value-pairs-item',
imports: [CommonModule, TranslatePipe, MatTableModule, MatInputModule, FormsModule, MatButtonModule, MatIconModule],
imports: [CommonModule, TranslatePipe, MatTableModule, MatInputModule, FormsModule, MatButtonModule, IconModule],
templateUrl: './card-view-keyvaluepairsitem.component.html',
styleUrls: ['./card-view-keyvaluepairsitem.component.scss'],
encapsulation: ViewEncapsulation.None,
lib/core/src/lib/card-view/components/card-view-selectitem/select-filter-input/select-filter-input.component.html
+1 -1
View File
@@ -20,7 +20,7 @@
*ngIf="term"
(keydown.enter)="reset($event)"
(click)="reset()">
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</mat-form-field>
</div>
lib/core/src/lib/card-view/components/card-view-selectitem/select-filter-input/select-filter-input.component.ts
+2 -2
View File
@@ -22,13 +22,13 @@ import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { TranslatePipe } from '@ngx-translate/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '../../../../icon/icon.module';
@Component({
selector: 'adf-select-filter-input',
imports: [CommonModule, MatFormFieldModule, MatInputModule, FormsModule, MatButtonModule, MatIconModule, TranslatePipe],
imports: [CommonModule, MatFormFieldModule, MatInputModule, FormsModule, MatButtonModule, IconModule, TranslatePipe],
templateUrl: './select-filter-input.component.html',
styleUrls: ['./select-filter-input.component.scss'],
host: { class: 'adf-select-filter-input' },
lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html
+2 -2
View File
@@ -78,7 +78,7 @@
<mat-chip-grid #chipElement class="adf-textitem-chip-list">
<mat-chip-row *ngFor="let propertyValue of editedValue; let idx = index" [removable]="isEditable" (removed)="removeValueFromList(idx)">
{{ propertyValue }}
<mat-icon *ngIf="isEditable" matChipRemove>cancel</mat-icon>
<mat-icon *ngIf="isEditable" matChipRemove adf-icon="cancel" />
</mat-chip-row>
</mat-chip-grid>
@@ -154,7 +154,7 @@
[attr.title]="'CORE.METADATA.ACTIONS.EDIT' | translate"
[attr.data-automation-id]="'card-textitem-clickable-icon-' + property.key"
>
<mat-icon class="adf-textitem-icon">{{ property?.icon }}</mat-icon>
<mat-icon class="adf-textitem-icon" [adf-icon]="property?.icon" />
</button>
</mat-form-field>
</div>
lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts
+2 -2
View File
@@ -28,10 +28,10 @@ import { CommonModule } from '@angular/common';
import { MatFormFieldModule } from '@angular/material/form-field';
import { TranslatePipe } from '@ngx-translate/core';
import { MatInputModule } from '@angular/material/input';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '../../../icon/icon.module';
export const DEFAULT_SEPARATOR = ', ';
const templateTypes = {
@@ -51,7 +51,7 @@ const templateTypes = {
MatInputModule,
ReactiveFormsModule,
MatChipsModule,
MatIconModule,
IconModule,
FormsModule,
MatButtonModule,
MatSnackBarModule
lib/core/src/lib/context-menu/context-menu-list.component.html
+1 -1
View File
@@ -7,7 +7,7 @@
[disabled]="link.model?.disabled"
[title]="link.model?.tooltip | translate"
(click)="onMenuItemClick($event, link)">
<mat-icon *ngIf="link.model?.icon">{{ link.model.icon }}</mat-icon>
<mat-icon *ngIf="link.model?.icon" [adf-icon]="link.model.icon" />
<span>{{ link.title || link.model?.title | translate }}</span>
</button>
</ng-container>
lib/core/src/lib/context-menu/context-menu-list.component.ts
+2 -2
View File
@@ -22,10 +22,10 @@ import { ContextMenuOverlayRef } from './context-menu-overlay';
import { contextMenuAnimation } from './animations';
import { CONTEXT_MENU_DATA } from './context-menu.tokens';
import { AfterViewInit, Component, HostListener, Inject, Optional, QueryList, ViewChildren, ViewEncapsulation } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
import { NgForOf, NgIf } from '@angular/common';
import { TranslatePipe } from '@ngx-translate/core';
import { DOWN_ARROW, UP_ARROW } from '@angular/cdk/keycodes';
import { IconModule } from '../icon/icon.module';
@Component({
selector: 'adf-context-menu',
@@ -36,7 +36,7 @@ import { DOWN_ARROW, UP_ARROW } from '@angular/cdk/keycodes';
class: 'adf-context-menu'
},
encapsulation: ViewEncapsulation.None,
imports: [MatIconModule, MatMenuModule, NgForOf, NgIf, TranslatePipe],
imports: [IconModule, MatMenuModule, NgForOf, NgIf, TranslatePipe],
animations: [trigger('panelAnimation', contextMenuAnimation)]
})
export class ContextMenuListComponent implements AfterViewInit {
lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.html
+2 -5
View File
@@ -16,17 +16,14 @@
[attr.aria-label]="'CLOSE' | translate"
(click)="closeMenu()"
>
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</div>
<mat-divider class="adf-columns-selector-divider" />
<div class="adf-columns-selector-search-input-container">
<mat-icon
class="adf-columns-selector-search-input-icon">
search
</mat-icon>
<mat-icon class="adf-columns-selector-search-input-icon" adf-icon="search" />
<input
[formControl]="searchInputControl"
lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts
+2 -2
View File
@@ -23,12 +23,12 @@ import { DataColumn } from '../../data/data-column.model';
import { CommonModule } from '@angular/common';
import { TranslatePipe } from '@ngx-translate/core';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatDividerModule } from '@angular/material/divider';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { ColumnsSearchFilterPipe } from './columns-search-filter.pipe';
import { MatListOption, MatSelectionList, MatSelectionListChange } from '@angular/material/list';
import { IconModule } from '../../../icon/icon.module';
@Component({
selector: 'adf-datatable-column-selector',
@@ -36,7 +36,7 @@ import { MatListOption, MatSelectionList, MatSelectionListChange } from '@angula
CommonModule,
TranslatePipe,
MatButtonModule,
MatIconModule,
IconModule,
MatDividerModule,
ReactiveFormsModule,
MatCheckboxModule,
lib/core/src/lib/datatable/components/datatable/datatable.component.html
+9 -9
View File
@@ -163,7 +163,7 @@
#mainMenuTrigger="matMenuTrigger"
(click)="onMainMenuOpen()"
[matMenuTriggerFor]="mainMenu">
<mat-icon>view_week_outline</mat-icon>
<mat-icon adf-icon="view_week_outline" />
</button>
<mat-menu #mainMenu (closed)="onMainMenuClosed()">
<div #mainMenuTemplate role="presentation" (keydown.tab)="$event.stopPropagation()">
@@ -213,7 +213,7 @@
class="adf-datatable-cell adf-datatable__actions-cell adf-datatable-hover-only">
<button mat-icon-button
[attr.aria-label]="'ADF-DATATABLE.ACCESSIBILITY.DRAG' | translate">
<mat-icon>drag_indicator</mat-icon>
<mat-icon adf-icon="drag_indicator" />
</button>
</div>
@@ -224,14 +224,14 @@
[title]="'ADF-DATATABLE.CONTENT-ACTIONS.TOOLTIP' | translate"
[attr.id]="'action_menu_left_' + idx"
[attr.data-automation-id]="'action_menu_' + idx">
<mat-icon>more_vert</mat-icon>
<mat-icon adf-icon="more_vert" />
</button>
<mat-menu #menu="matMenu">
<button mat-menu-item *ngFor="let action of getRowActions(row)"
[attr.data-automation-id]="action.title"
[disabled]="action.disabled"
(click)="onExecuteRowAction(row, action)">
<mat-icon *ngIf="action.icon">{{ action.icon }}</mat-icon>
<mat-icon *ngIf="action.icon" [adf-icon]="action.icon" />
<span>{{ action.title | translate }}</span>
</button>
</mat-menu>
@@ -282,9 +282,9 @@
<mat-icon
[attr.aria-label]="col.srTitle? (col.srTitle | translate) : null"
[attr.aria-hidden]="!asIconValue(row, col)"
*ngIf="isIconValue(row, col); else no_iconvalue">
{{ asIconValue(row, col) }}
</mat-icon>
*ngIf="isIconValue(row, col); else no_iconvalue"
[adf-icon]="asIconValue(row, col)"
/>
<ng-template #no_iconvalue>
<mat-icon class="adf-datatable-selected"
*ngIf="row.isSelected && !multiselect; else no_selected_row" svgIcon="selected" />
@@ -427,7 +427,7 @@
[attr.id]="'action_menu_right_' + idx"
[attr.data-automation-id]="'action_menu_' + idx"
(keydown.enter)="actionsMenuTrigger.openMenu()">
<mat-icon>more_vert</mat-icon>
<mat-icon adf-icon="more_vert" />
</button>
<mat-menu #menu="matMenu">
<button mat-menu-item *ngFor="let action of getRowActions(row)"
@@ -435,7 +435,7 @@
[attr.aria-label]="action.title | translate"
[disabled]="action.disabled"
(click)="onExecuteRowAction(row, action)">
<mat-icon *ngIf="action.icon">{{ action.icon }}</mat-icon>
<mat-icon *ngIf="action.icon" [adf-icon]="action.icon" />
<span>{{ action.title | translate }}</span>
</button>
</mat-menu>
lib/core/src/lib/datatable/components/datatable/datatable.component.ts
+3 -2
View File
@@ -60,7 +60,7 @@ import { DataCellEvent } from '../data-cell.event';
import { DataRowActionEvent } from '../data-row-action.event';
import { buffer, debounceTime, filter, map, share } from 'rxjs/operators';
import { CdkDrag, CdkDragDrop, CdkDragHandle, CdkDropList, moveItemInArray } from '@angular/cdk/drag-drop';
import { MatIconModule, MatIconRegistry } from '@angular/material/icon';
import { MatIconRegistry } from '@angular/material/icon';
import { DomSanitizer } from '@angular/platform-browser';
import { ResizeEvent } from '../../directives/resizable/types';
import { CommonModule } from '@angular/common';
@@ -83,6 +83,7 @@ import { JsonCellComponent } from '../json-cell/json-cell.component';
import { AmountCellComponent } from '../amount-cell/amount-cell.component';
import { NumberCellComponent } from '../number-cell/number-cell.component';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '../../../icon/icon.module';
// eslint-disable-next-line no-shadow
export enum ShowHeaderMode {
@@ -107,7 +108,7 @@ export enum ShowHeaderMode {
ResizeHandleDirective,
MatButtonModule,
MatMenuModule,
MatIconModule,
IconModule,
UploadDirective,
ContextMenuDirective,
FileTypePipe,
lib/core/src/lib/datatable/components/icon-cell/icon-cell.component.ts
+3 -3
View File
@@ -16,17 +16,17 @@
*/
import { ChangeDetectionStrategy, Component, ViewEncapsulation, computed } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
import { DataTableCellComponent } from '../datatable-cell/datatable-cell.component';
import { toSignal } from '@angular/core/rxjs-interop';
import { IconModule } from '../../../icon/icon.module';
@Component({
imports: [MatIconModule],
imports: [IconModule],
selector: 'adf-icon-cell',
changeDetection: ChangeDetectionStrategy.OnPush,
template: `
@if (icon()) {
<mat-icon [title]="title()" aria-hidden="true">{{ icon() }}</mat-icon>
<mat-icon [title]="title()" aria-hidden="true" [adf-icon]="icon()" />
}
`,
encapsulation: ViewEncapsulation.None,
lib/core/src/lib/dialogs/dialog/dialog.component.html
+3 -4
View File
@@ -13,9 +13,8 @@
*ngIf="data.headerIcon"
color="primary"
class="adf-dialog-header-icon"
>
{{ data.headerIcon }}
</mat-icon>
[adf-icon]="data.headerIcon"
/>
<h2 class="adf-dialog-title">{{ data.title | translate }}</h2>
</div>
<button
@@ -25,7 +24,7 @@
title="{{'CLOSE' | translate }}"
data-automation-id="adf-dialog-close-button"
>
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</div>
lib/core/src/lib/dialogs/dialog/dialog.component.ts
+2 -2
View File
@@ -22,9 +22,9 @@ import { BehaviorSubject } from 'rxjs';
import { DialogSize, DialogSizes } from './dialog.model';
import { CommonModule } from '@angular/common';
import { TranslatePipe } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '../../icon/icon.module';
export const DIALOG_COMPONENT_DATA = new InjectionToken<any>('dialog component data');
@@ -32,7 +32,7 @@ export const DIALOG_COMPONENT_DATA = new InjectionToken<any>('dialog component d
selector: 'adf-dialog',
templateUrl: './dialog.component.html',
styleUrls: ['./dialog.component.scss'],
imports: [CommonModule, TranslatePipe, MatIconModule, MatDialogModule, MatButtonModule],
imports: [CommonModule, TranslatePipe, IconModule, MatDialogModule, MatButtonModule],
encapsulation: ViewEncapsulation.None
})
export class DialogComponent {
lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.component.html
+1 -1
View File
@@ -6,7 +6,7 @@
mat-icon-button
[title]="'CLOSE' | translate"
[mat-dialog-close]="false">
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</h1>
<mat-dialog-content class="adf-unsaved-changes-dialog-content">
lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.component.ts
+6 -3
View File
@@ -22,10 +22,10 @@ import { MatCheckboxChange, MatCheckboxModule } from '@angular/material/checkbox
import { ReactiveFormsModule } from '@angular/forms';
import { TranslatePipe } from '@ngx-translate/core';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { CommonModule } from '@angular/common';
import { UserPreferencesService } from '../../common';
import { AppConfigValues } from '../../app-config';
import { IconModule } from '../../icon/icon.module';
/**
* Dialog which informs about unsaved changes. Allows discard them and proceed or close dialog and stop proceeding.
@@ -41,12 +41,15 @@ import { AppConfigValues } from '../../app-config';
templateUrl: './unsaved-changes-dialog.component.html',
styleUrls: ['./unsaved-changes-dialog.component.scss'],
host: { class: 'adf-unsaved-changes-dialog' },
imports: [MatDialogModule, TranslatePipe, MatButtonModule, MatIconModule, CommonModule, MatCheckboxModule, ReactiveFormsModule]
imports: [MatDialogModule, TranslatePipe, MatButtonModule, IconModule, CommonModule, MatCheckboxModule, ReactiveFormsModule]
})
export class UnsavedChangesDialogComponent implements OnInit {
dialogData: UnsavedChangesDialogData;
constructor(@Inject(MAT_DIALOG_DATA) public data: UnsavedChangesDialogData, private userPreferencesService: UserPreferencesService) {}
constructor(
@Inject(MAT_DIALOG_DATA) public data: UnsavedChangesDialogData,
private userPreferencesService: UserPreferencesService
) {}
ngOnInit() {
this.dialogData = {
lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.component.html
+8 -7
View File
@@ -18,13 +18,14 @@
[attr.aria-label]="chip.name"
(removed)="removedChip.emit(chip.id)">
<span id="adf-dynamic-chip-list-chip-name-{{ idx }}">{{ chip.name }}</span>
<mat-icon *ngIf="showDelete"
id="adf-dynamic-chip-list-delete-{{ chip.name }}"
class="adf-dynamic-chip-list-delete-icon"
[disabled]="disableDelete"
matChipRemove>
close
</mat-icon>
<mat-icon
*ngIf="showDelete"
id="adf-dynamic-chip-list-delete-{{ chip.name }}"
class="adf-dynamic-chip-list-delete-icon"
[disabled]="disableDelete"
adf-icon="close"
matChipRemove
/>
</mat-chip>
</mat-chip-set>
<button
lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.component.ts
+2 -2
View File
@@ -36,9 +36,9 @@ import {
} from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatChip, MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
import { TranslatePipe } from '@ngx-translate/core';
import { Chip } from './chip';
import { IconModule } from '../icon/icon.module';
/**
* This component shows dynamic list of chips which render depending on free space.
@@ -47,7 +47,7 @@ import { Chip } from './chip';
selector: 'adf-dynamic-chip-list',
templateUrl: './dynamic-chip-list.component.html',
styleUrls: ['./dynamic-chip-list.component.scss'],
imports: [MatChipsModule, TranslatePipe, NgForOf, MatIconModule, NgIf, MatButtonModule],
imports: [MatChipsModule, TranslatePipe, NgForOf, IconModule, NgIf, MatButtonModule],
encapsulation: ViewEncapsulation.None
})
export class DynamicChipListComponent implements OnChanges, OnInit, AfterViewInit, OnDestroy {
lib/core/src/lib/form/components/form-renderer.component.html
+1 -1
View File
@@ -95,7 +95,7 @@
[matTooltip]="'FORM.FORM_RENDERER.DELETE_ROW' | translate"
(click)="displayDialogToRemoveRow(currentRootElement.field, rowIndex)"
>
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
}
</div>
lib/core/src/lib/form/components/form-renderer.component.ts
+2 -2
View File
@@ -19,7 +19,6 @@ import { NgClass, NgForOf, NgIf, NgStyle, NgTemplateOutlet } from '@angular/comm
import { ChangeDetectorRef, Component, Inject, inject, Injector, Input, OnDestroy, OnInit, Optional, ViewEncapsulation } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatTabsModule } from '@angular/material/tabs';
import { TranslatePipe } from '@ngx-translate/core';
import { FormRulesManager, formRulesManagerFactory } from '../models/form-rules.model';
@@ -33,6 +32,7 @@ import { DecimalRenderMiddlewareService } from './middlewares/decimal-middleware
import { MatDialog } from '@angular/material/dialog';
import { ConfirmDialogComponent } from '../../../lib/dialogs/confirm-dialog/confirm.dialog';
import { MatTooltipModule } from '@angular/material/tooltip';
import { IconModule } from '../../icon/icon.module';
@Component({
selector: 'adf-form-renderer',
@@ -57,7 +57,7 @@ import { MatTooltipModule } from '@angular/material/tooltip';
NgTemplateOutlet,
TranslatePipe,
MatButtonModule,
MatIconModule,
IconModule,
NgStyle,
FormFieldComponent,
FormsModule,
lib/core/src/lib/form/components/widgets/error/error.component.html
+2 -2
View File
@@ -1,10 +1,10 @@
<div class="adf-error-container adf-error-widget-container">
<div *ngIf="error?.isActive()" [@transitionMessages]="subscriptAnimationState" class="adf-error">
<mat-icon class="adf-error-icon">error_outline</mat-icon>
<mat-icon class="adf-error-icon" adf-icon="error_outline" />
<div class="adf-error-text">{{ error.message | translate:translateParameters }}</div>
</div>
<div *ngIf="required" [@transitionMessages]="subscriptAnimationState" class="adf-error">
<mat-icon class="adf-error-icon">error_outline</mat-icon>
<mat-icon class="adf-error-icon" adf-icon="error_outline" />
<div class="adf-error-text">{{ required }}</div>
</div>
</div>
lib/core/src/lib/form/components/widgets/error/error.component.ts
+2 -2
View File
@@ -20,11 +20,11 @@
import { animate, state, style, transition, trigger } from '@angular/animations';
import { NgIf } from '@angular/common';
import { Component, Input, OnChanges, SimpleChanges, ViewEncapsulation } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
import { TranslatePipe } from '@ngx-translate/core';
import { FormService } from '../../../services/form.service';
import { ErrorMessageModel } from '../core';
import { WidgetComponent } from '../widget.component';
import { IconModule } from '../../../../icon/icon.module';
@Component({
selector: 'error-widget',
@@ -53,7 +53,7 @@ import { WidgetComponent } from '../widget.component';
'(invalid)': 'event($event)',
'(select)': 'event($event)'
},
imports: [NgIf, MatIconModule, TranslatePipe],
imports: [NgIf, IconModule, TranslatePipe],
encapsulation: ViewEncapsulation.None
})
export class ErrorWidgetComponent extends WidgetComponent implements OnChanges {
lib/core/src/lib/form/components/widgets/header/header.widget.html
+1 -1
View File
@@ -30,7 +30,7 @@
class="mdl-button--icon"
(click)="onExpanderClicked(element)"
>
<mat-icon> {{ element?.isExpanded ? 'expand_more' : 'expand_less' }} </mat-icon>
<mat-icon [adf-icon]="element?.isExpanded ? 'expand_more' : 'expand_less'" />
</button>
}
</ng-template>
lib/core/src/lib/form/components/widgets/header/header.widget.ts
+2 -2
View File
@@ -18,17 +18,17 @@
import { Component, Input, ViewEncapsulation } from '@angular/core';
import { ContainerModel } from '../core/container.model';
import { FieldStylePipe } from './../../../pipes/field-style.pipe';
import { MatIconModule } from '@angular/material/icon';
import { NgTemplateOutlet } from '@angular/common';
import { TranslatePipe } from '@ngx-translate/core';
import { MatButtonModule } from '@angular/material/button';
import { IconModule } from '../../../../icon/icon.module';
@Component({
selector: 'adf-header-widget',
templateUrl: './header.widget.html',
styleUrls: ['./header.widget.scss'],
encapsulation: ViewEncapsulation.None,
imports: [FieldStylePipe, MatIconModule, MatButtonModule, TranslatePipe, NgTemplateOutlet]
imports: [FieldStylePipe, IconModule, MatButtonModule, TranslatePipe, NgTemplateOutlet]
})
export class HeaderWidgetComponent {
@Input() element: ContainerModel;
lib/core/src/lib/form/components/widgets/repeat/repeat.widget.html
+1 -1
View File
@@ -20,7 +20,7 @@
[disabled]="element.field.readOnly"
(click)="addRow()"
>
<mat-icon>add</mat-icon> {{ 'FORM.FIELD.REPEATABLE_SECTION.ADD_ROW' | translate }}
<mat-icon adf-icon="add" /> {{ 'FORM.FIELD.REPEATABLE_SECTION.ADD_ROW' | translate }}
</button>
} @else {
<span class="adf-container-widget-row-action adf-container-widget-row-limit">{{ 'FORM.FIELD.REPEATABLE_SECTION.ROW_LIMIT_REACHED' | translate: { limit: element.field.params.maxNumberOfRows } }}</span>
lib/core/src/lib/form/components/widgets/repeat/repeat.widget.ts
+2 -2
View File
@@ -17,17 +17,17 @@
import { Component, Input, ViewEncapsulation } from '@angular/core';
import { FieldStylePipe } from '../../../pipes/field-style.pipe';
import { MatIconModule } from '@angular/material/icon';
import { TranslatePipe } from '@ngx-translate/core';
import { MatButtonModule } from '@angular/material/button';
import { ContainerModel } from '../core/container.model';
import { IconModule } from '../../../../icon/icon.module';
@Component({
selector: 'adf-repeat-widget',
templateUrl: './repeat.widget.html',
styleUrls: ['./repeat.widget.scss'],
encapsulation: ViewEncapsulation.None,
imports: [FieldStylePipe, MatIconModule, MatButtonModule, TranslatePipe]
imports: [FieldStylePipe, IconModule, MatButtonModule, TranslatePipe]
})
export class RepeatWidgetComponent {
@Input() element: ContainerModel;
lib/core/src/lib/form/components/widgets/unknown/unknown.widget.ts
+3 -3
View File
@@ -18,17 +18,17 @@
/* eslint-disable @angular-eslint/component-selector */
import { Component, ViewEncapsulation } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
import { MatListModule } from '@angular/material/list';
import { FormService } from '../../../services/form.service';
import { WidgetComponent } from '../widget.component';
import { IconModule } from '../../../../icon/icon.module';
@Component({
selector: 'unknown-widget',
template: `
<mat-list class="adf-unknown-widget">
<mat-list-item>
<mat-icon class="mat-24">error_outline</mat-icon>
<mat-icon class="mat-24" adf-icon="error_outline" />
<span class="adf-unknown-text">Unknown type: {{ field.type }}</span>
</mat-list-item>
</mat-list>
@@ -45,7 +45,7 @@ import { WidgetComponent } from '../widget.component';
'(invalid)': 'event($event)',
'(select)': 'event($event)'
},
imports: [MatListModule, MatIconModule],
imports: [MatListModule, IconModule],
encapsulation: ViewEncapsulation.None
})
export class UnknownWidgetComponent extends WidgetComponent {
lib/core/src/lib/icon/icon.component.mock.ts
+28
View File
@@ -0,0 +1,28 @@
/*!
* @license
* Copyright © 2005-2025 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component } from '@angular/core';
import { IconModule } from './icon.module';
@Component({
template: `<mat-icon [adf-icon]="name" />`,
standalone: true,
imports: [IconModule]
})
export class IconComponent {
name: string;
}
lib/core/src/lib/icon/icon.directive.spec.ts
+7 -18
View File
@@ -15,36 +15,25 @@
* limitations under the License.
*/
import { Component } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
import { IconDirective } from './icon.directive';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { IconType, MatIconHarness, MatIconTestingModule } from '@angular/material/icon/testing';
import { HarnessLoader } from '@angular/cdk/testing';
import { ICON_ALIAS_MAP_TOKEN } from './icon-alias-map.token';
@Component({
template: `<mat-icon adf-icon [name]="name" />`,
standalone: true,
imports: [MatIconModule, IconDirective]
})
class TestComponent {
name: string;
}
import { IconComponent } from './icon.component.mock';
describe('IconDirective', () => {
let fixture: ComponentFixture<TestComponent>;
let component: TestComponent;
let fixture: ComponentFixture<IconComponent>;
let component: IconComponent;
let loader: HarnessLoader;
describe('alias map NOT provided', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [TestComponent, MatIconTestingModule]
imports: [IconComponent, MatIconTestingModule]
});
fixture = TestBed.createComponent(TestComponent);
fixture = TestBed.createComponent(IconComponent);
component = fixture.componentInstance;
loader = TestbedHarnessEnvironment.loader(fixture);
});
@@ -62,7 +51,7 @@ describe('IconDirective', () => {
describe('alias map provided', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [TestComponent, MatIconTestingModule],
imports: [IconComponent, MatIconTestingModule],
providers: [
{
provide: ICON_ALIAS_MAP_TOKEN,
@@ -73,7 +62,7 @@ describe('IconDirective', () => {
]
});
fixture = TestBed.createComponent(TestComponent);
fixture = TestBed.createComponent(IconComponent);
component = fixture.componentInstance;
loader = TestbedHarnessEnvironment.loader(fixture);
});
lib/core/src/lib/icon/icon.directive.ts
+6 -5
View File
@@ -16,18 +16,19 @@
*/
import { Directive, ElementRef, inject, Input, OnChanges } from '@angular/core';
import { ICON_ALIAS_MAP_TOKEN } from './icon-alias-map.token';
import { MatIcon } from '@angular/material/icon';
import { ICON_ALIAS_MAP_TOKEN } from './icon-alias-map.token';
@Directive({
selector: 'mat-icon[adf-icon]'
selector: 'mat-icon[adf-icon]',
standalone: false
})
export class IconDirective implements OnChanges {
private readonly matIcon = inject(MatIcon);
private readonly elementRef: ElementRef<HTMLElement> = inject(ElementRef);
private readonly aliasMap = inject(ICON_ALIAS_MAP_TOKEN, { optional: true });
@Input() name: string;
@Input('adf-icon') name: string;
ngOnChanges() {
const iconAlias = this.aliasMap?.[this.name];
@@ -40,7 +41,7 @@ export class IconDirective implements OnChanges {
}
private appendLigatureText() {
this.resetSvg();
this.resetSvgIcon();
const element = this.elementRef.nativeElement;
const textNode = this.findTextNode(element);
@@ -56,7 +57,7 @@ export class IconDirective implements OnChanges {
return Array.from(element.childNodes).find((node: ChildNode) => node.nodeType === Node.TEXT_NODE);
}
private resetSvg() {
private resetSvgIcon() {
this.matIcon.svgIcon = null;
}
}
lib/core/src/lib/icon/icon.module.ts
+27
View File
@@ -0,0 +1,27 @@
/*!
* @license
* Copyright © 2005-2025 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { NgModule } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
import { IconDirective } from './icon.directive';
@NgModule({
declarations: [IconDirective],
imports: [MatIconModule],
exports: [MatIconModule, IconDirective]
})
export class IconModule {}
lib/core/src/lib/icon/public-api.ts
+2 -1
View File
@@ -16,6 +16,7 @@
*/
export * from './icon.component';
export * from './icon-alias-map.type';
export * from './icon-alias-map.token';
export * from './icon-alias-map.type';
export * from './icon.directive';
export * from './icon.module';
lib/core/src/lib/info-drawer/info-drawer.component.html
+1 -1
View File
@@ -18,7 +18,7 @@
class="adf-info-drawer-tab">
<ng-template mat-tab-label>
<mat-icon *ngIf="contentBlock.icon">{{ contentBlock.icon }}</mat-icon>
<mat-icon *ngIf="contentBlock.icon" [adf-icon]="contentBlock.icon" />
<span *ngIf="contentBlock.label">{{ contentBlock.label | translate }}</span>
</ng-template>
lib/core/src/lib/info-drawer/info-drawer.component.ts
+2 -2
View File
@@ -36,7 +36,7 @@ import {
InfoDrawerTitleDirective
} from './info-drawer-layout.component';
import { TranslatePipe } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { IconModule } from '../icon/icon.module';
@Component({
selector: 'adf-info-drawer-tab',
@@ -63,7 +63,7 @@ export class InfoDrawerTabComponent {
InfoDrawerLayoutComponent,
TranslatePipe,
MatTabsModule,
MatIconModule,
IconModule,
InfoDrawerButtonsDirective,
InfoDrawerTitleDirective,
InfoDrawerContentDirective,
lib/core/src/lib/language-menu/language-picker.component.ts
+3 -3
View File
@@ -21,14 +21,14 @@ import { CommonModule } from '@angular/common';
import { MatMenu, MatMenuItem, MatMenuModule } from '@angular/material/menu';
import { TranslatePipe } from '@ngx-translate/core';
import { LanguageMenuComponent } from './language-menu.component';
import { MatIconModule } from '@angular/material/icon';
import { IconModule } from '../icon/icon.module';
@Component({
selector: 'adf-picker-button',
imports: [CommonModule, MatMenuModule, TranslatePipe, LanguageMenuComponent, MatIconModule],
imports: [CommonModule, MatMenuModule, TranslatePipe, LanguageMenuComponent, IconModule],
template: `
<button mat-menu-item [matMenuTriggerFor]="langMenu">
<mat-icon>language</mat-icon>
<mat-icon adf-icon="language" />
{{ 'ADF.LANGUAGE' | translate }}
</button>
<mat-menu #langMenu="matMenu">
lib/core/src/lib/layout/components/header/header.component.html
+2 -10
View File
@@ -12,11 +12,7 @@
(click)="toggleMenu()"
[attr.aria-expanded]="expandedSidenav"
[attr.aria-label]="'CORE.HEADER.ACCESSIBILITY.SIDEBAR_TOGGLE_BUTTON_ARIA_LABEL' | translate">
<mat-icon
class="adf-menu-icon-header"
role="img"
aria-hidden="true">{{ toggleIcon }}
</mat-icon>
<mat-icon class="adf-menu-icon-header" role="img" aria-hidden="true" [adf-icon]="toggleIcon" />
</button>
<a *ngIf="showLogo" [routerLink]="redirectUrl" title="{{ tooltip }}">
@@ -47,10 +43,6 @@
(click)="toggleMenu()"
[attr.aria-expanded]="expandedSidenav"
[attr.aria-label]="'CORE.HEADER.ACCESSIBILITY.SIDEBAR_TOGGLE_BUTTON_ARIA_LABEL' | translate">
<mat-icon
class="adf-menu-icon-header"
role="img"
aria-hidden="true">{{ toggleIcon }}
</mat-icon>
<mat-icon class="adf-menu-icon-header" role="img" aria-hidden="true" [adf-icon]="toggleIcon" />
</button>
</mat-toolbar>
lib/core/src/lib/layout/components/header/header.component.ts
+2 -2
View File
@@ -21,13 +21,13 @@ import { AppConfigService } from '../../../app-config/app-config.service';
import { CommonModule } from '@angular/common';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { RouterModule } from '@angular/router';
import { TranslatePipe } from '@ngx-translate/core';
import { IconModule } from '../../../icon/icon.module';
@Component({
selector: 'adf-layout-header',
imports: [CommonModule, MatToolbarModule, MatButtonModule, MatIconModule, RouterModule, TranslatePipe],
imports: [CommonModule, MatToolbarModule, MatButtonModule, IconModule, RouterModule, TranslatePipe],
templateUrl: './header.component.html',
styleUrls: ['./header.component.scss'],
encapsulation: ViewEncapsulation.None,
lib/core/src/lib/login/components/login/login.component.html
+3 -5
View File
@@ -32,7 +32,7 @@
id="login-error"
data-automation-id="login-error"
class="adf-error adf-error-message">
<mat-icon class="adf-error-icon">warning</mat-icon>
<mat-icon class="adf-error-icon" adf-icon="warning" />
<span class="adf-login-error-message">
{{ errorMsg | translate }}
</span>
@@ -91,9 +91,7 @@
(click)="toggleShowPassword($event)"
(keyup.enter)="toggleShowPassword($event)"
[attr.data-automation-id]="isPasswordShow ? 'hide_password' : 'show_password'">
<mat-icon class="adf-login-form-password-icon adf-login-password-icon">
{{ isPasswordShow ? 'visibility' : 'visibility_off' }}
</mat-icon>
<mat-icon class="adf-login-form-password-icon adf-login-password-icon" [adf-icon]="isPasswordShow ? 'visibility' : 'visibility_off'" />
</button>
</mat-form-field>
<span class="adf-login-validation"
@@ -142,7 +140,7 @@
<span class="adf-login-button-label">
{{ 'LOGIN.BUTTON.WELCOME' | translate }}
</span>
<mat-icon class="adf-welcome-icon">done</mat-icon>
<mat-icon class="adf-welcome-icon" adf-icon="done" />
</div>
</button>
<div *ngIf="showRememberMe" class="adf-login__remember-me">
lib/core/src/lib/login/components/login/login.component.ts
+2 -2
View File
@@ -22,7 +22,6 @@ import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { ActivatedRoute, Params, Router } from '@angular/router';
@@ -37,6 +36,7 @@ import { LoginErrorEvent } from '../../models/login-error.event';
import { LoginSubmitEvent } from '../../models/login-submit.event';
import { LoginSuccessEvent } from '../../models/login-success.event';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '../../../icon/icon.module';
// eslint-disable-next-line no-shadow
enum LoginSteps {
@@ -65,7 +65,7 @@ interface LoginFormValues {
MatCardModule,
ReactiveFormsModule,
TranslatePipe,
MatIconModule,
IconModule,
MatFormFieldModule,
MatInputModule,
MatButtonModule,
lib/core/src/lib/notifications/components/notification-history.component.html
+13 -18
View File
@@ -1,17 +1,14 @@
<button mat-button
[matMenuTriggerFor]="menu"
aria-hidden="false"
[attr.aria-label]="('NOTIFICATIONS.' + (notifications.length ? 'UNREAD_MESSAGES' : 'NO_MESSAGE') | translate) + ' ' + ('NOTIFICATIONS.OPEN_HISTORY' | translate)"
title="{{ 'NOTIFICATIONS.OPEN_HISTORY' | translate }}"
class="adf-notification-history-menu_button"
id="adf-notification-history-open-button"
(menuOpened)="onMenuOpened()">
<mat-icon matBadge="&#8288;"
[matBadgeHidden]="!notifications.length"
class="adf-notification-history-menu_button-icon"
matBadgeColor="accent"
matBadgeSize="small">notifications
</mat-icon>
<button
mat-button
[matMenuTriggerFor]="menu"
aria-hidden="false"
[attr.aria-label]="('NOTIFICATIONS.' + (notifications.length ? 'UNREAD_MESSAGES' : 'NO_MESSAGE') | translate) + ' ' + ('NOTIFICATIONS.OPEN_HISTORY' | translate)"
title="{{ 'NOTIFICATIONS.OPEN_HISTORY' | translate }}"
class="adf-notification-history-menu_button"
id="adf-notification-history-open-button"
(menuOpened)="onMenuOpened()"
>
<mat-icon matBadge="&#8288;" [matBadgeHidden]="!notifications.length" class="adf-notification-history-menu_button-icon" matBadgeColor="accent" matBadgeSize="small" adf-icon="notifications" />
</button>
<mat-menu #menu="matMenu"
@@ -29,7 +26,7 @@
(click)="markAsRead()"
#markAsReadButton
(keydown)="manageFocus($event)">
<mat-icon class="adf-notification-history-mark-as-read-icon">done_all</mat-icon>
<mat-icon class="adf-notification-history-mark-as-read-icon" adf-icon="done_all" />
</button>
</div>
@@ -46,9 +43,7 @@
<div *ngIf="notification.initiator; else no_avatar"
[outerHTML]="notification.initiator | usernameInitials : 'adf-notification-initiator-pic'"></div>
<ng-template #no_avatar>
<mat-icon class="adf-notification-history-menu-initiator">
{{ notification.icon }}
</mat-icon>
<mat-icon class="adf-notification-history-menu-initiator" [adf-icon]="notification.icon" />
</ng-template>
<div class="adf-notification-history-menu-item-content-message">
<p class="adf-notification-history-menu-text adf-notification-history-menu-message"
lib/core/src/lib/notifications/components/notification-history.component.ts
+2 -2
View File
@@ -35,7 +35,6 @@ import { StorageService } from '../../common/services/storage.service';
import { PaginationModel } from '../../models/pagination.model';
import { MatButton, MatButtonModule, MatIconButton } from '@angular/material/button';
import { TranslatePipe } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { MatBadgeModule } from '@angular/material/badge';
import { MatListModule } from '@angular/material/list';
import { NgForOf, NgIf } from '@angular/common';
@@ -43,6 +42,7 @@ import { InitialUsernamePipe, TimeAgoPipe } from '../../pipes';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { FocusKeyManager } from '@angular/cdk/a11y';
import { IconModule } from '../../icon/icon.module';
@Component({
selector: 'adf-notification-history',
@@ -52,7 +52,7 @@ import { FocusKeyManager } from '@angular/cdk/a11y';
MatButtonModule,
MatMenuModule,
TranslatePipe,
MatIconModule,
IconModule,
MatBadgeModule,
MatListModule,
NgIf,
lib/core/src/lib/pagination/pagination.component.html
+4 -4
View File
@@ -18,7 +18,7 @@
mat-icon-button
[attr.aria-label]="'CORE.PAGINATION.ARIA.ITEMS_PER_PAGE' | translate"
[matMenuTriggerFor]="pageSizeMenu">
<mat-icon>arrow_drop_down</mat-icon>
<mat-icon adf-icon="arrow_drop_down" />
</button>
<mat-menu #pageSizeMenu="matMenu" class="adf-pagination__page-selector">
@@ -42,7 +42,7 @@
[attr.aria-label]="'CORE.PAGINATION.ARIA.CURRENT_PAGE' | translate"
[matMenuTriggerFor]="pagesMenu"
*ngIf="lastPage > 1">
<mat-icon>arrow_drop_down</mat-icon>
<mat-icon adf-icon="arrow_drop_down" />
</button>
<div *ngIf="pagination.totalItems">
@@ -68,7 +68,7 @@
[attr.aria-label]="'CORE.PAGINATION.ARIA.PREVIOUS_PAGE' | translate"
[disabled]="isFirstPage"
(click)="goPrevious()">
<mat-icon>keyboard_arrow_left</mat-icon>
<mat-icon adf-icon="keyboard_arrow_left" />
</button>
<button
@@ -77,7 +77,7 @@
[attr.aria-label]="'CORE.PAGINATION.ARIA.NEXT_PAGE' | translate"
[disabled]="isLastPage"
(click)="goNext()">
<mat-icon>keyboard_arrow_right</mat-icon>
<mat-icon adf-icon="keyboard_arrow_right" />
</button>
</div>
</ng-container>
lib/core/src/lib/pagination/pagination.component.ts
+2 -2
View File
@@ -36,9 +36,9 @@ import { UserPreferencesService, UserPreferenceValues } from '../common/services
import { TranslatePipe, TranslateService } from '@ngx-translate/core';
import { CommonModule } from '@angular/common';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '../icon/icon.module';
export type PaginationAction = 'NEXT_PAGE' | 'PREV_PAGE' | 'CHANGE_PAGE_SIZE' | 'CHANGE_PAGE_NUMBER';
@@ -57,7 +57,7 @@ export const DEFAULT_PAGINATION: PaginationModel = {
styleUrls: ['./pagination.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
imports: [CommonModule, TranslatePipe, MatButtonModule, MatIconModule, MatMenuModule]
imports: [CommonModule, TranslatePipe, MatButtonModule, IconModule, MatMenuModule]
})
export class PaginationComponent implements OnInit, PaginationComponentInterface {
private _pagination: PaginationModel;
lib/core/src/lib/search-text/search-text-input.component.html
+2 -2
View File
@@ -10,7 +10,7 @@
[title]="'CORE.SEARCH.BUTTON.TOOLTIP' | translate"
(click)="toggleSearchBar()"
(keyup.enter)="toggleSearchBar()">
<mat-icon [attr.aria-label]="'CORE.SEARCH.BUTTON.ARIA-LABEL' | translate">search</mat-icon>
<mat-icon [attr.aria-label]="'CORE.SEARCH.BUTTON.ARIA-LABEL' | translate" adf-icon="search" />
</button>
<mat-form-field class="adf-input-form-field-divider" [hintLabel]="hintLabel">
<mat-label *ngIf='label'>{{label}}</mat-label>
@@ -37,7 +37,7 @@
[title]="'CORE.SEARCH.FILTER.BUTTONS.CLOSE' | translate"
(click)="resetSearch()"
(keyup.enter)="resetSearch()">
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</mat-form-field>
</div>
lib/core/src/lib/search-text/search-text-input.component.ts
+2 -2
View File
@@ -33,7 +33,6 @@ import {
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { TranslatePipe } from '@ngx-translate/core';
import { Observable, Subject, Subscription } from 'rxjs';
@@ -43,6 +42,7 @@ import { searchAnimation } from './animations';
import { SearchAnimationDirection, SearchAnimationState, SearchTextStateEnum } from './models/search-text-input.model';
import { SearchTriggerDirective } from './search-trigger.directive';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '../icon/icon.module';
@Component({
selector: 'adf-search-text-input',
@@ -50,7 +50,7 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
styleUrls: ['./search-text-input.component.scss'],
animations: [searchAnimation],
encapsulation: ViewEncapsulation.None,
imports: [MatButtonModule, MatIconModule, TranslatePipe, MatFormFieldModule, MatInputModule, FormsModule, SearchTriggerDirective, NgIf, NgClass],
imports: [MatButtonModule, IconModule, TranslatePipe, MatFormFieldModule, MatInputModule, FormsModule, SearchTriggerDirective, NgIf, NgClass],
host: {
class: 'adf-search-text-input'
}
lib/core/src/lib/snackbar-content/snackbar-content.component.html
+2 -2
View File
@@ -1,6 +1,6 @@
<p class="adf-snackbar-message-content" data-automation-id="adf-snackbar-message-content" aria-hidden="true">
@if (data.decorativeIcon) {
<mat-icon data-automation-id="adf-snackbar-decorative-icon">{{ data.decorativeIcon }}</mat-icon>
<mat-icon data-automation-id="adf-snackbar-decorative-icon" [adf-icon]="data.decorativeIcon" />
}
{{ data.message }}
</p>
@@ -16,7 +16,7 @@
@if (data.actionIcon) {
<button mat-button (click)="onIconClicked()" class="adf-snackbar-message-content-action-icon"
[attr.aria-label]="data.actionIconAriaLabel | translate">
<mat-icon>{{ data.actionIcon }}</mat-icon>
<mat-icon [adf-icon]="data.actionIcon" />
</button>
}
</div>
lib/core/src/lib/snackbar-content/snackbar-content.component.ts
+6 -3
View File
@@ -18,13 +18,13 @@
import { Component, Inject } from '@angular/core';
import { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';
import { SnackBarData } from './snack-bar-data';
import { MatIconModule } from '@angular/material/icon';
import { TranslatePipe } from '@ngx-translate/core';
import { MatButtonModule } from '@angular/material/button';
import { IconModule } from '../icon/icon.module';
@Component({
selector: 'adf-snackbar-content',
imports: [MatIconModule, TranslatePipe, MatButtonModule],
imports: [IconModule, TranslatePipe, MatButtonModule],
templateUrl: './snackbar-content.component.html',
styleUrls: ['./snackbar-content.component.scss'],
host: {
@@ -32,7 +32,10 @@ import { MatButtonModule } from '@angular/material/button';
}
})
export class SnackbarContentComponent {
constructor(public snackBarRef: MatSnackBarRef<SnackbarContentComponent>, @Inject(MAT_SNACK_BAR_DATA) public data: SnackBarData) {
constructor(
public snackBarRef: MatSnackBarRef<SnackbarContentComponent>,
@Inject(MAT_SNACK_BAR_DATA) public data: SnackBarData
) {
if (!data) {
this.data = { message: '' };
}
lib/core/src/lib/sorting-picker/sorting-picker.component.html
+2 -2
View File
@@ -8,6 +8,6 @@
</mat-form-field>
<button *ngIf="selected" class="adf-sorting-picker-button" mat-icon-button (click)="toggleSortDirection()" aria-label="'CORE.SEARCH.TOGGLE_ASC_DESC_ORDER' | translate">
<mat-icon *ngIf="ascending">arrow_upward</mat-icon>
<mat-icon *ngIf="!ascending">arrow_downward</mat-icon>
<mat-icon *ngIf="ascending" adf-icon="arrow_upward" />
<mat-icon *ngIf="!ascending" adf-icon="arrow_downward" />
</button>
lib/core/src/lib/sorting-picker/sorting-picker.component.ts
+2 -2
View File
@@ -21,11 +21,11 @@ import { CommonModule } from '@angular/common';
import { TranslatePipe } from '@ngx-translate/core';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { IconModule } from '../icon/icon.module';
@Component({
selector: 'adf-sorting-picker',
imports: [CommonModule, TranslatePipe, MatFormFieldModule, MatSelectModule, MatButtonModule, MatIconModule],
imports: [CommonModule, TranslatePipe, MatFormFieldModule, MatSelectModule, MatButtonModule, IconModule],
templateUrl: './sorting-picker.component.html',
encapsulation: ViewEncapsulation.None,
host: { class: 'adf-sorting-picker' }
lib/core/src/lib/viewer/components/img-viewer/img-viewer.component.html
+7 -7
View File
@@ -19,7 +19,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.ZOOM_OUT' | translate }}"
mat-icon-button
(click)="zoomOut()">
<mat-icon>zoom_out</mat-icon>
<mat-icon adf-icon="zoom_out" />
</button>
<div class="adf-image-viewer__toolbar-page-scale" data-automation-id="adf-page-scale">
@@ -31,7 +31,7 @@
title="{{ 'ADF_VIEWER.ARIA.ZOOM_IN' | translate }}"
attr.aria-label="{{ 'ADF_VIEWER.ARIA.ZOOM_IN' | translate }}"
(click)="zoomIn()">
<mat-icon>zoom_in</mat-icon>
<mat-icon adf-icon="zoom_in" />
</button>
<button *ngIf="!readOnly && allowedEditActions.rotate" id="viewer-rotate-button"
@@ -39,14 +39,14 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.ROTATE' | translate }}"
mat-icon-button
(click)="rotateImage()">
<mat-icon>rotate_left</mat-icon>
<mat-icon adf-icon="rotate_left" />
</button>
<button *ngIf="!readOnly && allowedEditActions.crop" id="viewer-crop-button"
title="{{ 'ADF_VIEWER.ARIA.CROP' | translate }}"
attr.aria-label="{{ 'ADF_VIEWER.ARIA.CROP' | translate }}"
mat-icon-button
(click)="cropImage()">
<mat-icon>crop</mat-icon>
<mat-icon adf-icon="crop" />
</button>
<button id="viewer-reset-button"
@@ -54,7 +54,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.RESET' | translate }}"
mat-icon-button
(click)="reset()">
<mat-icon>zoom_out_map</mat-icon>
<mat-icon adf-icon="zoom_out_map" />
</button>
</adf-toolbar>
@@ -65,7 +65,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.CANCEL' | translate }}"
mat-icon-button
(click)="reset()">
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
<button id="viewer-save-button"
@@ -73,7 +73,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.SAVE' | translate }}"
mat-icon-button
(click)="save()">
<mat-icon>check</mat-icon>
<mat-icon adf-icon="check" />
</button>
</adf-toolbar>
lib/core/src/lib/viewer/components/img-viewer/img-viewer.component.ts
+2 -2
View File
@@ -31,19 +31,19 @@ import {
ViewEncapsulation
} from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { TranslatePipe } from '@ngx-translate/core';
import Cropper from 'cropperjs';
import { AppConfigService } from '../../../app-config';
import { UrlService } from '../../../common';
import { ToolbarComponent } from '../../../toolbar';
import { IconModule } from '../../../icon/icon.module';
@Component({
selector: 'adf-img-viewer',
templateUrl: './img-viewer.component.html',
styleUrls: ['./img-viewer.component.scss'],
host: { class: 'adf-image-viewer' },
imports: [ToolbarComponent, TranslatePipe, MatIconModule, MatButtonModule, NgIf],
imports: [ToolbarComponent, TranslatePipe, IconModule, MatButtonModule, NgIf],
encapsulation: ViewEncapsulation.None
})
export class ImgViewerComponent implements AfterViewInit, OnChanges, OnDestroy {
lib/core/src/lib/viewer/components/pdf-viewer-password-dialog/pdf-viewer-password-dialog.html
+1 -1
View File
@@ -1,5 +1,5 @@
<div mat-dialog-title>
<mat-icon>lock</mat-icon>
<mat-icon adf-icon="lock" />
</div>
<mat-dialog-content>
lib/core/src/lib/viewer/components/pdf-viewer-password-dialog/pdf-viewer-password-dialog.ts
+6 -3
View File
@@ -21,9 +21,9 @@ import { MatButtonModule } from '@angular/material/button';
import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
import { ReactiveFormsModule, UntypedFormControl, Validators } from '@angular/forms';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { TranslatePipe } from '@ngx-translate/core';
import { IconModule } from '../../../icon/icon.module';
declare const pdfjsLib: any;
@@ -31,13 +31,16 @@ declare const pdfjsLib: any;
selector: 'adf-pdf-viewer-password-dialog',
templateUrl: './pdf-viewer-password-dialog.html',
styleUrls: ['./pdf-viewer-password-dialog.scss'],
imports: [MatDialogModule, MatIconModule, MatFormFieldModule, MatInputModule, ReactiveFormsModule, TranslatePipe, NgIf, MatButtonModule],
imports: [MatDialogModule, IconModule, MatFormFieldModule, MatInputModule, ReactiveFormsModule, TranslatePipe, NgIf, MatButtonModule],
encapsulation: ViewEncapsulation.None
})
export class PdfPasswordDialogComponent implements OnInit {
passwordFormControl: UntypedFormControl;
constructor(private dialogRef: MatDialogRef<PdfPasswordDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) {}
constructor(
private dialogRef: MatDialogRef<PdfPasswordDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any
) {}
ngOnInit() {
this.passwordFormControl = new UntypedFormControl('', [Validators.required]);
lib/core/src/lib/viewer/components/pdf-viewer/pdf-viewer.component.html
+7 -7
View File
@@ -8,7 +8,7 @@
(click)="toggleThumbnails()"
[attr.aria-label]="'ADF_VIEWER.ARIA.THUMBNAILS_PANLEL_CLOSE' | translate"
title="{{ 'ADF_VIEWER.ACTIONS.CLOSE' | translate }}">
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</div>
@@ -52,7 +52,7 @@
data-automation-id="adf-thumbnails-button"
[disabled]="isPanelDisabled"
(click)="toggleThumbnails()">
<mat-icon>dashboard</mat-icon>
<mat-icon adf-icon="dashboard" />
</button>
<adf-toolbar-divider />
</ng-container>
@@ -62,7 +62,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.PREVIOUS_PAGE' | translate }}"
mat-icon-button
(click)="previousPage()">
<mat-icon>keyboard_arrow_up</mat-icon>
<mat-icon adf-icon="keyboard_arrow_up" />
</button>
<button id="viewer-next-page-button"
@@ -70,7 +70,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.NEXT_PAGE' | translate }}"
mat-icon-button
(click)="nextPage()">
<mat-icon>keyboard_arrow_down</mat-icon>
<mat-icon adf-icon="keyboard_arrow_down" />
</button>
<div class="adf-pdf-viewer__toolbar-page-selector">
@@ -95,7 +95,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.ZOOM_IN' | translate }}"
mat-icon-button
(click)="zoomIn()">
<mat-icon>zoom_in</mat-icon>
<mat-icon adf-icon="zoom_in" />
</button>
<button id="viewer-zoom-out-button"
@@ -103,7 +103,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.ZOOM_OUT' | translate }}"
mat-icon-button
(click)="zoomOut()">
<mat-icon>zoom_out</mat-icon>
<mat-icon adf-icon="zoom_out" />
</button>
<button id="viewer-scale-page-button"
@@ -112,7 +112,7 @@
attr.aria-label="{{ 'ADF_VIEWER.ARIA.FIT_PAGE' | translate }}"
mat-icon-button
(click)="pageFit()">
<mat-icon>zoom_out_map</mat-icon>
<mat-icon adf-icon="zoom_out_map" />
</button>
</adf-toolbar>
lib/core/src/lib/viewer/components/pdf-viewer/pdf-viewer.component.ts
+2 -2
View File
@@ -36,7 +36,6 @@ import {
} from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatDialog } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { TranslatePipe } from '@ngx-translate/core';
import { from, Subject, switchMap } from 'rxjs';
@@ -49,6 +48,7 @@ import { PdfThumbListComponent } from '../pdf-viewer-thumbnails/pdf-viewer-thumb
import * as pdfjsLib from 'pdfjs-dist/build/pdf.min.mjs';
import { EventBus, PDFViewer } from 'pdfjs-dist/web/pdf_viewer.mjs';
import { OnProgressParameters, PDFDocumentLoadingTask, PDFDocumentProxy } from 'pdfjs-dist/types/src/display/api';
import { IconModule } from '../../../icon/icon.module';
export type PdfScaleMode = 'init' | 'page-actual' | 'page-width' | 'page-height' | 'page-fit' | 'auto';
@@ -63,7 +63,7 @@ export const PDFJS_VIEWER_MODULE = new InjectionToken('PDFJS_VIEWER_MODULE', { f
host: { class: 'adf-pdf-viewer' },
imports: [
MatButtonModule,
MatIconModule,
IconModule,
TranslatePipe,
PdfThumbListComponent,
NgIf,
lib/core/src/lib/viewer/components/unknown-format/unknown-format.component.html
+1 -1
View File
@@ -1,6 +1,6 @@
<div class="adf-viewer__unknown-format-view">
<div>
<mat-icon class="icon">error</mat-icon>
<mat-icon class="icon" adf-icon="error" />
<div class="adf-viewer__unknown-label">{{ customError || 'ADF_VIEWER.UNKNOWN_FORMAT' | translate }}</div>
</div>
</div>
lib/core/src/lib/viewer/components/unknown-format/unknown-format.component.ts
+2 -2
View File
@@ -16,14 +16,14 @@
*/
import { Component, Input, ViewEncapsulation } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
import { TranslatePipe } from '@ngx-translate/core';
import { IconModule } from '../../../icon/icon.module';
@Component({
selector: 'adf-viewer-unknown-format',
templateUrl: './unknown-format.component.html',
styleUrls: ['./unknown-format.component.scss'],
imports: [MatIconModule, TranslatePipe],
imports: [IconModule, TranslatePipe],
encapsulation: ViewEncapsulation.None
})
export class UnknownFormatComponent {
lib/core/src/lib/viewer/components/viewer.component.html
+9 -9
View File
@@ -18,7 +18,7 @@
data-automation-id="adf-toolbar-left-sidebar"
[color]="showLeftSidebar ? 'accent' : null"
(click)="toggleLeftSidebar()">
<mat-icon>info_outline</mat-icon>
<mat-icon adf-icon="info_outline" />
</button>
</ng-container>
@@ -29,7 +29,7 @@
mat-icon-button
title="{{ 'ADF_VIEWER.ACTIONS.CLOSE' | translate }}"
(click)="onClose()">
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</adf-toolbar-title>
@@ -40,7 +40,7 @@
[attr.aria-label]="'ADF_VIEWER.ACTIONS.PREV_FILE' | translate"
title="{{ 'ADF_VIEWER.ACTIONS.PREV_FILE' | translate }}"
(click)="onNavigateBeforeClick($event)">
<mat-icon>navigate_before</mat-icon>
<mat-icon adf-icon="navigate_before" />
</button>
<img class="adf-viewer__mimeicon"
[alt]="'ADF_VIEWER.ARIA.MIME_TYPE_ICON' | translate"
@@ -66,7 +66,7 @@
[attr.aria-label]="'ADF_VIEWER.ACTIONS.NEXT_FILE' | translate"
title="{{ 'ADF_VIEWER.ACTIONS.NEXT_FILE' | translate }}"
(click)="onNavigateNextClick($event)">
<mat-icon>navigate_next</mat-icon>
<mat-icon adf-icon="navigate_next" />
</button>
</div>
@@ -79,7 +79,7 @@
[matMenuTriggerFor]="mnuOpenWith"
data-automation-id="adf-toolbar-open-with">
<span>{{ 'ADF_VIEWER.ACTIONS.OPEN_WITH' | translate }}</span>
<mat-icon>arrow_drop_down</mat-icon>
<mat-icon adf-icon="arrow_drop_down" />
</button>
<mat-menu #mnuOpenWith="matMenu"
[overlapTrigger]="false">
@@ -100,7 +100,7 @@
title="{{ 'ADF_VIEWER.ACTIONS.FULLSCREEN' | translate }}"
data-automation-id="adf-toolbar-fullscreen"
(click)="enterFullScreen()">
<mat-icon>fullscreen</mat-icon>
<mat-icon adf-icon="fullscreen" />
</button>
<ng-container *ngIf="allowRightSidebar && !hideInfoButton">
@@ -113,7 +113,7 @@
data-automation-id="adf-toolbar-sidebar"
[color]="showRightSidebar ? 'accent' : null"
(click)="toggleRightSidebar()">
<mat-icon>info_outline</mat-icon>
<mat-icon adf-icon="info_outline" />
</button>
</ng-container>
@@ -125,7 +125,7 @@
[attr.aria-label]="'ADF_VIEWER.ACTIONS.MORE_ACTIONS' | translate"
title="{{ 'ADF_VIEWER.ACTIONS.MORE_ACTIONS' | translate }}"
data-automation-id="adf-toolbar-more-actions">
<mat-icon>more_vert</mat-icon>
<mat-icon adf-icon="more_vert" />
</button>
<mat-menu #mnuMoreActions="matMenu"
[overlapTrigger]="false">
@@ -143,7 +143,7 @@
mat-icon-button
title="{{ 'ADF_VIEWER.ACTIONS.CLOSE' | translate }}"
(click)="onClose()">
<mat-icon>close</mat-icon>
<mat-icon adf-icon="close" />
</button>
</ng-container>
lib/core/src/lib/viewer/components/viewer.component.ts
+2 -2
View File
@@ -37,7 +37,6 @@ import {
} from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatDialog } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { TranslatePipe } from '@ngx-translate/core';
import { fromEvent } from 'rxjs';
@@ -58,6 +57,7 @@ import { ViewerToolbarCustomActionsComponent } from './viewer-toolbar-custom-act
import { IconComponent } from '../../icon';
import { ThumbnailService } from '../../common';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { IconModule } from '../../icon/icon.module';
const DEFAULT_NON_PREVIEW_CONFIG = {
enableDownloadPrompt: false,
@@ -79,7 +79,7 @@ const DEFAULT_NON_PREVIEW_CONFIG = {
ToolbarTitleComponent,
MatButtonModule,
TranslatePipe,
MatIconModule,
IconModule,
MatMenuModule,
ToolbarDividerComponent,
ViewerRenderComponent,