diff --git a/docs/content-services/dialogs/dialog.md b/docs/core/dialogs/dialog.md similarity index 63% rename from docs/content-services/dialogs/dialog.md rename to docs/core/dialogs/dialog.md index 1fbf21912d..86cc8d78a5 100644 --- a/docs/content-services/dialogs/dialog.md +++ b/docs/core/dialogs/dialog.md @@ -1,11 +1,11 @@ --- Title: Dialog component -Added: v6.9.0 +Added: v6.10.0 Status: Active -Last reviewed: 2024-05-17 +Last reviewed: 2024-05-24 --- -# [Dialog component](../../../lib/content-services/src/lib/dialogs/dialog/ "Defined in dialog.component.ts") +# [Dialog component](../../../lib/core/src/lib/dialogs/dialog/dialog.component.ts "Defined in dialog.component.ts") Dialog wrapper styled according to a consistent design system. @@ -64,15 +64,24 @@ function openDialog() { const data: DialogData = { title: 'Dialog title', dialogSize: DialogSize.Alert, - isConfirmButtonDisabled$: of(true), - contentTemplate: this.contentDialogTemplate, - actionsTemplate: this.actionsDialogTemplate + isConfirmButtonDisabled$: of(false), + contentTemplate: this.contentDialogTemplate, // or contentComponent: this.contentDialogTemplate + additionalActionButtons: [{ + title: 'Reset', + class: 'reset-button', + onClick: () => { + this.isConfirmButtonDisabled$.next(true); + } + }] // or actionsTemplate: this.actionsDialogTemplate }; - this.dialog.open(DialogComponent, { data }); + this.dialog.open(DialogComponent, { data }, width: '600px'); } ``` +Note that **fixed width** may be provided which will work correctly on smaller screens. But don't specify any values ​​for **height**, as this may break the scrollable content and hide the buttons. +To display the design well, it is necessary to provide no more than 2 additional buttons. + ## Details This component lets the user reuse styled dialog wrapper. Use the @@ -84,3 +93,4 @@ with properties. - [Dialog Data Interface](../interfaces/dialog.interface.md) - [Dialog Model](../models/dialog.model.md) +- [AdditionalDialogActionButton Interface](../interfaces/additional-dialog-action-button.md) diff --git a/docs/core/interfaces/additional-dialog-action-button.interface.md b/docs/core/interfaces/additional-dialog-action-button.interface.md new file mode 100644 index 0000000000..584afe83dd --- /dev/null +++ b/docs/core/interfaces/additional-dialog-action-button.interface.md @@ -0,0 +1,36 @@ +--- +Title: AdditionalDialogActionButton Interface +Added: v6.10.0 +Status: Active +Last reviewed: 2024-05-24 +--- + +# [AdditionalDialogActionButton Interface](../../../lib/core/src/lib/dialogs/dialog/dialog-data.interface.ts "Defined in dialog-data.interface.ts") + +Specifies interface for [Dialog Component](../dialogs/dialog.md). + +## Basic usage + +```ts +interface AdditionalDialogActionButton { + title: string; + onClick: (args?: any) => void; + class?: string; +} +``` + +## Properties + +| Name | Type | Default value | Description | +| ---- | ---- | ------------- | ----------- | +| title | `string` | | Button title. | +| onClick | `(args?: any) => void` | | Callback for button. (optional) | +| class | `string` | | Button class. (optional) | + +Note that in order for the design to be displayed well, it is necessary to provide no more than 2 additional buttons. + +## See also + +- [Dialog Component](../dialogs/dialog.md) +- [Dialog Model](../models/dialog.model.md) +- [DialogData Interface](./dialog.interface.md) diff --git a/docs/content-services/interfaces/dialog.interface.md b/docs/core/interfaces/dialog.interface.md similarity index 74% rename from docs/content-services/interfaces/dialog.interface.md rename to docs/core/interfaces/dialog.interface.md index 45870e0a21..60e2c7f44a 100644 --- a/docs/content-services/interfaces/dialog.interface.md +++ b/docs/core/interfaces/dialog.interface.md @@ -1,11 +1,11 @@ --- Title: Dialog Data Interface -Added: v6.9.0 +Added: v6.10.0 Status: Active -Last reviewed: 2024-05-17 +Last reviewed: 2024-05-24 --- -# [Dialog Data Interface](../../../lib/content-services/src/lib/dialogs/dialog/dialog-data.interface.ts "Defined in dialog-data.interface.ts") +# [Dialog Data Interface](../../../lib/core/src/lib/dialogs/dialog/dialog-data.interface.ts "Defined in dialog-data.interface.ts") Specifies interface for [Dialog Component](../dialogs/dialog.md). @@ -25,6 +25,7 @@ interface DialogData { actionsTemplate?: TemplateRef; descriptionTemplate?: TemplateRef; headerIcon?: string; + additionalActionButtons?: AdditionalDialogActionButton[]; } ``` @@ -34,18 +35,22 @@ interface DialogData { | ---- | ---- | ------------- | ----------- | | title | `string` | | It will be placed in the dialog title section. | | headerIcon | `string` | | It will be placed in header section. Should be used with Alert dialogs. (optional) | -| description | `string` | | It will be placed first in the dialog content section. (optional) | +| description | `string` | | It will be placed first in the dialog content section. Non-scrollable content. (optional) | | confirmButtonTitle | `string` | `COMMON.APPLY` | Confirmation action. After this, the dialog is closed and the `isConfirmButtonDisabled$` is set to `true`. (optional) | | cancelButtonTitle | `string` | `COMMON.CANCEL` | Cancellation action. After this, the dialog is closed | | isCancelButtonHidden | `boolean` | `false` | Toggles cancel button visibility. (optional) | | isCloseButtonHidden | `boolean` | `false` | Toggles close button visibility. (optional) | | isConfirmButtonDisabled$ | `Subject` | `false` | Toggles confirm button disability. (optional) | | dialogSize | `DialogSize` | `Medium` | Set dialog size. Can be `Large`, `Medium`, `Alert`. (optional) | +| contentText | `string` | | Inserts a content text. (optional) | +| contentComponent | `Type` | | Inserts a content component. (optional) | | contentTemplate | `TemplateRef` | | Inserts a content template. (optional) | | actionsTemplate | `TemplateRef` | | Inserts a template styled on the left. Should be used for additional `mat-button` style buttons. (optional) | | descriptionTemplate | `TemplateRef` | | Inserts a description template. (optional) | +| additionalActionButtons | `AdditionalDialogActionButton[]` | | Inserts additional base-styled buttons into the action bar on the left. (optional) | ## See also - [Dialog Component](../dialogs/dialog.md) - [Dialog Model](../models/dialog.model.md) +- [AdditionalDialogActionButton Interface](./additional-dialog-action-button.interface.md) diff --git a/docs/content-services/models/dialog.model.md b/docs/core/models/dialog.model.md similarity index 81% rename from docs/content-services/models/dialog.model.md rename to docs/core/models/dialog.model.md index c0cc663d3b..724d6b070d 100644 --- a/docs/content-services/models/dialog.model.md +++ b/docs/core/models/dialog.model.md @@ -1,11 +1,11 @@ --- Title: Dialog Size Model -Added: v6.9.0 +Added: v6.10.0 Status: Active -Last reviewed: 2024-05-17 +Last reviewed: 2024-05-24 --- -# [Dialog Size model](../../../lib/content-services/src/lib/dialogs/dialog/dialog.model.ts "Defined in dialog.model.ts") +# [Dialog Size model](../../../lib/core/src/lib/dialogs/dialog/dialog.model.ts "Defined in dialog.model.ts") Sets a specific CSS class to [Dialog Component](../dialogs/dialog.md). @@ -50,3 +50,4 @@ function openDialog() { - [Dialog Component](../dialogs/dialog.md) - [Dialog Data Interface](../interfaces/dialog.interface.md) +- [AdditionalDialogActionButton Interface](./additional-dialog-action-button.md) diff --git a/docs/docassets/images/adf-dialog-alert-standart.png b/docs/docassets/images/adf-dialog-alert-standart.png index e2c76f7ecb..4cc78bbc40 100644 Binary files a/docs/docassets/images/adf-dialog-alert-standart.png and b/docs/docassets/images/adf-dialog-alert-standart.png differ diff --git a/docs/docassets/images/adf-dialog-alert-with-icon.png b/docs/docassets/images/adf-dialog-alert-with-icon.png index 6540f95c79..88a2802896 100644 Binary files a/docs/docassets/images/adf-dialog-alert-with-icon.png and b/docs/docassets/images/adf-dialog-alert-with-icon.png differ diff --git a/docs/docassets/images/adf-dialog-with-additional-buttons.png b/docs/docassets/images/adf-dialog-with-additional-buttons.png index 71b67d58c2..361d47b10d 100644 Binary files a/docs/docassets/images/adf-dialog-with-additional-buttons.png and b/docs/docassets/images/adf-dialog-with-additional-buttons.png differ diff --git a/docs/docassets/images/adf-dialog.png b/docs/docassets/images/adf-dialog.png index d10cb2e626..2886bbb74d 100644 Binary files a/docs/docassets/images/adf-dialog.png and b/docs/docassets/images/adf-dialog.png differ diff --git a/lib/content-services/src/lib/dialogs/public-api.ts b/lib/content-services/src/lib/dialogs/public-api.ts index 85e8637d79..48c2d4db06 100644 --- a/lib/content-services/src/lib/dialogs/public-api.ts +++ b/lib/content-services/src/lib/dialogs/public-api.ts @@ -22,7 +22,6 @@ export * from './category-selector.dialog'; export * from './dialog.module'; export * from './library/library.dialog'; -export * from './dialog'; export * from './download-zip/download-zip.dialog'; export * from './download-zip/download-zip.dialog.module'; diff --git a/lib/content-services/src/lib/dialogs/dialog/dialog-data.interface.ts b/lib/core/src/lib/dialogs/dialog/dialog-data.interface.ts similarity index 79% rename from lib/content-services/src/lib/dialogs/dialog/dialog-data.interface.ts rename to lib/core/src/lib/dialogs/dialog/dialog-data.interface.ts index 9f2ce2bdcc..b003b395bb 100644 --- a/lib/content-services/src/lib/dialogs/dialog/dialog-data.interface.ts +++ b/lib/core/src/lib/dialogs/dialog/dialog-data.interface.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { TemplateRef } from '@angular/core'; +import { TemplateRef, Type } from '@angular/core'; import { Subject } from 'rxjs'; import { DialogSizes } from './dialog.model'; @@ -28,8 +28,17 @@ export interface DialogData { isCloseButtonHidden?: boolean; isCancelButtonHidden?: boolean; dialogSize?: DialogSizes; + contentText?: string; + contentComponent?: Type; contentTemplate?: TemplateRef; actionsTemplate?: TemplateRef; descriptionTemplate?: TemplateRef; headerIcon?: string; + additionalActionButtons?: AdditionalDialogActionButton[]; +} + +export interface AdditionalDialogActionButton { + title: string; + onClick: (args?: any) => void; + class?: string; } diff --git a/lib/content-services/src/lib/dialogs/dialog/dialog.component.html b/lib/core/src/lib/dialogs/dialog/dialog.component.html similarity index 55% rename from lib/content-services/src/lib/dialogs/dialog/dialog.component.html rename to lib/core/src/lib/dialogs/dialog/dialog.component.html index c39f083927..eb060f50cd 100644 --- a/lib/content-services/src/lib/dialogs/dialog/dialog.component.html +++ b/lib/core/src/lib/dialogs/dialog/dialog.component.html @@ -1,12 +1,12 @@
- {{data.headerIcon}} + {{ data.headerIcon }} -

