Skip to content

Commit 1311700

Browse files
author
Danil Khaliulin
committed
confirm-dialog: ConfirmDialogService.providers() инкапсулирует ConfirmationService, праймовский импорт убран из сторис
1 parent cea2739 commit 1311700

5 files changed

Lines changed: 35 additions & 41 deletions

File tree

‎src/lib/components/confirm-dialog/confirm-dialog.service.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,10 @@ export type ConfirmDialogOptions = Pick<
88

99
@Injectable()
1010
export class ConfirmDialogService {
11+
static providers() {
12+
return [ConfirmationService, ConfirmDialogService];
13+
}
14+
1115
constructor(private readonly confirmationService: ConfirmationService) {}
1216

1317
confirm(options: ConfirmDialogOptions): void {

‎src/stories/components/confirm-dialog/confirm-dialog.stories.ts‎

Lines changed: 15 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,10 @@ const meta: Meta<ConfirmDialogComponent> = {
1111
parameters: {
1212
docs: {
1313
description: {
14-
component: `Компонент для подтверждения действий пользователя. Требует подключения \`ConfirmationService\` и \`ConfirmDialogService\`.
14+
component: `Компонент для подтверждения действий пользователя.
1515
1616
\`\`\`typescript
1717
import { ConfirmDialogComponent, ConfirmDialogService } from '@cdek-it/angular-ui-kit';
18-
import { ConfirmationService } from 'primeng/api';
1918
\`\`\``,
2019
},
2120
},
@@ -71,17 +70,15 @@ export const Default: Story = {
7170
language: 'ts',
7271
code: `
7372
import { Component } from '@angular/core';
74-
import { Button } from 'primeng/button';
75-
import { ConfirmationService } from 'primeng/api';
76-
import { ConfirmDialogComponent, ConfirmDialogService } from '@cdek-it/angular-ui-kit';
73+
import { ConfirmDialogComponent, ConfirmDialogService, ButtonComponent } from '@cdek-it/angular-ui-kit';
7774
7875
@Component({
7976
selector: 'app-confirm-dialog-default',
8077
standalone: true,
81-
imports: [ConfirmDialogComponent, Button],
82-
providers: [ConfirmationService, ConfirmDialogService],
78+
imports: [ConfirmDialogComponent, ButtonComponent],
79+
providers: [ConfirmDialogService.providers()],
8380
template: \`
84-
<p-button label="Показать диалог" severity="contrast" (onClick)="showConfirm()"></p-button>
81+
<button label="Показать диалог" severity="contrast" (click)="showConfirm()"></button>
8582
<confirm-dialog key="cd-default"></confirm-dialog>
8683
\`,
8784
})
@@ -122,9 +119,7 @@ export const Severities: Story = {
122119
language: 'ts',
123120
code: `
124121
import { Component } from '@angular/core';
125-
import { Button } from 'primeng/button';
126-
import { ConfirmationService } from 'primeng/api';
127-
import { ConfirmDialogComponent, ConfirmDialogService } from '@cdek-it/angular-ui-kit';
122+
import { ConfirmDialogComponent, ConfirmDialogService, ButtonComponent } from '@cdek-it/angular-ui-kit';
128123
129124
const SEVERITIES = [
130125
{ type: 'success', buttonSeverity: 'success', icon: 'ti ti-circle-check', label: 'Успех', header: 'Успех', message: 'Операция выполнена успешно.', acceptLabel: 'OK' },
@@ -137,8 +132,8 @@ const SEVERITIES = [
137132
@Component({
138133
selector: 'app-confirm-dialog-severities',
139134
standalone: true,
140-
imports: [ConfirmDialogComponent, Button],
141-
providers: [ConfirmationService, ConfirmDialogService],
135+
imports: [ConfirmDialogComponent, ButtonComponent],
136+
providers: [ConfirmDialogService.providers()],
142137
template: \`
143138
<confirm-dialog key="cd-severity-success" severity="success"></confirm-dialog>
144139
<confirm-dialog key="cd-severity-info" severity="info"></confirm-dialog>
@@ -148,12 +143,12 @@ const SEVERITIES = [
148143
149144
<div class="flex flex-wrap gap-2">
150145
@for (severity of severities; track severity.type) {
151-
<p-button
146+
<button
152147
[label]="'Показать: ' + severity.label"
153148
[severity]="severity.buttonSeverity"
154149
variant="outlined"
155-
(onClick)="showConfirm(severity)"
156-
></p-button>
150+
(click)="showConfirm(severity)"
151+
></button>
157152
}
158153
</div>
159154
\`,
@@ -197,9 +192,7 @@ export const Sizes: Story = {
197192
language: 'ts',
198193
code: `
199194
import { Component } from '@angular/core';
200-
import { Button } from 'primeng/button';
201-
import { ConfirmationService } from 'primeng/api';
202-
import { ConfirmDialogComponent, ConfirmDialogService } from '@cdek-it/angular-ui-kit';
195+
import { ConfirmDialogComponent, ConfirmDialogService, ButtonComponent } from '@cdek-it/angular-ui-kit';
203196
204197
const SIZES = [
205198
{ key: 'sm', label: 'Small' },
@@ -211,8 +204,8 @@ const SIZES = [
211204
@Component({
212205
selector: 'app-confirm-dialog-sizes',
213206
standalone: true,
214-
imports: [ConfirmDialogComponent, Button],
215-
providers: [ConfirmationService, ConfirmDialogService],
207+
imports: [ConfirmDialogComponent, ButtonComponent],
208+
providers: [ConfirmDialogService.providers()],
216209
template: \`
217210
<confirm-dialog key="cd-size-sm" size="sm"></confirm-dialog>
218211
<confirm-dialog key="cd-size-default"></confirm-dialog>
@@ -221,7 +214,7 @@ const SIZES = [
221214
222215
<div class="flex flex-wrap gap-2">
223216
@for (size of sizes; track size.key) {
224-
<p-button [label]="size.label" severity="contrast" (onClick)="showConfirm(size)"></p-button>
217+
<button [label]="size.label" severity="contrast" (click)="showConfirm(size)"></button>
225218
}
226219
</div>
227220
\`,

‎src/stories/components/confirm-dialog/examples/confirm-dialog-default.component.ts‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
11
import { Component } from '@angular/core';
2-
import { Button } from 'primeng/button';
3-
import { ConfirmationService } from 'primeng/api';
2+
import { ButtonComponent } from '../../../../lib/components/button/button.component';
43
import { ConfirmDialogComponent } from '../../../../lib/components/confirm-dialog/confirm-dialog.component';
54
import { ConfirmDialogService } from '../../../../lib/components/confirm-dialog/confirm-dialog.service';
65

76
const template = `
87
<div class="bg-surface-ground">
9-
<p-button label="Показать диалог" severity="contrast" (onClick)="showConfirm()"></p-button>
8+
<button label="Показать диалог" severity="contrast" (click)="showConfirm()"></button>
109
1110
<confirm-dialog key="cd-default"></confirm-dialog>
1211
</div>
@@ -15,8 +14,8 @@ const template = `
1514
@Component({
1615
selector: 'app-confirm-dialog-default',
1716
standalone: true,
18-
imports: [ConfirmDialogComponent, Button],
19-
providers: [ConfirmationService, ConfirmDialogService],
17+
imports: [ConfirmDialogComponent, ButtonComponent],
18+
providers: [ConfirmDialogService.providers()],
2019
template,
2120
})
2221
export class ConfirmDialogDefaultComponent {

‎src/stories/components/confirm-dialog/examples/confirm-dialog-severities.component.ts‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { Component } from '@angular/core';
2-
import { Button } from 'primeng/button';
3-
import { ConfirmationService } from 'primeng/api';
2+
import { ButtonComponent } from '../../../../lib/components/button/button.component';
43
import { ConfirmDialogComponent } from '../../../../lib/components/confirm-dialog/confirm-dialog.component';
54
import { ConfirmDialogService } from '../../../../lib/components/confirm-dialog/confirm-dialog.service';
65

@@ -72,12 +71,12 @@ const template = `
7271
7372
<div class="flex flex-wrap gap-2">
7473
@for (severity of severities; track severity.type) {
75-
<p-button
74+
<button
7675
[label]="'Показать: ' + severity.label"
7776
[severity]="severity.buttonSeverity"
7877
variant="outlined"
79-
(onClick)="showConfirm(severity)"
80-
></p-button>
78+
(click)="showConfirm(severity)"
79+
></button>
8180
}
8281
</div>
8382
</div>
@@ -86,8 +85,8 @@ const template = `
8685
@Component({
8786
selector: 'app-confirm-dialog-severities',
8887
standalone: true,
89-
imports: [ConfirmDialogComponent, Button],
90-
providers: [ConfirmationService, ConfirmDialogService],
88+
imports: [ConfirmDialogComponent, ButtonComponent],
89+
providers: [ConfirmDialogService.providers()],
9190
template,
9291
})
9392
export class ConfirmDialogSeveritiesComponent {

‎src/stories/components/confirm-dialog/examples/confirm-dialog-sizes.component.ts‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { Component } from '@angular/core';
2-
import { Button } from 'primeng/button';
3-
import { ConfirmationService } from 'primeng/api';
2+
import { ButtonComponent } from '../../../../lib/components/button/button.component';
43
import {
54
ConfirmDialogComponent,
65
ConfirmDialogSize,
@@ -28,11 +27,11 @@ const template = `
2827
2928
<div class="flex flex-wrap gap-2">
3029
@for (size of sizes; track size.key) {
31-
<p-button
30+
<button
3231
[label]="size.label"
3332
severity="contrast"
34-
(onClick)="showConfirm(size)"
35-
></p-button>
33+
(click)="showConfirm(size)"
34+
></button>
3635
}
3736
</div>
3837
</div>
@@ -41,8 +40,8 @@ const template = `
4140
@Component({
4241
selector: 'app-confirm-dialog-sizes',
4342
standalone: true,
44-
imports: [ConfirmDialogComponent, Button],
45-
providers: [ConfirmationService, ConfirmDialogService],
43+
imports: [ConfirmDialogComponent, ButtonComponent],
44+
providers: [ConfirmDialogService.providers()],
4645
template,
4746
})
4847
export class ConfirmDialogSizesComponent {

0 commit comments

Comments
 (0)