diff --git a/demo-shell/src/app/components/file-view/file-view.component.html b/demo-shell/src/app/components/file-view/file-view.component.html index 936ed69521..dd2b065061 100644 --- a/demo-shell/src/app/components/file-view/file-view.component.html +++ b/demo-shell/src/app/components/file-view/file-view.component.html @@ -88,7 +88,7 @@

- + @@ -97,7 +97,7 @@

- + diff --git a/demo-shell/src/app/components/file-view/file-view.component.ts b/demo-shell/src/app/components/file-view/file-view.component.ts index 5ba62be837..f9ed345b58 100644 --- a/demo-shell/src/app/components/file-view/file-view.component.ts +++ b/demo-shell/src/app/components/file-view/file-view.component.ts @@ -17,18 +17,44 @@ import { Component, OnInit, ViewEncapsulation } from '@angular/core'; import { ActivatedRoute, PRIMARY_OUTLET, Router } from '@angular/router'; -import { NotificationService } from '@alfresco/adf-core'; +import { InfoDrawerComponent, InfoDrawerTabComponent, NotificationService, ViewerComponent } from '@alfresco/adf-core'; import { + AlfrescoViewerComponent, AllowableOperationsEnum, + ContentMetadataModule, ContentService, FileUploadErrorEvent, + NodeCommentsModule, NodesApiService, - PermissionsEnum + PermissionsEnum, + VersionManagerModule } from '@alfresco/adf-content-services'; import { PreviewService } from '../../services/preview.service'; +import { CommonModule } from '@angular/common'; +import { MatSlideToggleModule } from '@angular/material/slide-toggle'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { FormsModule } from '@angular/forms'; +import { MatButtonModule } from '@angular/material/button'; @Component({ selector: 'app-file-view', + standalone: true, + imports: [ + CommonModule, + AlfrescoViewerComponent, + ViewerComponent, + InfoDrawerComponent, + InfoDrawerTabComponent, + NodeCommentsModule, + ContentMetadataModule, + MatSlideToggleModule, + MatFormFieldModule, + MatInputModule, + FormsModule, + MatButtonModule, + VersionManagerModule + ], templateUrl: './file-view.component.html', encapsulation: ViewEncapsulation.None }) diff --git a/demo-shell/src/app/components/file-view/file-view.module.ts b/demo-shell/src/app/components/file-view/file-view.module.ts index a5ab81a664..bbeeec4647 100644 --- a/demo-shell/src/app/components/file-view/file-view.module.ts +++ b/demo-shell/src/app/components/file-view/file-view.module.ts @@ -16,10 +16,7 @@ */ import { NgModule } from '@angular/core'; -import { CommonModule } from '@angular/common'; import { Routes, RouterModule } from '@angular/router'; -import { CoreModule, InfoDrawerModule } from '@alfresco/adf-core'; -import { ContentModule, ContentDirectiveModule, VersionManagerModule, ContentMetadataModule } from '@alfresco/adf-content-services'; import { FileViewComponent } from './file-view.component'; const routes: Routes = [ @@ -30,20 +27,7 @@ const routes: Routes = [ ]; @NgModule({ - imports: [ - CommonModule, - RouterModule.forChild(routes), - CoreModule, - ContentModule, - InfoDrawerModule, - ContentModule, - ContentDirectiveModule, - ContentMetadataModule, - VersionManagerModule - ], - declarations: [FileViewComponent], + imports: [RouterModule.forChild(routes), FileViewComponent], exports: [FileViewComponent] }) -export class FileViewModule { - -} +export class FileViewModule {} diff --git a/lib/core/src/lib/core.module.ts b/lib/core/src/lib/core.module.ts index ed20941b27..e270502bd9 100644 --- a/lib/core/src/lib/core.module.ts +++ b/lib/core/src/lib/core.module.ts @@ -19,15 +19,12 @@ import { CommonModule } from '@angular/common'; import { APP_INITIALIZER, NgModule, ModuleWithProviders } from '@angular/core'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { TranslateModule, TranslateLoader, TranslateStore, TranslateService } from '@ngx-translate/core'; - 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 { InfoDrawerModule } from './info-drawer/info-drawer.module'; import { LanguageMenuModule } from './language-menu/language-menu.module'; -import { LoginModule } from './login/login.module'; import { PaginationModule } from './pagination/pagination.module'; import { ToolbarModule } from './toolbar/toolbar.module'; import { ViewerModule } from './viewer/viewer.module'; @@ -40,13 +37,10 @@ import { TemplateModule } from './templates/template.module'; import { ClipboardModule } from './clipboard/clipboard.module'; import { NotificationHistoryModule } from './notifications/notification-history.module'; import { BlankPageModule } from './blank-page/blank-page.module'; - import { DirectiveModule } from './directives/directive.module'; import { PipeModule } from './pipes/pipe.module'; - import { TranslationService } from './translation/translation.service'; import { SortingPickerModule } from './sorting-picker/sorting-picker.module'; -import { IconModule } from './icon/icon.module'; import { TranslateLoaderService } from './translation/translate-loader.service'; import { ExtensionsModule } from '@alfresco/adf-extensions'; import { directionalityConfigFactory } from './common/services/directionality-config-factory'; @@ -68,6 +62,9 @@ import { AdfDateTimeFnsAdapter } from './common/utils/datetime-fns-adapter'; import { AppConfigPipe, StoragePrefixFactory } from './app-config'; import { UnsavedChangesDialogModule } from './dialogs'; import { DynamicChipListModule } from './dynamic-chip-list'; +import { INFO_DRAWER_DIRECTIVES } from './info-drawer'; +import { IconComponent } from './icon'; +import { LOGIN_DIRECTIVES } from './login'; @NgModule({ imports: [ @@ -91,13 +88,13 @@ import { DynamicChipListModule } from './dynamic-chip-list'; FormBaseModule, CommentsModule, CommentListModule, - LoginModule, + ...LOGIN_DIRECTIVES, LanguageMenuModule, - InfoDrawerModule, + ...INFO_DRAWER_DIRECTIVES, DataTableModule, ButtonsMenuModule, TemplateModule, - IconModule, + IconComponent, SortingPickerModule, NotificationHistoryModule, SearchTextModule, @@ -130,15 +127,15 @@ import { DynamicChipListModule } from './dynamic-chip-list'; FormBaseModule, CommentsModule, CommentListModule, - LoginModule, + ...LOGIN_DIRECTIVES, LanguageMenuModule, - InfoDrawerModule, + ...INFO_DRAWER_DIRECTIVES, DataTableModule, TranslateModule, ButtonsMenuModule, TemplateModule, SortingPickerModule, - IconModule, + IconComponent, NotificationHistoryModule, SearchTextModule, BlankPageModule, diff --git a/lib/core/src/lib/info-drawer/info-drawer-layout.component.ts b/lib/core/src/lib/info-drawer/info-drawer-layout.component.ts index 7f33a179e3..de5a2f3d02 100644 --- a/lib/core/src/lib/info-drawer/info-drawer-layout.component.ts +++ b/lib/core/src/lib/info-drawer/info-drawer-layout.component.ts @@ -16,9 +16,12 @@ */ import { Component, Directive, Input, ViewEncapsulation } from '@angular/core'; +import { CommonModule } from '@angular/common'; @Component({ selector: 'adf-info-drawer-layout', + standalone: true, + imports: [CommonModule], templateUrl: './info-drawer-layout.component.html', styleUrls: ['./info-drawer-layout.component.scss'], encapsulation: ViewEncapsulation.None, @@ -33,6 +36,20 @@ export class InfoDrawerLayoutComponent { /** * Directive selectors without adf- prefix will be deprecated on 3.0.0 */ -@Directive({ selector: '[adf-info-drawer-title], [info-drawer-title]' }) export class InfoDrawerTitleDirective {} -@Directive({ selector: '[adf-info-drawer-buttons], [info-drawer-buttons]' }) export class InfoDrawerButtonsDirective {} -@Directive({ selector: '[adf-info-drawer-content], [info-drawer-content]' }) export class InfoDrawerContentDirective {} +@Directive({ + standalone: true, + selector: '[adf-info-drawer-title], [info-drawer-title]' +}) +export class InfoDrawerTitleDirective {} + +@Directive({ + standalone: true, + selector: '[adf-info-drawer-buttons], [info-drawer-buttons]' +}) +export class InfoDrawerButtonsDirective {} + +@Directive({ + standalone: true, + selector: '[adf-info-drawer-content], [info-drawer-content]' +}) +export class InfoDrawerContentDirective {} diff --git a/lib/core/src/lib/info-drawer/info-drawer.component.html b/lib/core/src/lib/info-drawer/info-drawer.component.html index 4fff27cf84..6bc9593ca4 100644 --- a/lib/core/src/lib/info-drawer/info-drawer.component.html +++ b/lib/core/src/lib/info-drawer/info-drawer.component.html @@ -2,8 +2,8 @@ {{ 'INFO_DRAWER.ICON' | translate }}

{{ title | translate }}
- - + + diff --git a/lib/core/src/lib/info-drawer/info-drawer.component.stories.ts b/lib/core/src/lib/info-drawer/info-drawer.component.stories.ts index 17dbcc3238..25b4fb7d3e 100644 --- a/lib/core/src/lib/info-drawer/info-drawer.component.stories.ts +++ b/lib/core/src/lib/info-drawer/info-drawer.component.stories.ts @@ -18,7 +18,7 @@ import { Meta, moduleMetadata, Story } from '@storybook/angular'; import { CoreStoryModule } from '../testing/core.story.module'; import { InfoDrawerComponent } from './info-drawer.component'; -import { InfoDrawerModule } from './info-drawer.module'; +import { INFO_DRAWER_DIRECTIVES } from './info-drawer.module'; import { mockTabText, mockCardText } from './mock/info-drawer.mock'; export default { @@ -26,7 +26,7 @@ export default { title: 'Core/Info Drawer/Info Drawer', decorators: [ moduleMetadata({ - imports: [CoreStoryModule, InfoDrawerModule] + imports: [CoreStoryModule, ...INFO_DRAWER_DIRECTIVES] }) ], parameters: { @@ -200,10 +200,9 @@ export default { } } as Meta; -const tabLayoutTemplate: Story = (args: InfoDrawerComponent) => ({ +const tabLayoutTemplate: Story = (args: InfoDrawerComponent) => ({ props: args, - template: - ` + template: `
clear
@@ -223,10 +222,9 @@ const tabLayoutTemplate: Story = (args: InfoDrawerComponent) =
` }); -const singleLayoutTemplate: Story = (args: InfoDrawerComponent) => ({ +const singleLayoutTemplate: Story = (args: InfoDrawerComponent) => ({ props: args, - template: - ` + template: `
File info
diff --git a/lib/core/src/lib/info-drawer/info-drawer.component.ts b/lib/core/src/lib/info-drawer/info-drawer.component.ts index 9d8b3b054f..8d560e5453 100644 --- a/lib/core/src/lib/info-drawer/info-drawer.component.ts +++ b/lib/core/src/lib/info-drawer/info-drawer.component.ts @@ -15,10 +15,32 @@ * limitations under the License. */ -import { Component, ContentChildren, EventEmitter, HostListener, Input, Output, QueryList, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; -import { MatTabChangeEvent } from '@angular/material/tabs'; +import { + Component, + ContentChildren, + EventEmitter, + HostListener, + Input, + Output, + QueryList, + TemplateRef, + ViewChild, + ViewEncapsulation +} from '@angular/core'; +import { MatTabChangeEvent, MatTabsModule } from '@angular/material/tabs'; +import { CommonModule } from '@angular/common'; +import { + InfoDrawerButtonsDirective, + InfoDrawerContentDirective, + InfoDrawerLayoutComponent, + InfoDrawerTitleDirective +} from './info-drawer-layout.component'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatIconModule } from '@angular/material/icon'; + @Component({ selector: 'adf-info-drawer-tab', + standalone: true, template: '', encapsulation: ViewEncapsulation.None }) @@ -37,6 +59,17 @@ export class InfoDrawerTabComponent { @Component({ selector: 'adf-info-drawer', + standalone: true, + imports: [ + CommonModule, + InfoDrawerLayoutComponent, + TranslateModule, + InfoDrawerTitleDirective, + InfoDrawerButtonsDirective, + InfoDrawerContentDirective, + MatTabsModule, + MatIconModule + ], templateUrl: './info-drawer.component.html', styleUrls: ['./info-drawer.component.scss'], encapsulation: ViewEncapsulation.None, @@ -45,7 +78,7 @@ export class InfoDrawerTabComponent { export class InfoDrawerComponent { /** The title of the info drawer (string or translation key). */ @Input() - title: string|null = null; + title: string | null = null; @Input() icon: string | null = null; diff --git a/lib/core/src/lib/info-drawer/info-drawer.module.ts b/lib/core/src/lib/info-drawer/info-drawer.module.ts index 5ca2bd55ef..95022730e0 100644 --- a/lib/core/src/lib/info-drawer/info-drawer.module.ts +++ b/lib/core/src/lib/info-drawer/info-drawer.module.ts @@ -15,41 +15,27 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { InfoDrawerLayoutComponent, InfoDrawerTitleDirective, InfoDrawerButtonsDirective, InfoDrawerContentDirective } from './info-drawer-layout.component'; +import { + InfoDrawerLayoutComponent, + InfoDrawerTitleDirective, + InfoDrawerButtonsDirective, + InfoDrawerContentDirective +} from './info-drawer-layout.component'; import { InfoDrawerComponent, InfoDrawerTabComponent } from './info-drawer.component'; -import { TranslateModule } from '@ngx-translate/core'; -import { MatIconModule } from '@angular/material/icon'; -import { MatTabsModule } from '@angular/material/tabs'; -import { MatCardModule } from '@angular/material/card'; +export const INFO_DRAWER_DIRECTIVES = [ + InfoDrawerLayoutComponent, + InfoDrawerTabComponent, + InfoDrawerComponent, + InfoDrawerTitleDirective, + InfoDrawerButtonsDirective, + InfoDrawerContentDirective +]; + +/** @deprecated use `INFO_DRAWER_DIRECTIVES` or import standalone components directly */ @NgModule({ - imports: [ - CommonModule, - MatTabsModule, - MatIconModule, - MatCardModule, - TranslateModule - ], - declarations: [ - InfoDrawerLayoutComponent, - InfoDrawerTabComponent, - InfoDrawerComponent, - InfoDrawerTitleDirective, - InfoDrawerButtonsDirective, - InfoDrawerContentDirective - ], - exports: [ - InfoDrawerLayoutComponent, - InfoDrawerTabComponent, - InfoDrawerComponent, - InfoDrawerTitleDirective, - InfoDrawerButtonsDirective, - InfoDrawerContentDirective, - MatTabsModule, - MatCardModule, - MatIconModule - ] + imports: [...INFO_DRAWER_DIRECTIVES], + exports: [...INFO_DRAWER_DIRECTIVES] }) export class InfoDrawerModule {} diff --git a/lib/core/src/lib/login/login.module.ts b/lib/core/src/lib/login/login.module.ts index 642afd75b4..8a2e247cc3 100644 --- a/lib/core/src/lib/login/login.module.ts +++ b/lib/core/src/lib/login/login.module.ts @@ -23,21 +23,11 @@ import { LoginComponent } from './components/login/login.component'; import { LoginFooterDirective } from './directives/login-footer.directive'; import { LoginHeaderDirective } from './directives/login-header.directive'; +export const LOGIN_DIRECTIVES = [LoginComponent, LoginFooterDirective, LoginHeaderDirective, LoginDialogComponent, LoginDialogPanelComponent]; + +/** @deprecated use `LOGIN_DIRECTIVES` or import standalone components directly */ @NgModule({ - imports: [ - LoginComponent, - LoginFooterDirective, - LoginHeaderDirective, - LoginDialogComponent, - LoginDialogPanelComponent - ], - exports: [ - LoginComponent, - LoginFooterDirective, - LoginHeaderDirective, - LoginDialogComponent, - LoginDialogPanelComponent - ] + imports: [...LOGIN_DIRECTIVES], + exports: [...LOGIN_DIRECTIVES] }) -export class LoginModule { -} +export class LoginModule {} diff --git a/lib/process-services/src/lib/task-list/components/task-details/task-details.component.ts b/lib/process-services/src/lib/task-list/components/task-details/task-details.component.ts index 17d73bc382..a948d0558c 100644 --- a/lib/process-services/src/lib/task-list/components/task-details/task-details.component.ts +++ b/lib/process-services/src/lib/task-list/components/task-details/task-details.component.ts @@ -22,7 +22,8 @@ import { FormFieldValidator, FormModel, FormOutcomeEvent, - InfoDrawerModule, + InfoDrawerComponent, + InfoDrawerTabComponent, UpdateNotification } from '@alfresco/adf-core'; import { @@ -53,6 +54,7 @@ import { TaskHeaderComponent } from '../task-header/task-header.component'; import { TaskCommentsComponent } from '../../../task-comments'; import { ChecklistComponent } from '../checklist/checklist.component'; import { MatButtonModule } from '@angular/material/button'; +import { MatCardModule } from '@angular/material/card'; @Component({ selector: 'adf-task-details', @@ -62,14 +64,16 @@ import { MatButtonModule } from '@angular/material/button'; TranslateModule, TaskFormComponent, AttachFormComponent, - InfoDrawerModule, PeopleSearchComponent, TaskHeaderComponent, PeopleComponent, TaskCommentsComponent, ChecklistComponent, MatDialogModule, - MatButtonModule + MatButtonModule, + InfoDrawerComponent, + InfoDrawerTabComponent, + MatCardModule ], templateUrl: './task-details.component.html', styleUrls: ['./task-details.component.scss'],