inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-06-30 18:15:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

ACS-7381: Break DataTable dependency on Material Module (#9981)

Browse Source
This commit is contained in:
Denys Vuika 2024-07-25 08:40:48 -04:00 committed by GitHub
parent bca4d6cb65
commit dc444cfaa4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
47 changed files with 363 additions and 342 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
lib/core/src/lib/core.module.ts
View File

@ -23,7 +23,7 @@ import { MaterialModule } from './material.module';
import { ABOUT_DIRECTIVES } from './about/about.module';
import { CardViewModule } from './card-view/card-view.module';
import { ContextMenuModule } from './context-menu/context-menu.module';
import { DataTableModule } from './datatable/datatable.module';
import { DATATABLE_DIRECTIVES } from './datatable/datatable.module';
import { InfoDrawerModule } from './info-drawer/info-drawer.module';
import { LanguageMenuModule } from './language-menu/language-menu.module';
import { LoginModule } from './login/login.module';
@ -92,7 +92,7 @@ import { IconComponent } from './icon';
LoginModule,
LanguageMenuModule,
InfoDrawerModule,
DataTableModule,
...DATATABLE_DIRECTIVES,
TemplateModule,
IconComponent,
SortingPickerModule,
@ -130,7 +130,7 @@ import { IconComponent } from './icon';
LoginModule,
LanguageMenuModule,
InfoDrawerModule,
DataTableModule,
...DATATABLE_DIRECTIVES,
TranslateModule,
TemplateModule,
SortingPickerModule,

3
lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.spec.ts
View File

@ -40,8 +40,7 @@ describe('ColumnsSelectorComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CoreTestingModule],
declarations: [ColumnsSelectorComponent]
imports: [CoreTestingModule, ColumnsSelectorComponent]
}).compileComponents();
fixture = TestBed.createComponent(ColumnsSelectorComponent);

45
lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts
View File

