@datarailsshared/datarailsshared 1.6.320 → 1.6.324
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/datarailsshared-datarailsshared-1.6.324.tgz +0 -0
- package/esm2022/lib/dr-file-upload/dr-file-upload-item/dr-file-upload-item.component.mjs +6 -5
- package/esm2022/lib/dr-toastr/default-toastr/default-toastr.component.mjs +43 -13
- package/esm2022/lib/dr-toastr/dr-toastr.module.mjs +6 -4
- package/esm2022/lib/dr-toastr/dr-toastr.service.mjs +11 -10
- package/esm2022/lib/models/toastr.mjs +1 -1
- package/fesm2022/datarailsshared-datarailsshared.mjs +60 -28
- package/fesm2022/datarailsshared-datarailsshared.mjs.map +1 -1
- package/lib/dr-toastr/default-toastr/default-toastr.component.d.ts +1 -1
- package/lib/dr-toastr/dr-toastr.module.d.ts +3 -3
- package/lib/dr-toastr/dr-toastr.service.d.ts +5 -4
- package/lib/models/toastr.d.ts +10 -0
- package/package.json +1 -1
- package/datarailsshared-datarailsshared-1.6.320.tgz +0 -0
|
@@ -13486,8 +13486,8 @@ const ToastrStatusIcon = {
|
|
|
13486
13486
|
[ToastrStatus.WARNING]: 'dr-icon-noty-warning',
|
|
13487
13487
|
};
|
|
13488
13488
|
|
|
13489
|
-
function
|
|
13490
|
-
i0.ɵɵelementStart(0, "div",
|
|
13489
|
+
function DefaultToastrComponent_div_7_Template(rf, ctx) { if (rf & 1) {
|
|
13490
|
+
i0.ɵɵelementStart(0, "div", 10);
|
|
13491
13491
|
i0.ɵɵtext(1);
|
|
13492
13492
|
i0.ɵɵelementEnd();
|
|
13493
13493
|
} if (rf & 2) {
|
|
@@ -13495,12 +13495,33 @@ function DefaultToastrComponent_div_6_Template(rf, ctx) { if (rf & 1) {
|
|
|
13495
13495
|
i0.ɵɵadvance(1);
|
|
13496
13496
|
i0.ɵɵtextInterpolate1(" ", ctx_r0.data.message, " ");
|
|
13497
13497
|
} }
|
|
13498
|
-
function
|
|
13499
|
-
i0.ɵɵelement(0, "div",
|
|
13498
|
+
function DefaultToastrComponent_ng_template_8_Template(rf, ctx) { if (rf & 1) {
|
|
13499
|
+
i0.ɵɵelement(0, "div", 11);
|
|
13500
13500
|
} if (rf & 2) {
|
|
13501
13501
|
const ctx_r2 = i0.ɵɵnextContext();
|
|
13502
13502
|
i0.ɵɵproperty("innerHTML", ctx_r2.data.message, i0.ɵɵsanitizeHtml);
|
|
13503
13503
|
} }
|
|
13504
|
+
function DefaultToastrComponent_div_10_dr_button_1_Template(rf, ctx) { if (rf & 1) {
|
|
13505
|
+
const _r7 = i0.ɵɵgetCurrentView();
|
|
13506
|
+
i0.ɵɵelementStart(0, "dr-button", 14);
|
|
13507
|
+
i0.ɵɵlistener("click", function DefaultToastrComponent_div_10_dr_button_1_Template_dr_button_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r7); const actionItem_r5 = restoredCtx.$implicit; return i0.ɵɵresetView(actionItem_r5.onAction()); });
|
|
13508
|
+
i0.ɵɵtext(1);
|
|
13509
|
+
i0.ɵɵelementEnd();
|
|
13510
|
+
} if (rf & 2) {
|
|
13511
|
+
const actionItem_r5 = ctx.$implicit;
|
|
13512
|
+
i0.ɵɵproperty("theme", actionItem_r5.theme);
|
|
13513
|
+
i0.ɵɵadvance(1);
|
|
13514
|
+
i0.ɵɵtextInterpolate1(" ", actionItem_r5.label, " ");
|
|
13515
|
+
} }
|
|
13516
|
+
function DefaultToastrComponent_div_10_Template(rf, ctx) { if (rf & 1) {
|
|
13517
|
+
i0.ɵɵelementStart(0, "div", 12);
|
|
13518
|
+
i0.ɵɵtemplate(1, DefaultToastrComponent_div_10_dr_button_1_Template, 2, 2, "dr-button", 13);
|
|
13519
|
+
i0.ɵɵelementEnd();
|
|
13520
|
+
} if (rf & 2) {
|
|
13521
|
+
const ctx_r3 = i0.ɵɵnextContext();
|
|
13522
|
+
i0.ɵɵadvance(1);
|
|
13523
|
+
i0.ɵɵproperty("ngForOf", ctx_r3.data.options.actions);
|
|
13524
|
+
} }
|
|
13504
13525
|
class DefaultToastrComponent extends Toast {
|
|
13505
13526
|
constructor(toastrService, toastPackage) {
|
|
13506
13527
|
super(toastrService, toastPackage);
|
|
@@ -13511,6 +13532,7 @@ class DefaultToastrComponent extends Toast {
|
|
|
13511
13532
|
message: '',
|
|
13512
13533
|
status: ToastrStatus.SUCCESS,
|
|
13513
13534
|
isHtmlBody: false,
|
|
13535
|
+
options: {},
|
|
13514
13536
|
};
|
|
13515
13537
|
this.icon = ToastrStatusIcon[this.data.status];
|
|
13516
13538
|
this.class = this.data.status;
|
|
@@ -13522,31 +13544,37 @@ class DefaultToastrComponent extends Toast {
|
|
|
13522
13544
|
/** @nocollapse */ static { this.ɵfac = function DefaultToastrComponent_Factory(t) { return new (t || DefaultToastrComponent)(i0.ɵɵdirectiveInject(i1$6.ToastrService), i0.ɵɵdirectiveInject(i1$6.ToastPackage)); }; }
|
|
13523
13545
|
/** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DefaultToastrComponent, selectors: [["dr-default-toastr"]], hostVars: 2, hostBindings: function DefaultToastrComponent_HostBindings(rf, ctx) { if (rf & 2) {
|
|
13524
13546
|
i0.ɵɵclassMap(ctx.class);
|
|
13525
|
-
} }, features: [i0.ɵɵInheritDefinitionFeature], decls:
|
|
13547
|
+
} }, standalone: true, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵStandaloneFeature], decls: 12, vars: 7, consts: [[1, "status-bar"], [1, "content"], [1, "content__status-icon", 3, "ngClass"], [1, "content__container"], [1, "content__container__title"], [1, "content__wrapper"], ["class", "content__container__message", 4, "ngIf", "ngIfElse"], ["htmlBody", ""], ["class", "content__container__actions", 4, "ngIf"], [1, "content__close-icon", "dr-icon-exit"], [1, "content__container__message"], [1, "content__container__message", 3, "innerHTML"], [1, "content__container__actions"], ["class", "content__container__actions__button", 3, "theme", "click", 4, "ngFor", "ngForOf"], [1, "content__container__actions__button", 3, "theme", "click"]], template: function DefaultToastrComponent_Template(rf, ctx) { if (rf & 1) {
|
|
13526
13548
|
i0.ɵɵelement(0, "div", 0);
|
|
13527
13549
|
i0.ɵɵelementStart(1, "div", 1);
|
|
13528
13550
|
i0.ɵɵelement(2, "i", 2);
|
|
13529
13551
|
i0.ɵɵelementStart(3, "div", 3)(4, "span", 4);
|
|
13530
13552
|
i0.ɵɵtext(5);
|
|
13531
13553
|
i0.ɵɵelementEnd();
|
|
13532
|
-
i0.ɵɵ
|
|
13533
|
-
i0.ɵɵtemplate(7,
|
|
13534
|
-
i0.ɵɵ
|
|
13535
|
-
i0.ɵɵ
|
|
13554
|
+
i0.ɵɵelementStart(6, "div", 5);
|
|
13555
|
+
i0.ɵɵtemplate(7, DefaultToastrComponent_div_7_Template, 2, 1, "div", 6);
|
|
13556
|
+
i0.ɵɵtemplate(8, DefaultToastrComponent_ng_template_8_Template, 1, 1, "ng-template", null, 7, i0.ɵɵtemplateRefExtractor);
|
|
13557
|
+
i0.ɵɵtemplate(10, DefaultToastrComponent_div_10_Template, 2, 1, "div", 8);
|
|
13558
|
+
i0.ɵɵelementEnd()();
|
|
13559
|
+
i0.ɵɵelement(11, "i", 9);
|
|
13536
13560
|
i0.ɵɵelementEnd();
|
|
13537
13561
|
} if (rf & 2) {
|
|
13538
|
-
const _r1 = i0.ɵɵreference(
|
|
13562
|
+
const _r1 = i0.ɵɵreference(9);
|
|
13539
13563
|
i0.ɵɵadvance(2);
|
|
13540
13564
|
i0.ɵɵproperty("ngClass", ctx.icon);
|
|
13541
13565
|
i0.ɵɵadvance(3);
|
|
13542
13566
|
i0.ɵɵtextInterpolate1(" ", ctx.data.title, " ");
|
|
13543
13567
|
i0.ɵɵadvance(1);
|
|
13568
|
+
i0.ɵɵclassProp("content__wrapper--inline", ctx.data.options == null ? null : ctx.data.options.inlineActions);
|
|
13569
|
+
i0.ɵɵadvance(1);
|
|
13544
13570
|
i0.ɵɵproperty("ngIf", !ctx.data.isHtmlBody)("ngIfElse", _r1);
|
|
13545
|
-
|
|
13571
|
+
i0.ɵɵadvance(3);
|
|
13572
|
+
i0.ɵɵproperty("ngIf", ctx.data == null ? null : ctx.data.options == null ? null : ctx.data.options.actions == null ? null : ctx.data.options.actions.length);
|
|
13573
|
+
} }, dependencies: [CommonModule, i1$1.NgClass, i1$1.NgForOf, i1$1.NgIf, DrButtonComponent], styles: [".toastr-bottom-left{left:24px!important;bottom:24px!important} dr-default-toastr:not(:last-child){margin-bottom:24px!important}.ngx-toastr[_nghost-%COMP%]{display:flex;flex-direction:column;background:#fff;position:relative;overflow:hidden;pointer-events:auto;min-width:280px;max-width:480px;width:-moz-fit-content;width:fit-content;border-radius:6px;padding:0;margin:0;box-shadow:0 4px 14px #00000040}.ngx-toastr[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{display:flex;width:100%;height:5px}.ngx-toastr[_nghost-%COMP%] .content[_ngcontent-%COMP%]{display:flex;flex-grow:1;padding:12px 16px}.ngx-toastr[_nghost-%COMP%] .content__wrapper--inline[_ngcontent-%COMP%]{display:inline-flex;align-items:center;width:max-content}.ngx-toastr[_nghost-%COMP%] .content__close-icon[_ngcontent-%COMP%]{color:#6d6e6f;cursor:pointer}.ngx-toastr[_nghost-%COMP%] .content__container[_ngcontent-%COMP%]{display:flex;flex-direction:column;flex-grow:1;padding:0 4px}.ngx-toastr[_nghost-%COMP%] .content__container__title[_ngcontent-%COMP%], .ngx-toastr[_nghost-%COMP%] .content__container__message[_ngcontent-%COMP%]{color:#333;word-break:break-word}.ngx-toastr[_nghost-%COMP%] .content__container__title[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:600}.ngx-toastr[_nghost-%COMP%] .content__container__message[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400}.ngx-toastr[_nghost-%COMP%] .content__container__message[_ngcontent-%COMP%] a[_ngcontent-%COMP%]{text-decoration:underline!important}.ngx-toastr[_nghost-%COMP%] .content__container__actions__button[_ngcontent-%COMP%]{position:relative;left:5px}.ngx-toastr.status-success[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{background-color:#03a678}.ngx-toastr.status-success[_nghost-%COMP%] .content__status-icon[_ngcontent-%COMP%]{color:#03a678}.ngx-toastr.status-info[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{background-color:#0061ff}.ngx-toastr.status-info[_nghost-%COMP%] .content__status-icon[_ngcontent-%COMP%]{color:#0061ff}.ngx-toastr.status-warning[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{background-color:#fda014}.ngx-toastr.status-warning[_nghost-%COMP%] .content__status-icon[_ngcontent-%COMP%]{color:#fda014}.ngx-toastr.status-danger[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{background-color:#de2833}.ngx-toastr.status-danger[_nghost-%COMP%] .content__status-icon[_ngcontent-%COMP%]{color:#de2833}"], changeDetection: 0 }); }
|
|
13546
13574
|
}
|
|
13547
13575
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DefaultToastrComponent, [{
|
|
13548
13576
|
type: Component,
|
|
13549
|
-
args: [{ selector: 'dr-default-toastr', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"status-bar\"></div>\n<div class=\"content\">\n <i class=\"content__status-icon\" [ngClass]=\"icon\"></i>\n <div class=\"content__container\">\n <span class=\"content__container__title\">\n {{ data.title }}\n </span>\n\n
|
|
13577
|
+
args: [{ selector: 'dr-default-toastr', standalone: true, imports: [CommonModule, DrButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"status-bar\"></div>\n<div class=\"content\">\n <i class=\"content__status-icon\" [ngClass]=\"icon\"></i>\n <div class=\"content__container\">\n <span class=\"content__container__title\">\n {{ data.title }}\n </span>\n <div class=\"content__wrapper\" [class.content__wrapper--inline]=\"data.options?.inlineActions\">\n <div class=\"content__container__message\" *ngIf=\"!data.isHtmlBody; else htmlBody\">\n {{ data.message }}\n </div>\n\n <ng-template #htmlBody>\n <div class=\"content__container__message\" [innerHTML]=\"data.message\"></div>\n </ng-template>\n\n <div class=\"content__container__actions\" *ngIf=\"data?.options?.actions?.length\">\n <dr-button \n class=\"content__container__actions__button\"\n *ngFor=\"let actionItem of data.options.actions\"\n [theme]=\"actionItem.theme\"\n (click)=\"actionItem.onAction()\">\n {{ actionItem.label }}\n </dr-button>\n </div>\n </div>\n </div>\n <i class=\"content__close-icon dr-icon-exit\"></i>\n</div>\n", styles: ["::ng-deep .toastr-bottom-left{left:24px!important;bottom:24px!important}::ng-deep dr-default-toastr:not(:last-child){margin-bottom:24px!important}:host.ngx-toastr{display:flex;flex-direction:column;background:#fff;position:relative;overflow:hidden;pointer-events:auto;min-width:280px;max-width:480px;width:-moz-fit-content;width:fit-content;border-radius:6px;padding:0;margin:0;box-shadow:0 4px 14px #00000040}:host.ngx-toastr .status-bar{display:flex;width:100%;height:5px}:host.ngx-toastr .content{display:flex;flex-grow:1;padding:12px 16px}:host.ngx-toastr .content__wrapper--inline{display:inline-flex;align-items:center;width:max-content}:host.ngx-toastr .content__close-icon{color:#6d6e6f;cursor:pointer}:host.ngx-toastr .content__container{display:flex;flex-direction:column;flex-grow:1;padding:0 4px}:host.ngx-toastr .content__container__title,:host.ngx-toastr .content__container__message{color:#333;word-break:break-word}:host.ngx-toastr .content__container__title{font-size:14px;line-height:24px;font-weight:600}:host.ngx-toastr .content__container__message{font-size:14px;line-height:24px;font-weight:400}:host.ngx-toastr .content__container__message a{text-decoration:underline!important}:host.ngx-toastr .content__container__actions__button{position:relative;left:5px}:host.ngx-toastr.status-success .status-bar{background-color:#03a678}:host.ngx-toastr.status-success .content__status-icon{color:#03a678}:host.ngx-toastr.status-info .status-bar{background-color:#0061ff}:host.ngx-toastr.status-info .content__status-icon{color:#0061ff}:host.ngx-toastr.status-warning .status-bar{background-color:#fda014}:host.ngx-toastr.status-warning .content__status-icon{color:#fda014}:host.ngx-toastr.status-danger .status-bar{background-color:#de2833}:host.ngx-toastr.status-danger .content__status-icon{color:#de2833}\n"] }]
|
|
13550
13578
|
}], function () { return [{ type: i1$6.ToastrService }, { type: i1$6.ToastPackage }]; }, { class: [{
|
|
13551
13579
|
type: HostBinding,
|
|
13552
13580
|
args: ['class']
|
|
@@ -14175,17 +14203,17 @@ class DrToastrService {
|
|
|
14175
14203
|
constructor(toastr) {
|
|
14176
14204
|
this.toastr = toastr;
|
|
14177
14205
|
}
|
|
14178
|
-
info(message, title, isHtmlBody, timeOut) {
|
|
14179
|
-
return this.showToastr(message, title, ToastrStatus.INFO, isHtmlBody, timeOut);
|
|
14206
|
+
info(message, title, isHtmlBody, timeOut, options) {
|
|
14207
|
+
return this.showToastr(message, title, ToastrStatus.INFO, isHtmlBody, timeOut, options);
|
|
14180
14208
|
}
|
|
14181
|
-
danger(message, title, isHtmlBody, timeOut) {
|
|
14182
|
-
return this.showToastr(message, title, ToastrStatus.ERROR, isHtmlBody, timeOut);
|
|
14209
|
+
danger(message, title, isHtmlBody, timeOut, options) {
|
|
14210
|
+
return this.showToastr(message, title, ToastrStatus.ERROR, isHtmlBody, timeOut, options);
|
|
14183
14211
|
}
|
|
14184
|
-
success(message, title, isHtmlBody, timeOut) {
|
|
14185
|
-
return this.showToastr(message, title, ToastrStatus.SUCCESS, isHtmlBody, timeOut);
|
|
14212
|
+
success(message, title, isHtmlBody, timeOut, options) {
|
|
14213
|
+
return this.showToastr(message, title, ToastrStatus.SUCCESS, isHtmlBody, timeOut, options);
|
|
14186
14214
|
}
|
|
14187
|
-
warning(message, title, isHtmlBody, timeOut) {
|
|
14188
|
-
return this.showToastr(message, title, ToastrStatus.WARNING, isHtmlBody, timeOut);
|
|
14215
|
+
warning(message, title, isHtmlBody, timeOut, options) {
|
|
14216
|
+
return this.showToastr(message, title, ToastrStatus.WARNING, isHtmlBody, timeOut, options);
|
|
14189
14217
|
}
|
|
14190
14218
|
clear(toastId) {
|
|
14191
14219
|
this.toastr.clear(toastId);
|
|
@@ -14195,7 +14223,7 @@ class DrToastrService {
|
|
|
14195
14223
|
this.toastr.remove(toastId);
|
|
14196
14224
|
}
|
|
14197
14225
|
}
|
|
14198
|
-
showToastr(message, title, status, isHtmlBody, timeOut = 5000) {
|
|
14226
|
+
showToastr(message, title, status, isHtmlBody, timeOut = 5000, options) {
|
|
14199
14227
|
const toastr = this.toastr.show('', '', {
|
|
14200
14228
|
positionClass: 'toastr-bottom-left',
|
|
14201
14229
|
tapToDismiss: true,
|
|
@@ -14207,6 +14235,7 @@ class DrToastrService {
|
|
|
14207
14235
|
message,
|
|
14208
14236
|
status,
|
|
14209
14237
|
isHtmlBody,
|
|
14238
|
+
options: options || {},
|
|
14210
14239
|
};
|
|
14211
14240
|
return toastr.toastId;
|
|
14212
14241
|
}
|
|
@@ -14798,6 +14827,7 @@ class DrToastrModule {
|
|
|
14798
14827
|
/** @nocollapse */ static { this.ɵfac = function DrToastrModule_Factory(t) { return new (t || DrToastrModule)(); }; }
|
|
14799
14828
|
/** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrToastrModule }); }
|
|
14800
14829
|
/** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ providers: [DrToastrService], imports: [CommonModule,
|
|
14830
|
+
DefaultToastrComponent,
|
|
14801
14831
|
ToastrModule.forRoot({
|
|
14802
14832
|
toastComponent: DefaultToastrComponent,
|
|
14803
14833
|
})] }); }
|
|
@@ -14805,18 +14835,19 @@ class DrToastrModule {
|
|
|
14805
14835
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrToastrModule, [{
|
|
14806
14836
|
type: NgModule,
|
|
14807
14837
|
args: [{
|
|
14808
|
-
declarations: [
|
|
14838
|
+
declarations: [],
|
|
14809
14839
|
imports: [
|
|
14810
14840
|
CommonModule,
|
|
14841
|
+
DefaultToastrComponent,
|
|
14811
14842
|
ToastrModule.forRoot({
|
|
14812
14843
|
toastComponent: DefaultToastrComponent,
|
|
14813
14844
|
}),
|
|
14814
14845
|
],
|
|
14815
|
-
exports: [DefaultToastrComponent],
|
|
14816
14846
|
providers: [DrToastrService],
|
|
14817
14847
|
}]
|
|
14818
14848
|
}], null, null); })();
|
|
14819
|
-
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrToastrModule, {
|
|
14849
|
+
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrToastrModule, { imports: [CommonModule,
|
|
14850
|
+
DefaultToastrComponent, i1$6.ToastrModule] }); })();
|
|
14820
14851
|
|
|
14821
14852
|
class DrCodeEditorModule {
|
|
14822
14853
|
/** @nocollapse */ static { this.ɵfac = function DrCodeEditorModule_Factory(t) { return new (t || DrCodeEditorModule)(); }; }
|
|
@@ -19457,9 +19488,9 @@ class DrFileUploadItemComponent {
|
|
|
19457
19488
|
this.remove.emit();
|
|
19458
19489
|
}
|
|
19459
19490
|
/** @nocollapse */ static { this.ɵfac = function DrFileUploadItemComponent_Factory(t) { return new (t || DrFileUploadItemComponent)(); }; }
|
|
19460
|
-
/** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrFileUploadItemComponent, selectors: [["dr-file-upload-item"]], hostAttrs: ["role", "article"], hostVars:
|
|
19491
|
+
/** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrFileUploadItemComponent, selectors: [["dr-file-upload-item"]], hostAttrs: ["role", "article"], hostVars: 13, hostBindings: function DrFileUploadItemComponent_HostBindings(rf, ctx) { if (rf & 2) {
|
|
19461
19492
|
i0.ɵɵattribute("aria-label", ctx.statusAriaText);
|
|
19462
|
-
i0.ɵɵclassProp("dr-file-upload-item--compact", ctx.compact)("dr-file-upload-item--success", (ctx.item == null ? null : ctx.item.status) === "success")("dr-file-upload-item--error", (ctx.item == null ? null : ctx.item.status) === "error")("dr-file-upload-item--uploading", (ctx.item == null ? null : ctx.item.status) === "uploading")("dr-file-upload-item--idle", (ctx.item == null ? null : ctx.item.status) === "idle");
|
|
19493
|
+
i0.ɵɵclassProp("dr-file-upload-item--compact", ctx.compact)("dr-file-upload-item--success", (ctx.item == null ? null : ctx.item.status) === "success")("dr-file-upload-item--error", (ctx.item == null ? null : ctx.item.status) === "error")("dr-file-upload-item--uploading", (ctx.item == null ? null : ctx.item.status) === "uploading")("dr-file-upload-item--idle", (ctx.item == null ? null : ctx.item.status) === "idle")("dr-file-upload-item--removable", ctx.withRemoveButton);
|
|
19463
19494
|
} }, inputs: { item: "item", removable: ["removable", "removable", booleanAttribute], compact: ["compact", "compact", booleanAttribute] }, outputs: { remove: "remove" }, standalone: true, features: [i0.ɵɵInputTransformsFeature, i0.ɵɵStandaloneFeature], decls: 9, vars: 3, consts: [["aria-hidden", "true", 1, "dr-file-upload-item__icon"], [1, "dr-icon-attachment"], [1, "dr-file-upload-item__content"], [1, "dr-file-upload-item__header"], [1, "dr-file-upload-item__filename"], [4, "ngIf"], ["class", "dr-file-upload-item__actions", 4, "ngIf"], ["class", "dr-file-upload-item__progress", 4, "ngIf"], ["class", "dr-file-upload-item__status", 4, "ngIf"], [1, "dr-file-upload-item__progress"], [3, "progress", "showValue"], ["class", "dr-file-upload-item__success-container", 4, "ngIf"], [1, "dr-file-upload-item__success-container"], ["class", "dr-file-upload-item__success-icon dr-icon-approve", "aria-hidden", "true", 4, "ngIf"], ["aria-hidden", "true", 1, "dr-file-upload-item__success-icon", "dr-icon-approve"], [1, "dr-file-upload-item__status"], [1, "dr-file-upload-item__actions"], ["type", "button", 1, "dr-file-upload-item__remove-btn", 3, "click"], ["aria-hidden", "true", 1, "dr-file-upload-item__remove-icon", "dr-icon-exit"]], template: function DrFileUploadItemComponent_Template(rf, ctx) { if (rf & 1) {
|
|
19464
19495
|
i0.ɵɵelementStart(0, "div", 0);
|
|
19465
19496
|
i0.ɵɵelement(1, "i", 1);
|
|
@@ -19477,7 +19508,7 @@ class DrFileUploadItemComponent {
|
|
|
19477
19508
|
i0.ɵɵproperty("ngIf", ctx.item.status !== "idle");
|
|
19478
19509
|
i0.ɵɵadvance(1);
|
|
19479
19510
|
i0.ɵɵproperty("ngIf", ctx.withActions);
|
|
19480
|
-
} }, dependencies: [CommonModule, i1$1.NgIf, DrProgressBarComponent, TextOverflowComponent], styles: ["[_nghost-%COMP%]{display:flex;align-items:center;gap:8px;padding:4px 24px 4px 16px;background:#fff;border:1px solid #dfe0e3;border-radius:6px;min-height:40px;width:100%}.dr-file-upload-item--compact[_nghost-%COMP%]{padding:4px 16px 4px 8px;width:200px}.dr-file-upload-item--compact[_nghost-%COMP%] .dr-file-upload-item__icon[_ngcontent-%COMP%]{width:24px;height:24px}.dr-file-upload-item--compact[_nghost-%COMP%] .dr-file-upload-item__filename[_ngcontent-%COMP%]{font-size:12px;line-height:16px;font-weight:400}.dr-file-upload-item__icon[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:linear-gradient(90deg,#4646ce1a 0% 100%),#fff;border-radius:4px;flex-shrink:0}.dr-file-upload-item__icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%]{font-size:24px;color:#4646ce}.dr-file-upload-item__content[_ngcontent-%COMP%]{display:flex;flex-direction:column;flex:1;min-width:0;gap:4px}.dr-file-upload-item__header[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:space-between;gap:16px}.dr-file-upload-item__filename[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dr-file-upload-item__progress[_ngcontent-%COMP%]{width:100%}.dr-file-upload-item__progress[_ngcontent-%COMP%] dr-progress-bar[_ngcontent-%COMP%]{gap:8px}.dr-file-upload-item__status[_ngcontent-%COMP%]{font-size:12px;line-height:16px;font-weight:400;color:#aeabac;min-height:26px}.dr-file-upload-item__actions[_ngcontent-%COMP%]{display:flex;align-items:center;gap:4px;flex-shrink:0}.dr-file-upload-item__success-container[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;border-radius:50%;width:16px;height:16px;background-color:#037c5a}.dr-file-upload-item__success-icon[_ngcontent-%COMP%]{font-size:16px;color:#fff}.dr-file-upload-item__remove-btn[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;border-radius:2px}.dr-file-upload-item__remove-btn[_ngcontent-%COMP%]:focus{outline:2px solid #4646ce;outline-offset:2px}.dr-file-upload-item__remove-btn[_ngcontent-%COMP%]:focus:not(:focus-visible){outline:none}.dr-file-upload-item__remove-btn[_ngcontent-%COMP%]:focus-visible{outline:2px solid #4646ce;outline-offset:2px}.dr-file-upload-item__remove-icon[_ngcontent-%COMP%]{font-size:24px;color:#6d6e6f;cursor:pointer;transition:color .2s ease-in-out}.dr-file-upload-item__remove-icon[_ngcontent-%COMP%]:hover{color:#333}.dr-file-upload-item--success[_nghost-%COMP%] .dr-file-upload-item__status[_ngcontent-%COMP%]{color:#037c5a}.dr-file-upload-item--error[_nghost-%COMP%] .dr-file-upload-item__status[_ngcontent-%COMP%]{color:#bf1d30}"], changeDetection: 0 }); }
|
|
19511
|
+
} }, dependencies: [CommonModule, i1$1.NgIf, DrProgressBarComponent, TextOverflowComponent], styles: ["[_nghost-%COMP%]{display:flex;align-items:center;gap:8px;padding:4px 24px 4px 16px;background:#fff;border:1px solid #dfe0e3;border-radius:6px;min-height:40px;width:100%}.dr-file-upload-item--compact[_nghost-%COMP%]{padding:4px 16px 4px 8px;width:200px}.dr-file-upload-item--compact[_nghost-%COMP%] .dr-file-upload-item__icon[_ngcontent-%COMP%]{width:24px;height:24px}.dr-file-upload-item--compact[_nghost-%COMP%] .dr-file-upload-item__filename[_ngcontent-%COMP%]{font-size:12px;line-height:16px;font-weight:400}.dr-file-upload-item--compact.dr-file-upload-item--removable[_nghost-%COMP%]{padding:4px 8px}.dr-file-upload-item__icon[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:linear-gradient(90deg,#4646ce1a 0% 100%),#fff;border-radius:4px;flex-shrink:0}.dr-file-upload-item__icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%]{font-size:24px;color:#4646ce}.dr-file-upload-item__content[_ngcontent-%COMP%]{display:flex;flex-direction:column;flex:1;min-width:0;gap:4px}.dr-file-upload-item__header[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:space-between;gap:16px}.dr-file-upload-item__filename[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dr-file-upload-item__progress[_ngcontent-%COMP%]{width:100%}.dr-file-upload-item__progress[_ngcontent-%COMP%] dr-progress-bar[_ngcontent-%COMP%]{gap:8px}.dr-file-upload-item__status[_ngcontent-%COMP%]{font-size:12px;line-height:16px;font-weight:400;color:#aeabac;min-height:26px}.dr-file-upload-item__actions[_ngcontent-%COMP%]{display:flex;align-items:center;gap:4px;flex-shrink:0}.dr-file-upload-item__success-container[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;border-radius:50%;width:16px;height:16px;background-color:#037c5a}.dr-file-upload-item__success-icon[_ngcontent-%COMP%]{font-size:16px;color:#fff}.dr-file-upload-item__remove-btn[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;border-radius:2px}.dr-file-upload-item__remove-btn[_ngcontent-%COMP%]:focus{outline:2px solid #4646ce;outline-offset:2px}.dr-file-upload-item__remove-btn[_ngcontent-%COMP%]:focus:not(:focus-visible){outline:none}.dr-file-upload-item__remove-btn[_ngcontent-%COMP%]:focus-visible{outline:2px solid #4646ce;outline-offset:2px}.dr-file-upload-item__remove-icon[_ngcontent-%COMP%]{font-size:24px;color:#6d6e6f;cursor:pointer;transition:color .2s ease-in-out}.dr-file-upload-item__remove-icon[_ngcontent-%COMP%]:hover{color:#333}.dr-file-upload-item--success[_nghost-%COMP%] .dr-file-upload-item__status[_ngcontent-%COMP%]{color:#037c5a}.dr-file-upload-item--error[_nghost-%COMP%] .dr-file-upload-item__status[_ngcontent-%COMP%]{color:#bf1d30}"], changeDetection: 0 }); }
|
|
19481
19512
|
}
|
|
19482
19513
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrFileUploadItemComponent, [{
|
|
19483
19514
|
type: Component,
|
|
@@ -19489,7 +19520,8 @@ class DrFileUploadItemComponent {
|
|
|
19489
19520
|
'[class.dr-file-upload-item--error]': 'item?.status === "error"',
|
|
19490
19521
|
'[class.dr-file-upload-item--uploading]': 'item?.status === "uploading"',
|
|
19491
19522
|
'[class.dr-file-upload-item--idle]': 'item?.status === "idle"',
|
|
19492
|
-
|
|
19523
|
+
'[class.dr-file-upload-item--removable]': 'withRemoveButton',
|
|
19524
|
+
}, template: "<div class=\"dr-file-upload-item__icon\" aria-hidden=\"true\">\n <i class=\"dr-icon-attachment\"></i>\n</div>\n\n<div class=\"dr-file-upload-item__content\">\n <div class=\"dr-file-upload-item__header\">\n <span class=\"dr-file-upload-item__filename\">\n <dr-text-overflow>\n {{ item.file.name }}\n </dr-text-overflow>\n </span>\n </div>\n\n <ng-container *ngIf=\"item.status !== 'idle'\">\n <div\n class=\"dr-file-upload-item__progress\"\n *ngIf=\"item.status === 'uploading' || item.status === 'pending'\"\n [attr.aria-label]=\"'Uploading ' + item.file.name + ': ' + item.progress + '% complete'\">\n <dr-progress-bar [progress]=\"item.progress\" [showValue]=\"false\"></dr-progress-bar>\n </div>\n\n <div\n class=\"dr-file-upload-item__progress\"\n *ngIf=\"item.status === 'success'\"\n [attr.aria-label]=\"item.file.name + ' upload complete'\">\n <dr-progress-bar [progress]=\"100\" [showValue]=\"false\">\n <div class=\"dr-file-upload-item__success-container\" *ngIf=\"!compact\">\n <i\n *ngIf=\"item.status === 'success'\"\n class=\"dr-file-upload-item__success-icon dr-icon-approve\"\n aria-hidden=\"true\">\n </i>\n </div>\n </dr-progress-bar>\n </div>\n\n <div\n class=\"dr-file-upload-item__status\"\n *ngIf=\"statusText && !compact\"\n [attr.aria-live]=\"item.status === 'error' ? 'assertive' : 'polite'\"\n [attr.role]=\"item.status === 'error' ? 'alert' : null\">\n {{ statusText }}\n </div>\n </ng-container>\n</div>\n\n<div class=\"dr-file-upload-item__actions\" *ngIf=\"withActions\">\n <button\n type=\"button\"\n class=\"dr-file-upload-item__remove-btn\"\n [attr.aria-label]=\"'Remove file ' + item.file.name\"\n (click)=\"onRemoveClick()\">\n <i class=\"dr-file-upload-item__remove-icon dr-icon-exit\" aria-hidden=\"true\"></i>\n </button>\n</div>\n", styles: [":host{display:flex;align-items:center;gap:8px;padding:4px 24px 4px 16px;background:#fff;border:1px solid #dfe0e3;border-radius:6px;min-height:40px;width:100%}:host.dr-file-upload-item--compact{padding:4px 16px 4px 8px;width:200px}:host.dr-file-upload-item--compact .dr-file-upload-item__icon{width:24px;height:24px}:host.dr-file-upload-item--compact .dr-file-upload-item__filename{font-size:12px;line-height:16px;font-weight:400}:host.dr-file-upload-item--compact.dr-file-upload-item--removable{padding:4px 8px}.dr-file-upload-item__icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:linear-gradient(90deg,#4646ce1a 0% 100%),#fff;border-radius:4px;flex-shrink:0}.dr-file-upload-item__icon i{font-size:24px;color:#4646ce}.dr-file-upload-item__content{display:flex;flex-direction:column;flex:1;min-width:0;gap:4px}.dr-file-upload-item__header{display:flex;align-items:center;justify-content:space-between;gap:16px}.dr-file-upload-item__filename{font-size:14px;line-height:24px;font-weight:400;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dr-file-upload-item__progress{width:100%}.dr-file-upload-item__progress dr-progress-bar{gap:8px}.dr-file-upload-item__status{font-size:12px;line-height:16px;font-weight:400;color:#aeabac;min-height:26px}.dr-file-upload-item__actions{display:flex;align-items:center;gap:4px;flex-shrink:0}.dr-file-upload-item__success-container{display:flex;align-items:center;justify-content:center;border-radius:50%;width:16px;height:16px;background-color:#037c5a}.dr-file-upload-item__success-icon{font-size:16px;color:#fff}.dr-file-upload-item__remove-btn{display:flex;align-items:center;justify-content:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;border-radius:2px}.dr-file-upload-item__remove-btn:focus{outline:2px solid #4646ce;outline-offset:2px}.dr-file-upload-item__remove-btn:focus:not(:focus-visible){outline:none}.dr-file-upload-item__remove-btn:focus-visible{outline:2px solid #4646ce;outline-offset:2px}.dr-file-upload-item__remove-icon{font-size:24px;color:#6d6e6f;cursor:pointer;transition:color .2s ease-in-out}.dr-file-upload-item__remove-icon:hover{color:#333}:host(.dr-file-upload-item--success) .dr-file-upload-item__status{color:#037c5a}:host(.dr-file-upload-item--error) .dr-file-upload-item__status{color:#bf1d30}\n"] }]
|
|
19493
19525
|
}], null, { item: [{
|
|
19494
19526
|
type: Input,
|
|
19495
19527
|
args: [{ required: true }]
|