{{data.title}}

+

{{ data.title | translate }}

- + + + {{ data.contentText }} - -
+ +
+ +
+ +
+
diff --git a/lib/content-services/src/lib/dialogs/dialog/dialog.component.scss b/lib/core/src/lib/dialogs/dialog/dialog.component.scss similarity index 62% rename from lib/content-services/src/lib/dialogs/dialog/dialog.component.scss rename to lib/core/src/lib/dialogs/dialog/dialog.component.scss index 22ccaa35cb..45edaa63ff 100644 --- a/lib/content-services/src/lib/dialogs/dialog/dialog.component.scss +++ b/lib/core/src/lib/dialogs/dialog/dialog.component.scss @@ -12,21 +12,97 @@ $dialog-small-s-height: 360px; $l-screen: 1920px; $m-screen: 1680px; $s-screen: 1440px; -$xs-screen: 375px; +$xs-screen: 500px; +$xxs-screen: 375px; -$breakpoint-alert-with-additional-buttons-centered: 1469px; -$breakpoint-medium-with-additional-buttons-centered: 1469px; +$breakpoint-alert-with-additional-buttons-centered: 1501px; +$breakpoint-medium-with-additional-buttons-centered: 1002px; $breakpoint-large-with-additional-buttons-centered: 642px; +$breakpoint-medium-screen: 920px; $dialog-padding: 24px; +.adf-large-dialog-panel, +.adf-medium-dialog-panel, +.adf-alert-dialog-panel { + min-width: calc(269px - $dialog-padding * 2); + + @media screen and (max-width: $xxs-screen) { + .adf-additional-actions { + justify-content: center; + } + } +} + +.adf-large-dialog-panel { + max-width: calc(56vw); + + @media screen and (min-width: $l-screen) { + max-width: calc($dialog-large-l-width); + } + + @media screen and (max-width: $xs-screen) { + max-width: calc(100vw); + } + + @media screen and (max-width: $breakpoint-large-with-additional-buttons-centered) { + .adf-additional-actions { + justify-content: center; + } + } +} + +.adf-medium-dialog-panel { + max-width: calc(36vw); + + @media screen and (min-width: $l-screen) { + max-width: calc($dialog-medium-l-width); + } + + @media screen and (max-width: $breakpoint-medium-screen) { + max-width: calc(84vw); + } + + @media screen and (max-width: $xxs-screen) { + max-width: calc(100vw); + } + + @media screen and (max-width: $breakpoint-medium-with-additional-buttons-centered) { + .adf-additional-actions { + justify-content: center; + } + } +} + +.adf-alert-dialog-panel { + max-width: 24vw; + + @media screen and (min-width: $m-screen) { + max-width: $dialog-small-l-width; + } + + @media screen and (max-width: $s-screen) { + max-width: $dialog-small-s-width; + } + + @media screen and (max-width: $xxs-screen) { + max-width: 84vw; + } + + @media screen and (max-width: $breakpoint-alert-with-additional-buttons-centered) { + .adf-additional-actions { + justify-content: center; + } + } +} + .adf-dialog-container { min-width: calc(269px - $dialog-padding * 2); - min-height: calc(300px - $dialog-padding * 2); + min-height: calc(188px - $dialog-padding * 2); + max-height: calc(84vh - $dialog-padding * 2); position: relative; display: flex; flex-direction: column; - max-height: calc(84vh - $dialog-padding * 2); .adf-dialog-header, .adf-dialog-content, @@ -99,40 +175,16 @@ $dialog-padding: 24px; padding-top: $dialog-padding; text-transform: capitalize; min-height: auto; - - // TODO: Update after migration to Angular 15 - /* stylelint-disable-next-line selector-class-pattern */ - .mat-button.mat-button-base + .mat-button-base { - margin-left: 16px; - } - - // TODO: Update after migration to Angular 15 - /* stylelint-disable-next-line selector-class-pattern */ - .mat-button { - text-transform: capitalize; - } - } - - // TODO: Update after migration to Angular 15 - /* stylelint-disable-next-line selector-class-pattern */ - .mat-dialog-container { - border-radius: 8px; } &.adf-large { - max-width: calc(56vw - $dialog-padding * 2); max-height: calc(84vh - $dialog-padding * 2); - @media screen and (min-width: $l-screen) { - max-width: calc($dialog-large-l-width - $dialog-padding * 2); - } - @media screen and (min-height: $dialog-large-l-width) { max-height: calc($dialog-large-l-height - $dialog-padding * 2); } - @media screen and (max-width: $xs-screen) { - max-width: calc(100vw - $dialog-padding * 2); + @media screen and (max-width: $xxs-screen) { max-height: calc(100vh - $dialog-padding * 2); } @@ -144,15 +196,9 @@ $dialog-padding: 24px; } &.adf-medium { - max-width: calc(36vw - $dialog-padding * 2); max-height: calc(72vh - $dialog-padding * 2); - @media screen and (min-width: $l-screen) { - max-width: calc($dialog-medium-l-width - $dialog-padding * 2); - } - - @media screen and (max-width: $xs-screen) { - max-width: calc(100vw - $dialog-padding * 2); + @media screen and (max-width: $xxs-screen) { max-height: calc(100vh - $dialog-padding * 2); } @@ -189,26 +235,22 @@ $dialog-padding: 24px; } } - max-width: calc(24vw - $dialog-padding * 2); max-height: calc(40vh - $dialog-padding * 2); @media screen and (min-width: $m-screen) { - max-width: calc($dialog-small-l-width - $dialog-padding * 2); max-height: calc($dialog-small-l-height - $dialog-padding * 2); } @media screen and (max-width: $s-screen) { - max-width: calc($dialog-small-s-width - $dialog-padding * 2); max-height: calc($dialog-small-s-height - $dialog-padding * 2); } - @media screen and (max-width: $xs-screen) { - max-width: calc(84vw - $dialog-padding * 2); - max-height: calc(41vh - $dialog-padding * 2); + @media screen and (max-width: $xxs-screen) { + max-height: calc(56vh - $dialog-padding * 2); } - @media screen and (max-height: $dialog-small-l-height) { - max-height: calc(84vh - $dialog-padding * 2); + @media screen and (max-height: $xxs-screen) { + max-height: 84vh; } @media screen and (max-width: $breakpoint-alert-with-additional-buttons-centered) { @@ -218,9 +260,25 @@ $dialog-padding: 24px; } } - @media screen and (max-width: $xs-screen) { + @media screen and (max-width: $xxs-screen) { .adf-additional-actions { justify-content: center; } } } + +.adf-additional-actions { + color: var(--theme-primary-color); +} + +// TODO: Update after migration to Angular 15 +/* stylelint-disable-next-line selector-class-pattern */ +.mat-dialog-actions .mat-button-base + .mat-button-base { + margin-left: 16px; +} + +// TODO: Update after migration to Angular 15 +/* stylelint-disable-next-line selector-class-pattern */ +.mat-dialog-container { + border-radius: 8px; +} diff --git a/lib/content-services/src/lib/dialogs/dialog/dialog.component.spec.ts b/lib/core/src/lib/dialogs/dialog/dialog.component.spec.ts similarity index 91% rename from lib/content-services/src/lib/dialogs/dialog/dialog.component.spec.ts rename to lib/core/src/lib/dialogs/dialog/dialog.component.spec.ts index 403c72c9b6..3897fd90ad 100644 --- a/lib/content-services/src/lib/dialogs/dialog/dialog.component.spec.ts +++ b/lib/core/src/lib/dialogs/dialog/dialog.component.spec.ts @@ -17,10 +17,10 @@ import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { ContentTestingModule } from '../../testing/content.testing.module'; import { DialogComponent } from './dialog.component'; import { DialogData } from './dialog-data.interface'; import { DialogSize } from './dialog.model'; +import { CoreTestingModule } from '../../testing'; describe('DialogComponent', () => { let component: DialogComponent; @@ -36,12 +36,13 @@ describe('DialogComponent', () => { }; const dialogRef = { - close: jasmine.createSpy('close') + close: jasmine.createSpy('close'), + addPanelClass: jasmine.createSpy('addPanelClass') }; const setupBeforeEach = (dialogOptions: DialogData = data) => { TestBed.configureTestingModule({ - imports: [ContentTestingModule], + imports: [CoreTestingModule], providers: [ { provide: MAT_DIALOG_DATA, useValue: dialogOptions }, { provide: MatDialogRef, useValue: dialogRef } @@ -54,8 +55,7 @@ describe('DialogComponent', () => { confirmButton = fixture.nativeElement.querySelector('[data-automation-id="adf-dialog-actions-confirm"]'); closeButton = fixture.nativeElement.querySelector('[data-automation-id="adf-dialog-close-button"]'); - cancelButton = fixture.nativeElement.querySelector( - '[data-automation-id="adf-dialog-actions-cancel"]'); + cancelButton = fixture.nativeElement.querySelector('[data-automation-id="adf-dialog-actions-cancel"]'); dialogContainer = fixture.debugElement.nativeElement.querySelector('[data-automation-id="adf-dialog-container"]'); }; @@ -85,7 +85,7 @@ describe('DialogComponent', () => { describe('confirm action', () => { const mockButtonTitle = 'mockTitle'; beforeEach(() => { - setupBeforeEach({ ...data, confirmButtonTitle: mockButtonTitle}); + setupBeforeEach({ ...data, confirmButtonTitle: mockButtonTitle }); fixture.detectChanges(); }); @@ -115,7 +115,7 @@ describe('DialogComponent', () => { it('should close dialog', () => { component.onConfirm(); - expect(dialogRef.close).toHaveBeenCalled(); + expect(dialogRef.close).toHaveBeenCalledWith(true); }); it('should set correct button title', () => { @@ -145,24 +145,23 @@ describe('DialogComponent', () => { beforeEach(() => { setupBeforeEach({ ...data, - isCloseButtonHidden: true, + isCloseButtonHidden: true, isCancelButtonHidden: true }); }); - it ('should hide close button', () => { + it('should hide close button', () => { expect(closeButton).toBeNull(); }); - - it ('should hide close button', () => { + it('should hide close button', () => { expect(cancelButton).toBeNull(); }); }); describe('when dialog has large size', () => { beforeEach(() => { - setupBeforeEach({ ...data, dialogSize: DialogSize.Large}); + setupBeforeEach({ ...data, dialogSize: DialogSize.Large }); }); it('should have correct dialogSize value', () => { @@ -184,7 +183,7 @@ describe('DialogComponent', () => { describe('when dialog has medium size', () => { beforeEach(() => { - setupBeforeEach({ ...data, dialogSize: DialogSize.Medium}); + setupBeforeEach({ ...data, dialogSize: DialogSize.Medium }); }); it('should have correct dialogSize value', () => { @@ -207,7 +206,7 @@ describe('DialogComponent', () => { describe('when dialog has alert size', () => { describe('when dialog has not an ican', () => { beforeEach(() => { - setupBeforeEach({ ...data, dialogSize: DialogSize.Alert}); + setupBeforeEach({ ...data, dialogSize: DialogSize.Alert }); }); it('should have correct dialogSize value', () => { @@ -237,7 +236,7 @@ describe('DialogComponent', () => { beforeEach(() => { setupBeforeEach({ ...data, - dialogSize: DialogSize.Alert, + dialogSize: DialogSize.Alert, headerIcon: 'access_time' }); }); @@ -248,7 +247,6 @@ describe('DialogComponent', () => { expect(headerIcon).toBeDefined(); }); - it('should center header content', () => { const header = fixture.nativeElement.querySelector('.adf-centered-header'); diff --git a/lib/content-services/src/lib/dialogs/dialog/dialog.component.ts b/lib/core/src/lib/dialogs/dialog/dialog.component.ts similarity index 88% rename from lib/content-services/src/lib/dialogs/dialog/dialog.component.ts rename to lib/core/src/lib/dialogs/dialog/dialog.component.ts index 2f59abdf69..a341933678 100644 --- a/lib/content-services/src/lib/dialogs/dialog/dialog.component.ts +++ b/lib/core/src/lib/dialogs/dialog/dialog.component.ts @@ -17,7 +17,7 @@ import { Component, Inject, OnDestroy, ViewEncapsulation } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import { DialogData } from './dialog-data.interface'; +import { AdditionalDialogActionButton, DialogData } from './dialog-data.interface'; import { BehaviorSubject, Subject } from 'rxjs'; import { DialogSize, DialogSizes } from './dialog.model'; import { MaterialModule } from '../../material.module'; @@ -37,10 +37,10 @@ export class DialogComponent implements OnDestroy { isConfirmButtonDisabled$ = new BehaviorSubject(false); isCloseButtonHidden: boolean; isCancelButtonHidden: boolean; - dialogSize: DialogSizes; confirmButtonTitle: string; cancelButtonTitle: string; - disableSubmitButton = false; + dialogSize: DialogSizes; + additionalActionButtons: AdditionalDialogActionButton[]; private onDestroy$ = new Subject(); @@ -55,6 +55,8 @@ export class DialogComponent implements OnDestroy { this.dialogSize = data.dialogSize || DialogSize.Medium; this.confirmButtonTitle = data.confirmButtonTitle || 'COMMON.APPLY'; this.cancelButtonTitle = data.cancelButtonTitle || 'COMMON.CANCEL'; + this.additionalActionButtons = data.additionalActionButtons; + this.dialogRef.addPanelClass(`${this.dialogSize}-dialog-panel`); if (data.isConfirmButtonDisabled$) { data.isConfirmButtonDisabled$.pipe(takeUntil(this.onDestroy$)).subscribe((value) => this.isConfirmButtonDisabled$.next(value)); @@ -64,7 +66,7 @@ export class DialogComponent implements OnDestroy { onConfirm() { this.isConfirmButtonDisabled$.next(true); - this.dialogRef.close(); + this.dialogRef.close(true); } ngOnDestroy() { diff --git a/lib/content-services/src/lib/dialogs/dialog/dialog.model.ts b/lib/core/src/lib/dialogs/dialog/dialog.model.ts similarity index 91% rename from lib/content-services/src/lib/dialogs/dialog/dialog.model.ts rename to lib/core/src/lib/dialogs/dialog/dialog.model.ts index dc92124977..8a19561f17 100644 --- a/lib/content-services/src/lib/dialogs/dialog/dialog.model.ts +++ b/lib/core/src/lib/dialogs/dialog/dialog.model.ts @@ -21,4 +21,4 @@ export const DialogSize = { Alert: 'adf-alert' } as const; -export type DialogSizes = typeof DialogSize[keyof typeof DialogSize]; +export type DialogSizes = (typeof DialogSize)[keyof typeof DialogSize]; diff --git a/lib/content-services/src/lib/dialogs/dialog/index.ts b/lib/core/src/lib/dialogs/dialog/index.ts similarity index 100% rename from lib/content-services/src/lib/dialogs/dialog/index.ts rename to lib/core/src/lib/dialogs/dialog/index.ts diff --git a/lib/core/src/lib/dialogs/public-api.ts b/lib/core/src/lib/dialogs/public-api.ts index 1fa006cdd0..1dbe405175 100755 --- a/lib/core/src/lib/dialogs/public-api.ts +++ b/lib/core/src/lib/dialogs/public-api.ts @@ -20,3 +20,4 @@ export * from './edit-json/edit-json.dialog.module'; export * from './unsaved-changes-dialog/unsaved-changes-dialog.component'; export * from './unsaved-changes-dialog/unsaved-changes-dialog.module'; export * from './unsaved-changes-dialog/unsaved-changes.guard'; +export * from './dialog';