@ -16,13 +16,31 @@
*/
import { Component, EventEmitter, Input, OnDestroy, OnInit, Output, ViewEncapsulation } from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
import { ReactiveFormsModule, UntypedFormControl } from '@angular/forms';
import { MatMenuTrigger } from '@angular/material/menu';
import { Subject } from 'rxjs';
import { debounceTime, takeUntil } from 'rxjs/operators';
import { DataColumn } from '../../data/data-column.model';
import { CommonModule } from '@angular/common';
import { TranslateModule } 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 { FilterStringPipe } from '../../../pipes';
@Component({
selector: 'adf-datatable-column-selector',
standalone: true,
imports: [
CommonModule,
TranslateModule,
MatButtonModule,
MatIconModule,
MatDividerModule,
ReactiveFormsModule,
MatCheckboxModule,
FilterStringPipe
],
templateUrl: './columns-selector.component.html',
styleUrls: ['./columns-selector.component.scss'],
encapsulation: ViewEncapsulation.None
@ -49,23 +67,16 @@ export class ColumnsSelectorComponent implements OnInit, OnDestroy {
searchQuery = '';
ngOnInit(): void {
this.mainMenuTrigger.menuOpened.pipe(
takeUntil(this.onDestroy$)
).subscribe(() => {
const columns = this.columns.map(column => ({...column}));
this.mainMenuTrigger.menuOpened.pipe(takeUntil(this.onDestroy$)).subscribe(() => {
const columns = this.columns.map((column) => ({ ...column }));
this.columnItems = this.columnsSorting ? this.sortColumns(columns) : columns;
});
this.mainMenuTrigger.menuClosed.pipe(
takeUntil(this.onDestroy$)
).subscribe(() => {
this.mainMenuTrigger.menuClosed.pipe(takeUntil(this.onDestroy$)).subscribe(() => {
this.searchInputControl.setValue('');
});
this.searchInputControl.valueChanges.pipe(
debounceTime(300),
takeUntil(this.onDestroy$)
).subscribe((searchQuery) => {
this.searchInputControl.valueChanges.pipe(debounceTime(300), takeUntil(this.onDestroy$)).subscribe((searchQuery) => {
this.searchQuery = searchQuery;
});
}
@ -89,12 +100,16 @@ export class ColumnsSelectorComponent implements OnInit, OnDestroy {
}
isCheckboxDisabled(column: DataColumn): boolean {
return this.maxColumnsVisible && column.isHidden && this.maxColumnsVisible === this.columnItems.filter(dataColumn => !dataColumn.isHidden).length;
return (
this.maxColumnsVisible &&
column.isHidden &&
this.maxColumnsVisible === this.columnItems.filter((dataColumn) => !dataColumn.isHidden).length
);
}
private sortColumns(columns: DataColumn[]): DataColumn[] {
const shownColumns = columns.filter(column => !column.isHidden);
const hiddenColumns = columns.filter(column => column.isHidden);
const shownColumns = columns.filter((column) => !column.isHidden);
const hiddenColumns = columns.filter((column) => column.isHidden);
return [...shownColumns, ...hiddenColumns];
}

2
lib/core/src/lib/datatable/components/datatable-cell/datatable-cell.component.spec.ts
View File

@ -51,7 +51,7 @@ describe('DataTableCellComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [DataTableCellComponent],
imports: [DataTableCellComponent],
providers: [DataTableService]
});

4
lib/core/src/lib/datatable/components/datatable-cell/datatable-cell.component.ts
View File

@ -22,9 +22,13 @@ import { DataTableAdapter } from '../../data/datatable-adapter';
import { BehaviorSubject, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { DataTableService } from '../../services/datatable.service';
import { CommonModule } from '@angular/common';
import { ClipboardModule } from '../../../clipboard';
@Component({
selector: 'adf-datatable-cell',
standalone: true,
imports: [CommonModule, ClipboardModule],
changeDetection: ChangeDetectionStrategy.OnPush,
template: `
<ng-container>

8
lib/core/src/lib/datatable/components/datatable-row/datatable-row.component.spec.ts
View File

@ -31,7 +31,7 @@ describe('DataTableRowComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [DataTableRowComponent]
imports: [DataTableRowComponent]
});
fixture = TestBed.createComponent(DataTableRowComponent);
@ -51,16 +51,14 @@ describe('DataTableRowComponent', () => {
component.row = row;
fixture.detectChanges();
expect(fixture.debugElement.nativeElement.classList.contains('adf-is-selected'))
.not.toBe(true);
expect(fixture.debugElement.nativeElement.classList.contains('adf-is-selected')).not.toBe(true);
});
it('should not have select class when row data is null', () => {
row.isSelected = false;
fixture.detectChanges();
expect(fixture.debugElement.nativeElement.classList.contains('adf-is-selected'))
.not.toBe(true);
expect(fixture.debugElement.nativeElement.classList.contains('adf-is-selected')).not.toBe(true);
});
it('should set aria selected to true when row is selected', () => {

18
lib/core/src/lib/datatable/components/datatable-row/datatable-row.component.ts
View File

@ -15,21 +15,13 @@
* limitations under the License.
*/
import {
Component,
ViewEncapsulation,
ElementRef,
Input,
HostBinding,
HostListener,
Output,
EventEmitter
} from '@angular/core';
import { Component, ViewEncapsulation, ElementRef, Input, HostBinding, HostListener, Output, EventEmitter } from '@angular/core';
import { FocusableOption } from '@angular/cdk/a11y';
import { DataRow } from '../../data/data-row.model';
@Component({
selector: 'adf-datatable-row',
standalone: true,
template: `<ng-content></ng-content>`,
encapsulation: ViewEncapsulation.None,
host: {
@ -57,13 +49,13 @@ export class DataTableRowComponent implements FocusableOption {
@HostBinding('attr.aria-selected')
get isAriaSelected(): boolean {
if (!this.row) {
return false;
return false;
}
return this.row.isSelected;
}
@HostBinding('attr.aria-label')
get ariaLabel(): string|null {
get ariaLabel(): string | null {
if (!this.row) {
return null;
}
@ -75,7 +67,7 @@ export class DataTableRowComponent implements FocusableOption {
}
@HostBinding('attr.tabindex')
get tabindex(): number|null {
get tabindex(): number | null {
return this.disabled ? null : 0;
}

22
lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts
View File

@ -34,13 +34,18 @@ import { mockCarsData, mockCarsSchemaDefinition } from '../mocks/datatable.mock'
import { MatCheckboxHarness } from '@angular/material/checkbox/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
@Component({ selector: 'adf-custom-column-template-component', template: ` <ng-template #tmplRef></ng-template> ` })
@Component({
selector: 'adf-custom-column-template-component',
standalone: true,
template: ` <ng-template #tmplRef></ng-template> `
})
class CustomColumnTemplateComponent {
@ViewChild('tmplRef', { static: true }) templateRef: TemplateRef<any>;
}
@Component({
selector: 'adf-custom-column-header-component',
standalone: true,
template: ` <ng-template #tmplRef> CUSTOM HEADER </ng-template> `
})
class CustomColumnHeaderComponent {
@ -140,8 +145,7 @@ describe('DataTable', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CoreTestingModule],
declarations: [CustomColumnHeaderComponent]
imports: [CoreTestingModule, CustomColumnHeaderComponent]
});
fixture = TestBed.createComponent(DataTableComponent);
dataTable = fixture.componentInstance;
@ -1315,8 +1319,7 @@ describe('Accesibility', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CoreTestingModule],
declarations: [CustomColumnTemplateComponent],
imports: [CoreTestingModule, CustomColumnTemplateComponent],
schemas: [NO_ERRORS_SCHEMA]
});
columnCustomTemplate = TestBed.createComponent(CustomColumnTemplateComponent).componentInstance.templateRef;
@ -1518,8 +1521,7 @@ describe('Drag&Drop column header', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CoreTestingModule],
declarations: [CustomColumnTemplateComponent],
imports: [CoreTestingModule, CustomColumnTemplateComponent],
schemas: [NO_ERRORS_SCHEMA]
});
fixture = TestBed.createComponent(DataTableComponent);
@ -1619,8 +1621,7 @@ describe('Show/hide columns', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CoreTestingModule],
declarations: [CustomColumnTemplateComponent],
imports: [CoreTestingModule, CustomColumnTemplateComponent],
schemas: [NO_ERRORS_SCHEMA]
});
fixture = TestBed.createComponent(DataTableComponent);
@ -1726,8 +1727,7 @@ describe('Column Resizing', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CoreTestingModule],
declarations: [CustomColumnTemplateComponent],
imports: [CoreTestingModule, CustomColumnTemplateComponent],
schemas: [NO_ERRORS_SCHEMA]
});
fixture = TestBed.createComponent(DataTableComponent);

5
lib/core/src/lib/datatable/components/datatable/datatable.component.stories.ts
View File

@ -18,7 +18,7 @@
import { applicationConfig, Meta, StoryFn, moduleMetadata } from '@storybook/angular';
import { CoreStoryModule } from '../../../testing/core.story.module';
import { DataTableComponent } from './datatable.component';
import { DataTableModule } from '../../datatable.module';
import { DATATABLE_DIRECTIVES } from '../../datatable.module';
import { RouterTestingModule } from '@angular/router/testing';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { mockPathInfos } from '../mocks/datatable.mock';
@ -29,7 +29,7 @@ export default {
title: 'Core/Datatable/Datatable',
decorators: [
moduleMetadata({
imports: [DataTableModule, MatProgressSpinnerModule, RouterTestingModule]
imports: [...DATATABLE_DIRECTIVES, MatProgressSpinnerModule, RouterTestingModule]
}),
applicationConfig({
providers: [importProvidersFrom(CoreStoryModule)]
@ -376,7 +376,6 @@ export default {
noPermission: false,
rowMenuCacheEnabled: false,
allowFiltering: false
}
} as Meta<DataTableComponent>;

58
lib/core/src/lib/datatable/components/datatable/datatable.component.ts
View File

@ -40,8 +40,8 @@ import {
ViewEncapsulation
} from '@angular/core';
import { FocusKeyManager } from '@angular/cdk/a11y';
import { MatCheckboxChange } from '@angular/material/checkbox';
import { MatMenuTrigger } from '@angular/material/menu';
import { MatCheckboxChange, MatCheckboxModule } from '@angular/material/checkbox';
import { MatMenuModule, MatMenuTrigger } from '@angular/material/menu';
import { Observable, Observer, Subscription } from 'rxjs';
import { DataColumnListComponent } from '../../data-column/data-column-list.component';
import { DataColumn } from '../../data/data-column.model';
@ -57,10 +57,29 @@ import { ObjectDataTableAdapter } from '../../data/object-datatable-adapter';
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, CdkDropList, moveItemInArray } from '@angular/cdk/drag-drop';
import { MatIconRegistry } from '@angular/material/icon';
import { CdkDrag, CdkDragDrop, CdkDragHandle, CdkDropList, moveItemInArray } from '@angular/cdk/drag-drop';
import { MatIconModule, MatIconRegistry } from '@angular/material/icon';
import { DomSanitizer } from '@angular/platform-browser';
import { ResizeEvent } from '../../directives/resizable/types';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { FileTypePipe, FilterOutArrayObjectsByPropPipe, LocalizedDatePipe } from '../../../pipes';
import { DropZoneDirective } from '../../directives/drop-zone.directive';
import { ResizableDirective } from '../../directives/resizable/resizable.directive';
import { IconComponent } from '../../../icon';
import { ResizeHandleDirective } from '../../directives/resizable/resize-handle.directive';
import { MatButtonModule } from '@angular/material/button';
import { UploadDirective } from '../../../directives';
import { ContextMenuDirective } from '../../../context-menu';
import { IconCellComponent } from '../icon-cell/icon-cell.component';
import { DateCellComponent } from '../date-cell/date-cell.component';
import { LocationCellComponent } from '../location-cell/location-cell.component';
import { FileSizeCellComponent } from '../filesize-cell/filesize-cell.component';
import { DataTableCellComponent } from '../datatable-cell/datatable-cell.component';
import { BooleanCellComponent } from '../boolean-cell/boolean-cell.component';
import { JsonCellComponent } from '../json-cell/json-cell.component';
import { AmountCellComponent } from '../amount-cell/amount-cell.component';
import { NumberCellComponent } from '../number-cell/number-cell.component';
// eslint-disable-next-line no-shadow
export enum ShowHeaderMode {
@ -71,6 +90,37 @@ export enum ShowHeaderMode {
@Component({
selector: 'adf-datatable',
standalone: true,
imports: [
CommonModule,
DataTableRowComponent,
CdkDropList,
TranslateModule,
MatCheckboxModule,
FilterOutArrayObjectsByPropPipe,
CdkDrag,
DropZoneDirective,
ResizableDirective,
CdkDragHandle,
IconComponent,
ResizeHandleDirective,
MatButtonModule,
MatMenuModule,
MatIconModule,
UploadDirective,
ContextMenuDirective,
FileTypePipe,
IconCellComponent,
LocalizedDatePipe,
DateCellComponent,
LocationCellComponent,
FileSizeCellComponent,
DataTableCellComponent,
BooleanCellComponent,
JsonCellComponent,
AmountCellComponent,
NumberCellComponent
],
templateUrl: './datatable.component.html',
styleUrls: ['./datatable.component.scss'],
encapsulation: ViewEncapsulation.None,

21
lib/core/src/lib/datatable/components/empty-list/empty-list.component.ts
View File

@ -19,12 +19,27 @@ import { Component, Directive, ViewEncapsulation } from '@angular/core';
@Component({
selector: 'adf-empty-list',
standalone: true,
styleUrls: ['./empty-list.component.scss'],
templateUrl: './empty-list.component.html',
encapsulation: ViewEncapsulation.None
})
export class EmptyListComponent {}
@Directive({ selector: '[adf-empty-list-header]' }) export class EmptyListHeaderDirective {}
@Directive({ selector: '[adf-empty-list-body]' }) export class EmptyListBodyDirective {}
@Directive({ selector: '[adf-empty-list-footer]' }) export class EmptyListFooterDirective {}
@Directive({
selector: '[adf-empty-list-header]',
standalone: true
})
export class EmptyListHeaderDirective {}
@Directive({
selector: '[adf-empty-list-body]',
standalone: true
})
export class EmptyListBodyDirective {}
@Directive({
selector: '[adf-empty-list-footer]',
standalone: true
})
export class EmptyListFooterDirective {}

5
lib/core/src/lib/datatable/components/filesize-cell/filesize-cell.component.ts
View File

@ -17,9 +17,13 @@
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { DataTableCellComponent } from '../datatable-cell/datatable-cell.component';
import { CommonModule } from '@angular/common';
import { FileSizePipe } from '../../../pipes';
@Component({
selector: 'adf-filesize-cell',
standalone: true,
imports: [CommonModule, FileSizePipe],
template: `
<ng-container *ngIf="value$ | async | adfFileSize as fileSize">
<span [title]="tooltip">{{ fileSize }}</span>
@ -29,7 +33,6 @@ import { DataTableCellComponent } from '../datatable-cell/datatable-cell.compone
host: { class: 'adf-filesize-cell' }
})
export class FileSizeCellComponent extends DataTableCellComponent implements OnInit {
ngOnInit(): void {
super.ngOnInit();
}

4
lib/core/src/lib/datatable/components/json-cell/json-cell.component.ts
View File

@ -19,9 +19,13 @@ import { ChangeDetectionStrategy, Component, OnInit, ViewEncapsulation, Input }
import { DataTableCellComponent } from '../datatable-cell/datatable-cell.component';
import { MatDialog } from '@angular/material/dialog';
import { EditJsonDialogComponent, EditJsonDialogSettings } from '../../../dialogs/edit-json/edit-json.dialog';
import { CommonModule } from '@angular/common';
import { MatButtonModule } from '@angular/material/button';
@Component({
selector: 'adf-json-cell',
standalone: true,
imports: [CommonModule, MatButtonModule],
changeDetection: ChangeDetectionStrategy.OnPush,
template: `
<ng-container *ngIf="value$ | async as value; else editEmpty">

2
lib/core/src/lib/datatable/data-column/data-column-header.component.ts
View File

@ -22,10 +22,10 @@ import { DataColumnComponent } from './data-column.component';
@Component({
selector: 'adf-data-column-header',
standalone: true,
template: ''
})
export class DateColumnHeaderComponent implements AfterContentInit {
@ContentChild(TemplateRef)
public header: TemplateRef<any>;

5
lib/core/src/lib/datatable/data-column/data-column-list.component.ts
View File

@ -15,17 +15,16 @@
* limitations under the License.
*/
/* eslint-disable @angular-eslint/component-selector */
/* eslint-disable @angular-eslint/component-selector */
import { Component, ContentChildren, QueryList } from '@angular/core';
import { DataColumnComponent } from './data-column.component';
@Component({
selector: 'data-columns',
standalone: true,
template: ''
})
export class DataColumnListComponent {
@ContentChildren(DataColumnComponent) columns: QueryList<DataColumnComponent>;
}

55
lib/core/src/lib/datatable/data-column/data-column.component.stories.ts
View File

@ -17,7 +17,7 @@
import { applicationConfig, Meta, StoryFn, moduleMetadata } from '@storybook/angular';
import { DataColumnComponent } from './data-column.component';
import { DataTableModule } from '../datatable.module';
import { DATATABLE_DIRECTIVES } from '../datatable.module';
import { CoreStoryModule } from '../../testing/core.story.module';
import * as mockData from '../../mock/data-column.mock';
import { RouterTestingModule } from '@angular/router/testing';
@ -29,7 +29,7 @@ export default {
title: 'Core/Data Column/Data Column',
decorators: [
moduleMetadata({
imports: [DataTableModule, RouterTestingModule]
imports: [...DATATABLE_DIRECTIVES, RouterTestingModule]
}),
applicationConfig({
providers: [importProvidersFrom(CoreStoryModule)]
@ -37,8 +37,7 @@ export default {
],
argTypes: {
copyContent: {
description:
'Enables/disables a Clipboard directive to allow copying of cell contents.',
description: 'Enables/disables a Clipboard directive to allow copying of cell contents.',
control: { type: 'boolean' },
table: {
category: 'Component Inputs',
@ -48,8 +47,7 @@ export default {
}
},
cssClass: {
description:
'Additional CSS class to be applied to column (header and cells).',
description: 'Additional CSS class to be applied to column (header and cells).',
control: { type: 'text' },
table: {
category: 'Component Inputs',
@ -59,8 +57,7 @@ export default {
}
},
customData: {
description:
'You can specify any custom data which can be used by any specific feature',
description: 'You can specify any custom data which can be used by any specific feature',
control: { disable: true },
table: {
category: 'Component Inputs',
@ -122,8 +119,7 @@ export default {
}
},
format: {
description:
'Used for location type. Setups root path for router navigation.',
description: 'Used for location type. Setups root path for router navigation.',
control: { type: 'text', disable: true },
table: {
category: 'Component Inputs',
@ -169,8 +165,7 @@ export default {
}
},
key: {
description:
'Data source key. Can be either a column/property key like title or a property path like `createdBy.name`.',
description: 'Data source key. Can be either a column/property key like title or a property path like `createdBy.name`.',
control: { type: 'text', disable: false },
table: {
category: 'Component Inputs',
@ -180,8 +175,7 @@ export default {
}
},
sortable: {
description:
'Toggles ability to sort by this column, for example by clicking the column header.',
description: 'Toggles ability to sort by this column, for example by clicking the column header.',
control: { type: 'boolean' },
table: {
category: 'Component Inputs',
@ -194,8 +188,7 @@ export default {
}
},
sortingKey: {
description:
'When using server side sorting the column used by the api call where the sorting will be performed',
description: 'When using server side sorting the column used by the api call where the sorting will be performed',
control: { disable: true },
table: {
category: 'Component Inputs',
@ -235,18 +228,7 @@ export default {
description:
'Value type for the column. Possible settings are: `text`, `icon`, `image`, `date`, `fileSize`, `location`, `boolean`, `amount`, `number` and `json`.',
control: { type: 'select', disable: false },
options: [
'text',
'icon',
'image',
'date',
'fileSize',
'location',
'boolean',
'amount',
'number',
'json'
],
options: ['text', 'icon', 'image', 'date', 'fileSize', 'location', 'boolean', 'amount', 'number', 'json'],
table: {
category: 'Component Inputs',
type: {
@ -258,8 +240,7 @@ export default {
}
},
currencyConfig: {
description:
`The currencyConfig input allows you to customize the formatting and display of currency values within the component.`,
description: `The currencyConfig input allows you to customize the formatting and display of currency values within the component.`,
control: { type: 'object', disable: true },
table: {
category: 'Component Inputs',
@ -272,8 +253,7 @@ export default {
}
},
decimalConfig: {
description:
`The decimalConfig input allows you to customize the formatting and display of decimal values within the component.`,
description: `The decimalConfig input allows you to customize the formatting and display of decimal values within the component.`,
control: { type: 'object', disable: true },
table: {
category: 'Component Inputs',
@ -286,8 +266,7 @@ export default {
}
},
dateConfig: {
description:
`The dateConfig input allows you to configure date formatting and localization for a component.`,
description: `The dateConfig input allows you to configure date formatting and localization for a component.`,
control: { type: 'object', disable: true },
table: {
category: 'Component Inputs',
@ -345,8 +324,7 @@ export default {
}
} as Meta<DataColumnComponent>;
const formatCustomTooltip = (row: DataRow): string =>
row ? 'This is ' + row.getValue('firstname') : null;
const formatCustomTooltip = (row: DataRow): string => (row ? 'This is ' + row.getValue('firstname') : null);
const template: StoryFn<DataColumnComponent> = (args: DataColumnComponent & { rows: DataRow[] }) => ({
props: args,
@ -464,8 +442,8 @@ FileSizeColumn.args = {
export const LocationColumn: StoryFn = template.bind({});
LocationColumn.argTypes = {
copyContent: { control: { disable: true } },
format: { control: { disable: false }},
sortable: { control: { disable: true }}
format: { control: { disable: false } },
sortable: { control: { disable: true } }
};
LocationColumn.args = {
rows: mockData.locationColumnRows,
@ -525,4 +503,3 @@ NumberColumn.args = {
type: 'number',
title: 'Number Column'
};

6
lib/core/src/lib/datatable/data-column/data-column.component.ts
View File

@ -15,7 +15,7 @@
* limitations under the License.
*/
/* eslint-disable @angular-eslint/component-selector, @angular-eslint/no-input-rename */
/* eslint-disable @angular-eslint/component-selector, @angular-eslint/no-input-rename */
import { Component, ContentChild, Input, OnInit, TemplateRef } from '@angular/core';
import { DataColumnType } from '@alfresco/adf-extensions';
@ -23,10 +23,10 @@ import { CurrencyConfig, DateConfig, DecimalConfig } from '../data/data-column.m
@Component({
selector: 'data-column',
standalone: true,
template: ''
})
export class DataColumnComponent implements OnInit {
/** Id of the Column */
@Input()
id: string = '';
@ -91,7 +91,7 @@ export class DataColumnComponent implements OnInit {
@Input('class')
cssClass: string;
/** Enables/disables a Clipboard directive to allow copying of cell contents. */
/** Enables/disables a Clipboard directive to allow copying of cell contents. */
@Input()
copyContent: boolean;

40
lib/core/src/lib/datatable/data-column/data-column.module.ts
View File

@ -1,40 +0,0 @@
/*!
* @license
* Copyright © 2005-2024 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 { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { DataColumnListComponent } from './data-column-list.component';
import { DataColumnComponent } from './data-column.component';
import { DateColumnHeaderComponent } from './data-column-header.component';
@NgModule({
imports: [
CommonModule
],
declarations: [
DataColumnComponent,
DataColumnListComponent,
DateColumnHeaderComponent
],
exports: [
DataColumnComponent,
DataColumnListComponent,
DateColumnHeaderComponent
]
})
export class DataColumnModule {}

128
lib/core/src/lib/datatable/datatable.module.ts
View File

@ -15,25 +15,18 @@
* limitations under the License.
*/
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { MaterialModule } from '../material.module';
import { ContextMenuModule } from '../context-menu/context-menu.module';
import { PipeModule } from '../pipes/pipe.module';
import { DirectiveModule } from '../directives/directive.module';
import { DataTableCellComponent } from './components/datatable-cell/datatable-cell.component';
import { DataTableRowComponent } from './components/datatable-row/datatable-row.component';
import { DataTableComponent } from './components/datatable/datatable.component';
import { DateCellComponent } from './components/date-cell/date-cell.component';
import { ColumnsSelectorComponent } from './components/columns-selector/columns-selector.component';
import { EmptyListBodyDirective,
import {
EmptyListBodyDirective,
EmptyListComponent,
EmptyListFooterDirective,
EmptyListHeaderDirective } from './components/empty-list/empty-list.component';
EmptyListHeaderDirective
} from './components/empty-list/empty-list.component';
import { FileSizeCellComponent } from './components/filesize-cell/filesize-cell.component';
import { LocationCellComponent } from './components/location-cell/location-cell.component';
import { LoadingContentTemplateDirective } from './directives/loading-template.directive';
@ -45,88 +38,53 @@ import { CustomLoadingContentTemplateDirective } from './directives/custom-loadi
import { CustomNoPermissionTemplateDirective } from './directives/custom-no-permission-template.directive';
import { MainMenuDataTableTemplateDirective } from './directives/main-data-table-action-template.directive';
import { JsonCellComponent } from './components/json-cell/json-cell.component';
import { ClipboardModule } from '../clipboard/clipboard.module';
import { DropZoneDirective } from './directives/drop-zone.directive';
import { DragDropModule } from '@angular/cdk/drag-drop';
import { IconModule } from '../icon/icon.module';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { DataColumnComponent, DataColumnListComponent, DateColumnHeaderComponent } from './data-column';
import { ResizableModule } from './directives/resizable/resizable.module';
import { DataColumnModule } from './data-column/data-column.module';
import { BooleanCellComponent } from './components/boolean-cell/boolean-cell.component';
import { AmountCellComponent } from './components/amount-cell/amount-cell.component';
import { NumberCellComponent } from './components/number-cell/number-cell.component';
import { LocalizedDatePipe } from '../pipes';
import { IconCellComponent } from './components/icon-cell/icon-cell.component';
import { ResizableDirective } from './directives/resizable/resizable.directive';
import { ResizeHandleDirective } from './directives/resizable/resize-handle.directive';
export const DATATABLE_DIRECTIVES = [
BooleanCellComponent,
AmountCellComponent,
NumberCellComponent,
LocationCellComponent,
DateCellComponent,
IconCellComponent,
ColumnsSelectorComponent,
DataColumnComponent,
DataColumnListComponent,
DateColumnHeaderComponent,
LocalizedDatePipe,
ResizableDirective,
ResizeHandleDirective,
DropZoneDirective,
EmptyListComponent,
EmptyListHeaderDirective,
EmptyListBodyDirective,
EmptyListFooterDirective,
FileSizeCellComponent,
JsonCellComponent,
NoContentTemplateDirective,
NoPermissionTemplateDirective,
LoadingContentTemplateDirective,
HeaderFilterTemplateDirective,
CustomEmptyContentTemplateDirective,
CustomLoadingContentTemplateDirective,
CustomNoPermissionTemplateDirective,
MainMenuDataTableTemplateDirective,
DataTableRowComponent,
DataTableCellComponent,
DataTableComponent
] as const;
/** @deprecated use `...DATATABLE_DIRECTIVES` instead, or import standalone components directly */
@NgModule({
imports: [
RouterModule,
MaterialModule,
CommonModule,
TranslateModule,
ContextMenuModule,
PipeModule,
DirectiveModule,
ClipboardModule,
DragDropModule,
IconModule,
FormsModule,
ReactiveFormsModule,
ResizableModule,
DataColumnModule,
BooleanCellComponent,
AmountCellComponent,
NumberCellComponent,
LocationCellComponent,
DateCellComponent,
LocalizedDatePipe,
IconCellComponent
],
declarations: [
DataTableComponent,
EmptyListComponent,
EmptyListHeaderDirective,
EmptyListBodyDirective,
EmptyListFooterDirective,
DataTableCellComponent,
DataTableRowComponent,
FileSizeCellComponent,
JsonCellComponent,
ColumnsSelectorComponent,
NoContentTemplateDirective,
NoPermissionTemplateDirective,
LoadingContentTemplateDirective,
HeaderFilterTemplateDirective,
CustomEmptyContentTemplateDirective,
CustomLoadingContentTemplateDirective,
CustomNoPermissionTemplateDirective,
MainMenuDataTableTemplateDirective,
DropZoneDirective
],
exports: [
DataTableComponent,
EmptyListComponent,
EmptyListHeaderDirective,
EmptyListBodyDirective,
EmptyListFooterDirective,
DataTableCellComponent,
DataTableRowComponent,
ColumnsSelectorComponent,
FileSizeCellComponent,
JsonCellComponent,
NoContentTemplateDirective,
NoPermissionTemplateDirective,
LoadingContentTemplateDirective,
HeaderFilterTemplateDirective,
CustomEmptyContentTemplateDirective,
CustomLoadingContentTemplateDirective,
CustomNoPermissionTemplateDirective,
MainMenuDataTableTemplateDirective,
DropZoneDirective,
DataColumnComponent,
DataColumnListComponent,
DateColumnHeaderComponent
]
imports: [...DATATABLE_DIRECTIVES],
exports: [...DATATABLE_DIRECTIVES]
})
export class DataTableModule {}

4
lib/core/src/lib/datatable/directives/custom-empty-content-template.directive.ts
View File

@ -23,7 +23,7 @@ import { Directive } from '@angular/core';
* adf-custom-empty-content-template.
*/
@Directive({
selector: 'adf-custom-empty-content-template, empty-folder-content'
selector: 'adf-custom-empty-content-template, empty-folder-content',
standalone: true
})
export class CustomEmptyContentTemplateDirective {}

3
lib/core/src/lib/datatable/directives/custom-loading-template.directive.ts
View File

@ -18,6 +18,7 @@
import { Directive } from '@angular/core';
@Directive({
selector: 'adf-custom-loading-content-template'
selector: 'adf-custom-loading-content-template',
standalone: true
})
export class CustomLoadingContentTemplateDirective {}

3
lib/core/src/lib/datatable/directives/custom-no-permission-template.directive.ts
View File

@ -23,6 +23,7 @@ import { Directive } from '@angular/core';
* adf-custom-no-permission-template.
*/
@Directive({
selector: 'adf-custom-no-permission-template, no-permission-content'
selector: 'adf-custom-no-permission-template, no-permission-content',
standalone: true
})
export class CustomNoPermissionTemplateDirective {}

3
lib/core/src/lib/datatable/directives/drop-zone.directive.ts
View File

@ -20,7 +20,8 @@ import { DataRow } from '../data/data-row.model';
import { DataColumn } from '../data/data-column.model';
@Directive({
selector: '[adf-drop-zone]'
selector: '[adf-drop-zone]',
standalone: true
})
export class DropZoneDirective implements OnInit, OnDestroy {
private element: HTMLElement;

7
lib/core/src/lib/datatable/directives/header-filter-template.directive.ts
View File

@ -19,15 +19,14 @@ import { AfterContentInit, ContentChild, Directive, TemplateRef } from '@angular
import { DataTableComponent } from '../components/datatable/datatable.component';
@Directive({
selector: 'adf-header-filter-template'
selector: 'adf-header-filter-template',
standalone: true
})
export class HeaderFilterTemplateDirective implements AfterContentInit {
@ContentChild(TemplateRef)
template: any;
constructor(private dataTable: DataTableComponent) {
}
constructor(private dataTable: DataTableComponent) {}
ngAfterContentInit() {
if (this.dataTable) {

8
lib/core/src/lib/datatable/directives/loading-template.directive.ts
View File

@ -22,20 +22,18 @@ import { DataTableComponent } from '../components/datatable/datatable.component'
* Directive selectors without adf- prefix will be deprecated on 3.0.0
*/
@Directive({
selector: 'adf-loading-content-template, loading-content-template'
selector: 'adf-loading-content-template, loading-content-template',
standalone: true
})
export class LoadingContentTemplateDirective implements AfterContentInit {
@ContentChild(TemplateRef)
template: any;
constructor(private dataTable: DataTableComponent) {
}
constructor(private dataTable: DataTableComponent) {}
ngAfterContentInit() {
if (this.dataTable) {
this.dataTable.loadingTemplate = this.template;
}
}
}

4
lib/core/src/lib/datatable/directives/main-data-table-action-template.directive.ts
View File

@ -19,10 +19,10 @@ import { AfterContentInit, ContentChild, Directive, TemplateRef } from '@angular
import { DataTableComponent } from '../components/datatable/datatable.component';
@Directive({
selector: 'adf-main-menu-datatable-template'
selector: 'adf-main-menu-datatable-template',
standalone: true
})
export class MainMenuDataTableTemplateDirective implements AfterContentInit {
@ContentChild(TemplateRef)
template: any;

7
lib/core/src/lib/datatable/directives/no-content-template.directive.ts
View File

@ -22,15 +22,14 @@ import { DataTableComponent } from '../components/datatable/datatable.component'
* Directive selectors without adf- prefix will be deprecated on 3.0.0
*/
@Directive({
selector: 'adf-no-content-template, no-content-template'
selector: 'adf-no-content-template, no-content-template',
standalone: true
})
export class NoContentTemplateDirective implements AfterContentInit {
@ContentChild(TemplateRef)
template: any;
constructor(private dataTable: DataTableComponent) {
}
constructor(private dataTable: DataTableComponent) {}
ngAfterContentInit() {
if (this.dataTable) {

7
lib/core/src/lib/datatable/directives/no-permission-template.directive.ts
View File

@ -22,15 +22,14 @@ import { DataTableComponent } from '../components/datatable/datatable.component'
* Directive selectors without adf- prefix will be deprecated on 3.0.0
*/
@Directive({
selector: 'adf-no-permission-template, no-permission-template'
selector: 'adf-no-permission-template, no-permission-template',
standalone: true
})
export class NoPermissionTemplateDirective implements AfterContentInit {
@ContentChild(TemplateRef)
template: any;
constructor(private dataTable: DataTableComponent) {
}
constructor(private dataTable: DataTableComponent) {}
ngAfterContentInit() {
if (this.dataTable) {

6
lib/core/src/lib/datatable/directives/resizable/resizable.directive.spec.ts
View File

@ -54,7 +54,7 @@ describe('ResizableDirective', () => {
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [ResizableDirective],
imports: [ResizableDirective],
providers: [
{ provide: Renderer2, useValue: rendererMock },
{ provide: ElementRef, useValue: elementRefMock }
@ -125,7 +125,9 @@ describe('ResizableDirective', () => {
directive.mousedown.next({ ...mouseDownEvent, resize: true });
directive.mouseup.next(mouseUpEvent);
expect(directive.resizeEnd.emit).toHaveBeenCalledWith({ rectangle: { top: 0, left: 0, right: 0, width: 150, height: 0, bottom: 0, scrollTop: 0, scrollLeft: 0 } });
expect(directive.resizeEnd.emit).toHaveBeenCalledWith({
rectangle: { top: 0, left: 0, right: 0, width: 150, height: 0, bottom: 0, scrollTop: 0, scrollLeft: 0 }
});
});
it('should emit resizing on mousemove', () => {

1
lib/core/src/lib/datatable/directives/resizable/resizable.directive.ts
View File

@ -22,6 +22,7 @@ import { OnInit, Output, NgZone, OnDestroy, Directive, Renderer2, ElementRef, Ev
@Directive({
selector: '[adf-resizable]',
standalone: true,
exportAs: 'adf-resizable'
})
export class ResizableDirective implements OnInit, OnDestroy {

26
lib/core/src/lib/datatable/directives/resizable/resizable.module.ts
View File

@ -1,26 +0,0 @@
/*!
* @license
* Copyright © 2005-2024 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 { ResizableDirective } from './resizable.directive';
import { ResizeHandleDirective } from './resize-handle.directive';
@NgModule({
declarations: [ResizableDirective, ResizeHandleDirective],
exports: [ResizableDirective, ResizeHandleDirective]
})
export class ResizableModule {}

4
lib/core/src/lib/datatable/directives/resizable/resize-handle.directive.spec.ts
View File

@ -30,12 +30,12 @@ describe('ResizeHandleDirective', () => {
};
const elementRefMock = {
nativeElement: { dispatchEvent: () => { } }
nativeElement: { dispatchEvent: () => {} }
};
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [ResizeHandleDirective],
imports: [ResizeHandleDirective],
providers: [
{ provide: Renderer2, useValue: rendererMock },
{ provide: ElementRef, useValue: elementRefMock }

3
lib/core/src/lib/datatable/directives/resizable/resize-handle.directive.ts
View File

@ -20,7 +20,8 @@ import { ResizableDirective } from './resizable.directive';
import { Input, OnInit, Directive, Renderer2, ElementRef, OnDestroy, NgZone } from '@angular/core';
@Directive({
selector: '[adf-resize-handle]'
selector: '[adf-resize-handle]',
standalone: true
})
export class ResizeHandleDirective implements OnInit, OnDestroy {
/**

39
lib/core/src/lib/datatable/public-api.ts
View File

@ -15,32 +15,37 @@
* limitations under the License.
*/
export * from './data/datatable-adapter';
export * from './data/data-row.model';
export * from './data/data-row-event.model';
export * from './data/data-column.model';
export * from './data/data-sorting.model';
export * from './data/object-datarow.model';
export * from './data/object-datatable-adapter';
export * from './data/object-datacolumn.model';
export * from './components/data-cell.event';
export * from './components/data-row-action.event';
export * from './directives/drop-zone.directive';
export * from './components/amount-cell/amount-cell.component';
export * from './components/boolean-cell/boolean-cell.component';
export * from './components/columns-selector/columns-selector.component';
export * from './components/datatable/datatable.component';
export * from './components/datatable-cell/datatable-cell.component';
export * from './components/datatable-row/datatable-row.component';
export * from './components/date-cell/date-cell.component';
export * from './components/empty-list/empty-list.component';
export * from './components/filesize-cell/filesize-cell.component';
export * from './components/icon-cell/icon-cell.component';
export * from './components/json-cell/json-cell.component';
export * from './components/location-cell/location-cell.component';
export * from './components/columns-selector/columns-selector.component';
export * from './components/number-cell/number-cell.component';
export * from './components/data-row-action.event';
export * from './components/data-cell.event';
export * from './data/datatable-adapter';
export * from './data/data-row.model';
export * from './data/data-row-event.model';
export * from './data/data-column.model';
export * from './data/data-sorting.model';
export * from './data/object-datarow.model';
export * from './data/object-datatable-adapter';
export * from './data/object-datacolumn.model';
export * from './data/data-table.schema';
export * from './data-column';
export * from './directives/resizable/resizable.directive';
export * from './directives/resizable/resize-handle.directive';
export * from './directives/drop-zone.directive';
export * from './directives/loading-template.directive';
export * from './directives/no-content-template.directive';
export * from './directives/no-permission-template.directive';
@ -52,6 +57,4 @@ export * from './directives/main-data-table-action-template.directive';
export * from './services/datatable.service';
export * from './datatable.module';
export * from './data-column';

1
lib/core/src/lib/dialogs/dialog/dialog.component.html
View File

@ -70,7 +70,6 @@
mat-stroked-button
color="primary"
mat-dialog-close
adf-auto-focus
data-automation-id="adf-dialog-actions-cancel"
>
{{ cancelButtonTitle | translate }}

7
lib/core/src/lib/dialogs/dialog/dialog.component.ts
View File

@ -16,14 +16,15 @@
*/
import { Component, Inject, InjectionToken, Injector, OnDestroy, ViewEncapsulation } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
import { AdditionalDialogActionButton, DialogData } from './dialog-data.interface';
import { BehaviorSubject, Subject } from 'rxjs';
import { DialogSize, DialogSizes } from './dialog.model';
import { MaterialModule } from '../../material.module';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { takeUntil } from 'rxjs/operators';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
export const DIALOG_COMPONENT_DATA = new InjectionToken<any>('dialog component data');
@ -32,7 +33,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, MaterialModule, TranslateModule],
imports: [CommonModule, TranslateModule, MatIconModule, MatDialogModule, MatButtonModule],
encapsulation: ViewEncapsulation.None
})
export class DialogComponent implements OnDestroy {

4
lib/process-services-cloud/src/lib/form/components/widgets/data-table/data-table.widget.ts
View File

@ -18,7 +18,7 @@
/* eslint-disable @angular-eslint/component-selector */
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { WidgetComponent, FormService, DataTableModule, FormBaseModule, DataRow, DataColumn } from '@alfresco/adf-core';
import { WidgetComponent, FormService, FormBaseModule, DataRow, DataColumn, DataTableComponent } from '@alfresco/adf-core';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { FormCloudService } from '../../../services/form-cloud.service';
@ -28,7 +28,7 @@ import { DataTablePathParserHelper } from './helpers/data-table-path-parser.help
@Component({
standalone: true,
imports: [CommonModule, TranslateModule, DataTableModule, FormBaseModule],
imports: [CommonModule, TranslateModule, FormBaseModule, DataTableComponent],
selector: 'data-table',
templateUrl: './data-table.widget.html',
styleUrls: ['./data-table.widget.scss'],

5
lib/process-services-cloud/src/lib/process/process-list/components/process-list-cloud.component.spec.ts
View File

@ -24,7 +24,6 @@ import {
CustomEmptyContentTemplateDirective,
DataColumn,
DataRowEvent,
DataTableModule,
getDataColumnMock,
ObjectDataRow,
User
@ -636,9 +635,9 @@ describe('ProcessListCloudComponent: Creating an empty custom template - EmptyTe
beforeEach(() => {
TestBed.configureTestingModule({
imports: [ProcessServiceCloudTestingModule, DataTableModule, MatProgressSpinnerModule],
imports: [ProcessServiceCloudTestingModule, MatProgressSpinnerModule, CustomEmptyContentTemplateDirective],
providers: [{ provide: PROCESS_LISTS_PREFERENCES_SERVICE_TOKEN, useValue: preferencesService }],
declarations: [EmptyTemplateComponent, ProcessListCloudComponent, CustomEmptyContentTemplateDirective]
declarations: [EmptyTemplateComponent, ProcessListCloudComponent]
});
fixtureEmpty = TestBed.createComponent(EmptyTemplateComponent);
fixtureEmpty.detectChanges();

23
lib/process-services/src/lib/attachment/process-attachment-list/process-attachment-list.component.ts
View File

@ -15,7 +15,16 @@
* limitations under the License.
*/
import { DataTableModule, DownloadService, EmptyListComponent, ThumbnailService } from '@alfresco/adf-core';
import {
DataColumnComponent,
DataColumnListComponent,
DataTableComponent,
DownloadService,
EmptyListComponent,
LoadingContentTemplateDirective,
NoContentTemplateDirective,
ThumbnailService
} from '@alfresco/adf-core';
import {
AfterContentInit,
ContentChild,
@ -36,7 +45,17 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
@Component({
selector: 'adf-process-attachment-list',
standalone: true,
imports: [CommonModule, DataTableModule, TranslateModule, MatProgressSpinnerModule],
imports: [
CommonModule,
TranslateModule,
MatProgressSpinnerModule,
DataTableComponent,
NoContentTemplateDirective,
EmptyListComponent,
DataColumnListComponent,
DataColumnComponent,
LoadingContentTemplateDirective
],
styleUrls: ['./process-attachment-list.component.scss'],
templateUrl: './process-attachment-list.component.html',
encapsulation: ViewEncapsulation.None

28
lib/process-services/src/lib/attachment/task-attachment-list/task-attachment-list.component.ts
View File

@ -15,7 +15,17 @@
* limitations under the License.
*/
import { ThumbnailService, EmptyListComponent, DownloadService, DataTableModule } from '@alfresco/adf-core';
import {
ThumbnailService,
EmptyListComponent,
DownloadService,
DataTableComponent,
EmptyListHeaderDirective,
DataColumnListComponent,
DataColumnComponent,
LoadingContentTemplateDirective,
NoContentTemplateDirective
} from '@alfresco/adf-core';
import {
AfterContentInit,
ContentChild,
@ -30,13 +40,25 @@ import {
} from '@angular/core';
import { ProcessContentService } from '../../form/services/process-content.service';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { TranslateModule } from '@ngx-translate/core';
@Component({
selector: 'adf-task-attachment-list',
standalone: true,
imports: [CommonModule, DataTableModule, TranslateModule, MatProgressSpinnerModule],
imports: [
CommonModule,
TranslateModule,
MatProgressSpinnerModule,
DataTableComponent,
EmptyListHeaderDirective,
TranslateModule,
DataColumnListComponent,
DataColumnComponent,
LoadingContentTemplateDirective,
EmptyListComponent,
NoContentTemplateDirective
],
styleUrls: ['./task-attachment-list.component.scss'],
templateUrl: './task-attachment-list.component.html',
encapsulation: ViewEncapsulation.None

4
lib/process-services/src/lib/form/form-list/form-list.component.ts
View File

@ -18,12 +18,12 @@
import { Component, Input, OnChanges, ViewEncapsulation } from '@angular/core';
import { ModelService } from '../services/model.service';
import { CommonModule } from '@angular/common';
import { DataTableModule } from '@alfresco/adf-core';
import { DataColumnComponent, DataColumnListComponent, DataTableComponent } from '@alfresco/adf-core';
@Component({
selector: 'adf-form-list',
standalone: true,
imports: [CommonModule, DataTableModule],
imports: [CommonModule, DataTableComponent, DataColumnListComponent, DataColumnComponent],
templateUrl: './form-list.component.html',
encapsulation: ViewEncapsulation.None
})

4
lib/process-services/src/lib/people/components/people-list/people-list.component.ts
View File

@ -15,7 +15,7 @@
* limitations under the License.
*/
import { DataTableComponent, DataCellEvent, DataColumnListComponent, ShowHeaderMode, DataTableModule } from '@alfresco/adf-core';
import { DataTableComponent, DataCellEvent, DataColumnListComponent, ShowHeaderMode } from '@alfresco/adf-core';
import { AfterContentInit, Component, ContentChild, EventEmitter, Input, Output, ViewChild } from '@angular/core';
import { UserEventModel } from '../../../task-list/models/user-event.model';
import { LightUserRepresentation } from '@alfresco/js-api';
@ -24,7 +24,7 @@ import { CommonModule } from '@angular/common';
@Component({
selector: 'adf-people-list',
standalone: true,
imports: [CommonModule, DataTableModule],
imports: [CommonModule, DataTableComponent],
templateUrl: './people-list.component.html',
styleUrls: ['./people-list.component.scss']
})

12
lib/process-services/src/lib/people/components/people-search-field/people-search-field.component.ts
View File

@ -15,7 +15,7 @@
* limitations under the License.
*/
import { DataTableModule, TranslationService } from '@alfresco/adf-core';
import { DataColumnComponent, DataColumnListComponent, TranslationService } from '@alfresco/adf-core';
import { Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';
import { ReactiveFormsModule, UntypedFormControl } from '@angular/forms';
import { debounceTime, switchMap } from 'rxjs/operators';
@ -32,7 +32,15 @@ import { PeopleListComponent } from '../people-list/people-list.component';
@Component({
selector: 'adf-people-search-field',
standalone: true,
imports: [CommonModule, MatFormFieldModule, MatInputModule, ReactiveFormsModule, DataTableModule, PeopleListComponent],
imports: [
CommonModule,
MatFormFieldModule,
MatInputModule,
ReactiveFormsModule,
PeopleListComponent,
DataColumnListComponent,
DataColumnComponent
],
templateUrl: './people-search-field.component.html',
styleUrls: ['./people-search-field.component.scss'],
host: { class: 'adf-people-search-field' },

13
lib/process-services/src/lib/people/components/people/people.component.ts
View File

@ -26,13 +26,22 @@ import { CommonModule } from '@angular/common';
import { MatCardModule } from '@angular/material/card';
import { TranslateModule } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { DataTableModule } from '@alfresco/adf-core';
import { PeopleListComponent } from '../people-list/people-list.component';
import { DataColumnComponent, DataColumnListComponent } from '@alfresco/adf-core';
@Component({
selector: 'adf-people',
standalone: true,
imports: [CommonModule, MatCardModule, TranslateModule, MatIconModule, DataTableModule, PeopleSearchComponent, PeopleListComponent],
imports: [
CommonModule,
MatCardModule,
TranslateModule,
MatIconModule,
PeopleSearchComponent,
PeopleListComponent,
DataColumnListComponent,
DataColumnComponent
],
templateUrl: './people.component.html',
styleUrls: ['./people.component.scss'],
encapsulation: ViewEncapsulation.None

16
lib/process-services/src/lib/process-list/components/process-list/process-list.component.ts
View File

@ -29,8 +29,10 @@ import {
UserPreferencesService,
DataCellEvent,
DEFAULT_PAGINATION,
DataTableModule,
EmptyContentComponent
EmptyContentComponent,
DataTableComponent,
LoadingContentTemplateDirective,
NoContentTemplateDirective
} from '@alfresco/adf-core';
import { AfterContentInit, Component, ContentChild, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
import { ProcessService } from '../../services/process.service';
@ -69,7 +71,15 @@ export const processPresetsDefaultModel = {
@Component({
selector: 'adf-process-instance-list',
standalone: true,
imports: [CommonModule, DataTableModule, MatProgressSpinnerModule, EmptyContentComponent, TranslateModule],
imports: [
CommonModule,
MatProgressSpinnerModule,
EmptyContentComponent,
TranslateModule,
DataTableComponent,
LoadingContentTemplateDirective,
NoContentTemplateDirective
],
styleUrls: ['./process-list.component.css'],
templateUrl: './process-list.component.html'
})

10
lib/process-services/src/lib/task-list/components/task-list/task-list.component.spec.ts
View File

@ -24,7 +24,6 @@ import {
ObjectDataRow,
DataCellEvent,
ObjectDataColumn,
DataTableModule,
AppConfigServiceMock,
AlfrescoApiServiceMock,
AlfrescoApiService
@ -106,14 +105,7 @@ describe('TaskListComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [
TranslateModule.forRoot(),
DataTableModule,
NoopAnimationsModule,
MatProgressSpinnerModule,
HttpClientTestingModule,
TaskListComponent
],
imports: [TranslateModule.forRoot(), NoopAnimationsModule, MatProgressSpinnerModule, HttpClientTestingModule, TaskListComponent],
providers: [
TaskListService,
{ provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock },

16
lib/process-services/src/lib/task-list/components/task-list/task-list.component.ts
View File

@ -28,8 +28,10 @@ import {
PaginationModel,
DataCellEvent,
DEFAULT_PAGINATION,
DataTableModule,
EmptyContentComponent
EmptyContentComponent,
DataTableComponent,
LoadingContentTemplateDirective,
NoContentTemplateDirective
} from '@alfresco/adf-core';
import { AfterContentInit, Component, ContentChild, EventEmitter, Input, OnChanges, Output, SimpleChanges, OnDestroy, OnInit } from '@angular/core';
import { BehaviorSubject, Subject } from 'rxjs';
@ -46,7 +48,15 @@ export const PRESET_KEY = 'adf-task-list.presets';
@Component({
selector: 'adf-tasklist',
standalone: true,
imports: [CommonModule, DataTableModule, MatProgressSpinnerModule, EmptyContentComponent, TranslateModule],
imports: [
CommonModule,
MatProgressSpinnerModule,
EmptyContentComponent,
TranslateModule,
DataTableComponent,
LoadingContentTemplateDirective,
NoContentTemplateDirective
],
templateUrl: './task-list.component.html',
styleUrls: ['./task-list.component.css']
})