@morozeckiy/dd-lib 0.1.11 → 0.1.13
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/esm2022/lib/core/index.mjs +5 -2
- package/esm2022/lib/core/toast/toast-base/toast-base.component.mjs +48 -0
- package/esm2022/lib/core/toast/toast-placeholder/toast-placeholder.component.mjs +29 -0
- package/esm2022/lib/core/toast/toast.service.mjs +124 -0
- package/esm2022/lib/lib-skeleton/lib-skeleton.component.mjs +1 -1
- package/esm2022/public-api.mjs +1 -4
- package/fesm2022/morozeckiy-dd-lib.mjs +191 -191
- package/fesm2022/morozeckiy-dd-lib.mjs.map +1 -1
- package/lib/core/index.d.ts +4 -0
- package/lib/lib-skeleton/lib-skeleton.component.d.ts +2 -2
- package/{morozeckiy-dd-lib-0.1.11.tgz → morozeckiy-dd-lib-0.1.13.tgz} +0 -0
- package/package.json +1 -1
- package/public-api.d.ts +0 -3
- package/assets/svg-icons/build/my-icons.model.ts +0 -146
- package/assets/svg-icons/build/svgIcon-404.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-actogone-accept.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-all.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-appgalery.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-appstore.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-arrow-down-red.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-arrow-up-green.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-award.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-back-arrow.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-badges.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-bell.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-benefactors.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-burger.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-button-ok.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-button-tg.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-button-vk.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-calendar.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-chart-bar.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-check-green.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-check-list.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-check-white.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-checkbox.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-cheese-king.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-circle-dot.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-circle-no.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-circles.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-clear.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-close.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-crane.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-danger-t.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-dd-m.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-dd.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-districts.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-dobrodel.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-down-chevron.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-eds-m.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-eds.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-entry.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-error-hint.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-esia-icon.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-eye-off.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-eye.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-google-app.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-grid-dots.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-grid.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-health-m.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-health.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-info-circle.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-info-t.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-info.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-is-esia.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-left-chevron.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-list-search.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-logo.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-logout.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-mail-exclamation.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-minus.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-mobilr-qr.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-moneybag.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-moon.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-my-m.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-my.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-news-big.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-news.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-next.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-not-found.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-paperclip.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-pen-edit.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-pgu-mo-m.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-pgu-mo.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-plug-d.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-plug.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-plus.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-prev.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-question-white-g.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-question.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-red-close.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-right-chevron.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-rupor.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-rustore.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-search.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-send.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-set-avatar.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-shared-logo-d.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-shared-logo.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-small-round-loader.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-solve-problem-exampe.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-sort.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-star.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-steam.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-success-t.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-sun.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-tg.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-trash.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-trees.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-trophy.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-user-empty.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-user.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-users.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-vk.icon.ts +0 -8
- package/assets/svg-icons/build/svgIcon-warning-t.icon.ts +0 -8
- package/assets/svg-icons/index.ts +0 -147
- package/esm2022/lib/toast/toast-base/toast-base.component.mjs +0 -48
- package/esm2022/lib/toast/toast-placeholder/toast-placeholder.component.mjs +0 -29
- package/esm2022/lib/toast/toast.service.mjs +0 -124
- /package/lib/{toast → core/toast}/toast-base/toast-base.component.d.ts +0 -0
- /package/lib/{toast → core/toast}/toast-placeholder/toast-placeholder.component.d.ts +0 -0
- /package/lib/{toast → core/toast}/toast.service.d.ts +0 -0
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Component, Input, ViewChild, Output, forwardRef, ChangeDetectionStrategy, CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, Injectable, Inject, Pipe, Directive, HostListener, InjectionToken, TemplateRef, Injector, Optional, Host, SkipSelf
|
|
2
|
+
import { EventEmitter, Component, Input, ViewChild, Output, forwardRef, ChangeDetectionStrategy, CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, Injectable, Inject, Pipe, Directive, HostListener, InjectionToken, TemplateRef, Injector, ViewContainerRef, Optional, Host, SkipSelf } from '@angular/core';
|
|
3
3
|
import * as i1$5 from '@angular/forms';
|
|
4
4
|
import { NG_VALUE_ACCESSOR, FormsModule, Validators, ReactiveFormsModule } from '@angular/forms';
|
|
5
5
|
import * as i1 from '@angular/common';
|
|
6
|
-
import { CommonModule, DecimalPipe, DOCUMENT, NgOptimizedImage, NgTemplateOutlet
|
|
6
|
+
import { CommonModule, DecimalPipe, NgStyle, DOCUMENT, NgOptimizedImage, NgTemplateOutlet } from '@angular/common';
|
|
7
7
|
import { BehaviorSubject, Subject, of, fromEvent, combineLatest } from 'rxjs';
|
|
8
8
|
import { format, parse } from 'date-fns';
|
|
9
9
|
import * as i1$2 from '@angular/common/http';
|
|
@@ -1360,6 +1360,194 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
|
|
|
1360
1360
|
args: ['blur']
|
|
1361
1361
|
}] } });
|
|
1362
1362
|
|
|
1363
|
+
const TOAST_DATA = new InjectionToken('ToastData');
|
|
1364
|
+
class ToastBaseComponent {
|
|
1365
|
+
get id() {
|
|
1366
|
+
return this.data.id;
|
|
1367
|
+
}
|
|
1368
|
+
constructor(toastService, ddToastData) {
|
|
1369
|
+
this.toastService = toastService;
|
|
1370
|
+
this.ddToastData = ddToastData;
|
|
1371
|
+
this.callEvent = new EventEmitter();
|
|
1372
|
+
this.maxWidth = '350px';
|
|
1373
|
+
this.data = { ...this.ddToastData };
|
|
1374
|
+
if (this.data.maxWidth) {
|
|
1375
|
+
this.maxWidth = this.data.maxWidth;
|
|
1376
|
+
}
|
|
1377
|
+
this.top = window.scrollY + 'px';
|
|
1378
|
+
}
|
|
1379
|
+
scroll() {
|
|
1380
|
+
this.top = window.scrollY + 'px';
|
|
1381
|
+
}
|
|
1382
|
+
destroy() {
|
|
1383
|
+
this.toastService.destroyToast(this.id);
|
|
1384
|
+
}
|
|
1385
|
+
onClickDesc($event) {
|
|
1386
|
+
if ($event.target.tagName === 'A') {
|
|
1387
|
+
this.callEvent.emit();
|
|
1388
|
+
}
|
|
1389
|
+
}
|
|
1390
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastBaseComponent, deps: [{ token: ToastService }, { token: TOAST_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1391
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: ToastBaseComponent, isStandalone: true, selector: "dd-toast-base", outputs: { callEvent: "callEvent" }, host: { listeners: { "window:scroll": "scroll()" } }, ngImport: i0, template: "<div (click)=\"destroy()\" class=\"toast-wrapper {{ data.type }}\">\n <dd-lib-svg-icon [icon]=\"data.type\"></dd-lib-svg-icon>\n <div>\n <div>{{ data.title }}</div>\n <div>{{ data.description }}</div>\n </div>\n</div>\n", styles: [":host{display:block}.toast-wrapper{display:flex;margin:40px 40px 0 0;align-items:center;padding:20px;background:#eefaf3;border-radius:12px;opacity:1;max-width:350px;animation:fade 1s linear;width:100%}.toast-wrapper.success{background-color:var(--light-green-color)}.toast-wrapper.info{background-color:var(--light-blue-color)}.toast-wrapper.warning{background-color:var(--yellow-card)}.toast-wrapper.danger{background-color:var(--red-light-color)}@keyframes fade{0%{opacity:0}50%{opacity:.5}to{opacity:1}}\n"], dependencies: [{ kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1392
|
+
}
|
|
1393
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastBaseComponent, decorators: [{
|
|
1394
|
+
type: Component,
|
|
1395
|
+
args: [{ selector: 'dd-toast-base', standalone: true, imports: [NgStyle, LibSvgIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div (click)=\"destroy()\" class=\"toast-wrapper {{ data.type }}\">\n <dd-lib-svg-icon [icon]=\"data.type\"></dd-lib-svg-icon>\n <div>\n <div>{{ data.title }}</div>\n <div>{{ data.description }}</div>\n </div>\n</div>\n", styles: [":host{display:block}.toast-wrapper{display:flex;margin:40px 40px 0 0;align-items:center;padding:20px;background:#eefaf3;border-radius:12px;opacity:1;max-width:350px;animation:fade 1s linear;width:100%}.toast-wrapper.success{background-color:var(--light-green-color)}.toast-wrapper.info{background-color:var(--light-blue-color)}.toast-wrapper.warning{background-color:var(--yellow-card)}.toast-wrapper.danger{background-color:var(--red-light-color)}@keyframes fade{0%{opacity:0}50%{opacity:.5}to{opacity:1}}\n"] }]
|
|
1396
|
+
}], ctorParameters: () => [{ type: ToastService }, { type: undefined, decorators: [{
|
|
1397
|
+
type: Inject,
|
|
1398
|
+
args: [TOAST_DATA]
|
|
1399
|
+
}] }], propDecorators: { callEvent: [{
|
|
1400
|
+
type: Output
|
|
1401
|
+
}], scroll: [{
|
|
1402
|
+
type: HostListener,
|
|
1403
|
+
args: ['window:scroll']
|
|
1404
|
+
}] } });
|
|
1405
|
+
|
|
1406
|
+
var ToastType;
|
|
1407
|
+
(function (ToastType) {
|
|
1408
|
+
ToastType["Warning"] = "warning_t";
|
|
1409
|
+
ToastType["Success"] = "success_t";
|
|
1410
|
+
ToastType["Info"] = "info_t";
|
|
1411
|
+
ToastType["Danger"] = "danger_t";
|
|
1412
|
+
})(ToastType || (ToastType = {}));
|
|
1413
|
+
class ToastConfig {
|
|
1414
|
+
constructor(config) {
|
|
1415
|
+
this.timeOut = 5000;
|
|
1416
|
+
if (config) {
|
|
1417
|
+
Object.keys(config).forEach(key => (this[key] = config[key]));
|
|
1418
|
+
}
|
|
1419
|
+
}
|
|
1420
|
+
}
|
|
1421
|
+
class ToastService {
|
|
1422
|
+
constructor(overlay) {
|
|
1423
|
+
this.overlay = overlay;
|
|
1424
|
+
this.config = new ToastConfig();
|
|
1425
|
+
this.counter = 0;
|
|
1426
|
+
this.ddToastData = { type: ToastType.Success, id: this.counter };
|
|
1427
|
+
this.overlayRefs = {};
|
|
1428
|
+
}
|
|
1429
|
+
warning(title, description) {
|
|
1430
|
+
this.createToast(title, description, ToastType.Warning);
|
|
1431
|
+
}
|
|
1432
|
+
success(title, description) {
|
|
1433
|
+
this.createToast(title, description, ToastType.Success);
|
|
1434
|
+
}
|
|
1435
|
+
danger(title, description) {
|
|
1436
|
+
this.createToast(title, description, ToastType.Danger);
|
|
1437
|
+
}
|
|
1438
|
+
info(title, description) {
|
|
1439
|
+
this.createToast(title, description, ToastType.Info);
|
|
1440
|
+
}
|
|
1441
|
+
registerViewContainerRef(vcRef) {
|
|
1442
|
+
this.viewContainer = vcRef;
|
|
1443
|
+
}
|
|
1444
|
+
registerInjector(injector) {
|
|
1445
|
+
this.injector = injector;
|
|
1446
|
+
}
|
|
1447
|
+
destroyToast(id) {
|
|
1448
|
+
if (this.overlayRefs?.[id].hasAttached() === true) {
|
|
1449
|
+
this.overlayRefs?.[id].detach();
|
|
1450
|
+
}
|
|
1451
|
+
}
|
|
1452
|
+
createToast(title, description, type) {
|
|
1453
|
+
const positionStrategy = this.getPositionStrategy();
|
|
1454
|
+
// this.overlayRef = this.overlay.create({ positionStrategy });
|
|
1455
|
+
this.overlayRefs[this.counter] = this.overlay.create({ positionStrategy });
|
|
1456
|
+
this.ddToastData.title = title;
|
|
1457
|
+
this.ddToastData.description = description;
|
|
1458
|
+
this.ddToastData.type = type;
|
|
1459
|
+
this.ddToastData.id = this.counter;
|
|
1460
|
+
const injector = Injector.create({
|
|
1461
|
+
providers: [
|
|
1462
|
+
{
|
|
1463
|
+
provide: TOAST_DATA,
|
|
1464
|
+
useValue: this.ddToastData,
|
|
1465
|
+
},
|
|
1466
|
+
],
|
|
1467
|
+
parent: this.injector,
|
|
1468
|
+
});
|
|
1469
|
+
const component = new ComponentPortal(ToastBaseComponent, this.viewContainer, injector);
|
|
1470
|
+
console.log(component);
|
|
1471
|
+
// this.overlayRef.attach(component);
|
|
1472
|
+
this.overlayRefs[this.counter].attach(component);
|
|
1473
|
+
setTimeout(() => {
|
|
1474
|
+
for (const id in this.overlayRefs) {
|
|
1475
|
+
if (this.overlayRefs[id]?.hasAttached()) {
|
|
1476
|
+
this.overlayRefs[id]?.detach();
|
|
1477
|
+
}
|
|
1478
|
+
}
|
|
1479
|
+
// if (this.overlayRef?.hasAttached() === true) {
|
|
1480
|
+
// this.overlayRef?.detach();
|
|
1481
|
+
// }
|
|
1482
|
+
}, this.config.timeOut);
|
|
1483
|
+
this.counter++;
|
|
1484
|
+
}
|
|
1485
|
+
getPositionStrategy() {
|
|
1486
|
+
let element;
|
|
1487
|
+
let positions;
|
|
1488
|
+
const haveToast = document.getElementsByClassName('cdk-overlay-pane');
|
|
1489
|
+
if (haveToast.length) {
|
|
1490
|
+
element = haveToast[haveToast.length - 1];
|
|
1491
|
+
positions = [
|
|
1492
|
+
{
|
|
1493
|
+
originX: 'start',
|
|
1494
|
+
originY: 'bottom',
|
|
1495
|
+
overlayX: 'start',
|
|
1496
|
+
overlayY: 'top',
|
|
1497
|
+
panelClass: 'toast-top',
|
|
1498
|
+
},
|
|
1499
|
+
];
|
|
1500
|
+
}
|
|
1501
|
+
else {
|
|
1502
|
+
element = document.getElementsByTagName('body')[0];
|
|
1503
|
+
positions = [
|
|
1504
|
+
{
|
|
1505
|
+
originX: 'end',
|
|
1506
|
+
originY: 'top',
|
|
1507
|
+
overlayX: 'end',
|
|
1508
|
+
overlayY: 'top',
|
|
1509
|
+
panelClass: '',
|
|
1510
|
+
},
|
|
1511
|
+
];
|
|
1512
|
+
}
|
|
1513
|
+
return this.overlay.position().flexibleConnectedTo(element).withPositions(positions);
|
|
1514
|
+
}
|
|
1515
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastService, deps: [{ token: i1$4.Overlay }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1516
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastService, providedIn: 'root' }); }
|
|
1517
|
+
}
|
|
1518
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastService, decorators: [{
|
|
1519
|
+
type: Injectable,
|
|
1520
|
+
args: [{
|
|
1521
|
+
providedIn: 'root',
|
|
1522
|
+
}]
|
|
1523
|
+
}], ctorParameters: () => [{ type: i1$4.Overlay }] });
|
|
1524
|
+
|
|
1525
|
+
class ToastPlaceholderComponent {
|
|
1526
|
+
constructor(toastService, injector) {
|
|
1527
|
+
this.toastService = toastService;
|
|
1528
|
+
this.injector = injector;
|
|
1529
|
+
}
|
|
1530
|
+
ngOnInit() {
|
|
1531
|
+
this.toastService.registerViewContainerRef(this.viewContainerRef);
|
|
1532
|
+
this.toastService.registerInjector(this.injector);
|
|
1533
|
+
}
|
|
1534
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastPlaceholderComponent, deps: [{ token: ToastService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1535
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: ToastPlaceholderComponent, isStandalone: true, selector: "dd-toast-placeholder", viewQueries: [{ propertyName: "viewContainerRef", first: true, predicate: ["toastPlaceholder"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: ` <div #toastPlaceholder></div>
|
|
1536
|
+
<div id="toast-overlay"></div>`, isInline: true }); }
|
|
1537
|
+
}
|
|
1538
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastPlaceholderComponent, decorators: [{
|
|
1539
|
+
type: Component,
|
|
1540
|
+
args: [{
|
|
1541
|
+
selector: 'dd-toast-placeholder',
|
|
1542
|
+
standalone: true,
|
|
1543
|
+
template: ` <div #toastPlaceholder></div>
|
|
1544
|
+
<div id="toast-overlay"></div>`,
|
|
1545
|
+
}]
|
|
1546
|
+
}], ctorParameters: () => [{ type: ToastService }, { type: i0.Injector }], propDecorators: { viewContainerRef: [{
|
|
1547
|
+
type: ViewChild,
|
|
1548
|
+
args: ['toastPlaceholder', { read: ViewContainerRef, static: true }]
|
|
1549
|
+
}] } });
|
|
1550
|
+
|
|
1363
1551
|
class DDDialogRef {
|
|
1364
1552
|
constructor(overlayRef) {
|
|
1365
1553
|
this.overlayRef = overlayRef;
|
|
@@ -2822,194 +3010,6 @@ function DisableAfterNCall(limit = 5) {
|
|
|
2822
3010
|
};
|
|
2823
3011
|
}
|
|
2824
3012
|
|
|
2825
|
-
const TOAST_DATA = new InjectionToken('ToastData');
|
|
2826
|
-
class ToastBaseComponent {
|
|
2827
|
-
get id() {
|
|
2828
|
-
return this.data.id;
|
|
2829
|
-
}
|
|
2830
|
-
constructor(toastService, ddToastData) {
|
|
2831
|
-
this.toastService = toastService;
|
|
2832
|
-
this.ddToastData = ddToastData;
|
|
2833
|
-
this.callEvent = new EventEmitter();
|
|
2834
|
-
this.maxWidth = '350px';
|
|
2835
|
-
this.data = { ...this.ddToastData };
|
|
2836
|
-
if (this.data.maxWidth) {
|
|
2837
|
-
this.maxWidth = this.data.maxWidth;
|
|
2838
|
-
}
|
|
2839
|
-
this.top = window.scrollY + 'px';
|
|
2840
|
-
}
|
|
2841
|
-
scroll() {
|
|
2842
|
-
this.top = window.scrollY + 'px';
|
|
2843
|
-
}
|
|
2844
|
-
destroy() {
|
|
2845
|
-
this.toastService.destroyToast(this.id);
|
|
2846
|
-
}
|
|
2847
|
-
onClickDesc($event) {
|
|
2848
|
-
if ($event.target.tagName === 'A') {
|
|
2849
|
-
this.callEvent.emit();
|
|
2850
|
-
}
|
|
2851
|
-
}
|
|
2852
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastBaseComponent, deps: [{ token: ToastService }, { token: TOAST_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2853
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: ToastBaseComponent, isStandalone: true, selector: "dd-toast-base", outputs: { callEvent: "callEvent" }, host: { listeners: { "window:scroll": "scroll()" } }, ngImport: i0, template: "<div (click)=\"destroy()\" class=\"toast-wrapper {{ data.type }}\">\n <dd-lib-svg-icon [icon]=\"data.type\"></dd-lib-svg-icon>\n <div>\n <div>{{ data.title }}</div>\n <div>{{ data.description }}</div>\n </div>\n</div>\n", styles: [":host{display:block}.toast-wrapper{display:flex;margin:40px 40px 0 0;align-items:center;padding:20px;background:#eefaf3;border-radius:12px;opacity:1;max-width:350px;animation:fade 1s linear;width:100%}.toast-wrapper.success{background-color:var(--light-green-color)}.toast-wrapper.info{background-color:var(--light-blue-color)}.toast-wrapper.warning{background-color:var(--yellow-card)}.toast-wrapper.danger{background-color:var(--red-light-color)}@keyframes fade{0%{opacity:0}50%{opacity:.5}to{opacity:1}}\n"], dependencies: [{ kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2854
|
-
}
|
|
2855
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastBaseComponent, decorators: [{
|
|
2856
|
-
type: Component,
|
|
2857
|
-
args: [{ selector: 'dd-toast-base', standalone: true, imports: [NgOptimizedImage, NgStyle, LibSvgIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div (click)=\"destroy()\" class=\"toast-wrapper {{ data.type }}\">\n <dd-lib-svg-icon [icon]=\"data.type\"></dd-lib-svg-icon>\n <div>\n <div>{{ data.title }}</div>\n <div>{{ data.description }}</div>\n </div>\n</div>\n", styles: [":host{display:block}.toast-wrapper{display:flex;margin:40px 40px 0 0;align-items:center;padding:20px;background:#eefaf3;border-radius:12px;opacity:1;max-width:350px;animation:fade 1s linear;width:100%}.toast-wrapper.success{background-color:var(--light-green-color)}.toast-wrapper.info{background-color:var(--light-blue-color)}.toast-wrapper.warning{background-color:var(--yellow-card)}.toast-wrapper.danger{background-color:var(--red-light-color)}@keyframes fade{0%{opacity:0}50%{opacity:.5}to{opacity:1}}\n"] }]
|
|
2858
|
-
}], ctorParameters: () => [{ type: ToastService }, { type: undefined, decorators: [{
|
|
2859
|
-
type: Inject,
|
|
2860
|
-
args: [TOAST_DATA]
|
|
2861
|
-
}] }], propDecorators: { callEvent: [{
|
|
2862
|
-
type: Output
|
|
2863
|
-
}], scroll: [{
|
|
2864
|
-
type: HostListener,
|
|
2865
|
-
args: ['window:scroll']
|
|
2866
|
-
}] } });
|
|
2867
|
-
|
|
2868
|
-
var ToastType;
|
|
2869
|
-
(function (ToastType) {
|
|
2870
|
-
ToastType["Warning"] = "warning_t";
|
|
2871
|
-
ToastType["Success"] = "success_t";
|
|
2872
|
-
ToastType["Info"] = "info_t";
|
|
2873
|
-
ToastType["Danger"] = "danger_t";
|
|
2874
|
-
})(ToastType || (ToastType = {}));
|
|
2875
|
-
class ToastConfig {
|
|
2876
|
-
constructor(config) {
|
|
2877
|
-
this.timeOut = 5000;
|
|
2878
|
-
if (config) {
|
|
2879
|
-
Object.keys(config).forEach(key => (this[key] = config[key]));
|
|
2880
|
-
}
|
|
2881
|
-
}
|
|
2882
|
-
}
|
|
2883
|
-
class ToastService {
|
|
2884
|
-
constructor(overlay) {
|
|
2885
|
-
this.overlay = overlay;
|
|
2886
|
-
this.config = new ToastConfig();
|
|
2887
|
-
this.counter = 0;
|
|
2888
|
-
this.ddToastData = { type: ToastType.Success, id: this.counter };
|
|
2889
|
-
this.overlayRefs = {};
|
|
2890
|
-
}
|
|
2891
|
-
warning(title, description) {
|
|
2892
|
-
this.createToast(title, description, ToastType.Warning);
|
|
2893
|
-
}
|
|
2894
|
-
success(title, description) {
|
|
2895
|
-
this.createToast(title, description, ToastType.Success);
|
|
2896
|
-
}
|
|
2897
|
-
danger(title, description) {
|
|
2898
|
-
this.createToast(title, description, ToastType.Danger);
|
|
2899
|
-
}
|
|
2900
|
-
info(title, description) {
|
|
2901
|
-
this.createToast(title, description, ToastType.Info);
|
|
2902
|
-
}
|
|
2903
|
-
registerViewContainerRef(vcRef) {
|
|
2904
|
-
this.viewContainer = vcRef;
|
|
2905
|
-
}
|
|
2906
|
-
registerInjector(injector) {
|
|
2907
|
-
this.injector = injector;
|
|
2908
|
-
}
|
|
2909
|
-
destroyToast(id) {
|
|
2910
|
-
if (this.overlayRefs?.[id].hasAttached() === true) {
|
|
2911
|
-
this.overlayRefs?.[id].detach();
|
|
2912
|
-
}
|
|
2913
|
-
}
|
|
2914
|
-
createToast(title, description, type) {
|
|
2915
|
-
const positionStrategy = this.getPositionStrategy();
|
|
2916
|
-
// this.overlayRef = this.overlay.create({ positionStrategy });
|
|
2917
|
-
this.overlayRefs[this.counter] = this.overlay.create({ positionStrategy });
|
|
2918
|
-
this.ddToastData.title = title;
|
|
2919
|
-
this.ddToastData.description = description;
|
|
2920
|
-
this.ddToastData.type = type;
|
|
2921
|
-
this.ddToastData.id = this.counter;
|
|
2922
|
-
const injector = Injector.create({
|
|
2923
|
-
providers: [
|
|
2924
|
-
{
|
|
2925
|
-
provide: TOAST_DATA,
|
|
2926
|
-
useValue: this.ddToastData,
|
|
2927
|
-
},
|
|
2928
|
-
],
|
|
2929
|
-
parent: this.injector,
|
|
2930
|
-
});
|
|
2931
|
-
const component = new ComponentPortal(ToastBaseComponent, this.viewContainer, injector);
|
|
2932
|
-
console.log(component);
|
|
2933
|
-
// this.overlayRef.attach(component);
|
|
2934
|
-
this.overlayRefs[this.counter].attach(component);
|
|
2935
|
-
setTimeout(() => {
|
|
2936
|
-
for (const id in this.overlayRefs) {
|
|
2937
|
-
if (this.overlayRefs[id]?.hasAttached()) {
|
|
2938
|
-
this.overlayRefs[id]?.detach();
|
|
2939
|
-
}
|
|
2940
|
-
}
|
|
2941
|
-
// if (this.overlayRef?.hasAttached() === true) {
|
|
2942
|
-
// this.overlayRef?.detach();
|
|
2943
|
-
// }
|
|
2944
|
-
}, this.config.timeOut);
|
|
2945
|
-
this.counter++;
|
|
2946
|
-
}
|
|
2947
|
-
getPositionStrategy() {
|
|
2948
|
-
let element;
|
|
2949
|
-
let positions;
|
|
2950
|
-
const haveToast = document.getElementsByClassName('cdk-overlay-pane');
|
|
2951
|
-
if (haveToast.length) {
|
|
2952
|
-
element = haveToast[haveToast.length - 1];
|
|
2953
|
-
positions = [
|
|
2954
|
-
{
|
|
2955
|
-
originX: 'start',
|
|
2956
|
-
originY: 'bottom',
|
|
2957
|
-
overlayX: 'start',
|
|
2958
|
-
overlayY: 'top',
|
|
2959
|
-
panelClass: 'toast-top',
|
|
2960
|
-
},
|
|
2961
|
-
];
|
|
2962
|
-
}
|
|
2963
|
-
else {
|
|
2964
|
-
element = document.getElementsByTagName('body')[0];
|
|
2965
|
-
positions = [
|
|
2966
|
-
{
|
|
2967
|
-
originX: 'end',
|
|
2968
|
-
originY: 'top',
|
|
2969
|
-
overlayX: 'end',
|
|
2970
|
-
overlayY: 'top',
|
|
2971
|
-
panelClass: '',
|
|
2972
|
-
},
|
|
2973
|
-
];
|
|
2974
|
-
}
|
|
2975
|
-
return this.overlay.position().flexibleConnectedTo(element).withPositions(positions);
|
|
2976
|
-
}
|
|
2977
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastService, deps: [{ token: i1$4.Overlay }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
2978
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastService, providedIn: 'root' }); }
|
|
2979
|
-
}
|
|
2980
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastService, decorators: [{
|
|
2981
|
-
type: Injectable,
|
|
2982
|
-
args: [{
|
|
2983
|
-
providedIn: 'root',
|
|
2984
|
-
}]
|
|
2985
|
-
}], ctorParameters: () => [{ type: i1$4.Overlay }] });
|
|
2986
|
-
|
|
2987
|
-
class ToastPlaceholderComponent {
|
|
2988
|
-
constructor(toastService, injector) {
|
|
2989
|
-
this.toastService = toastService;
|
|
2990
|
-
this.injector = injector;
|
|
2991
|
-
}
|
|
2992
|
-
ngOnInit() {
|
|
2993
|
-
this.toastService.registerViewContainerRef(this.viewContainerRef);
|
|
2994
|
-
this.toastService.registerInjector(this.injector);
|
|
2995
|
-
}
|
|
2996
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastPlaceholderComponent, deps: [{ token: ToastService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2997
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: ToastPlaceholderComponent, isStandalone: true, selector: "dd-toast-placeholder", viewQueries: [{ propertyName: "viewContainerRef", first: true, predicate: ["toastPlaceholder"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: ` <div #toastPlaceholder></div>
|
|
2998
|
-
<div id="toast-overlay"></div>`, isInline: true }); }
|
|
2999
|
-
}
|
|
3000
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToastPlaceholderComponent, decorators: [{
|
|
3001
|
-
type: Component,
|
|
3002
|
-
args: [{
|
|
3003
|
-
selector: 'dd-toast-placeholder',
|
|
3004
|
-
standalone: true,
|
|
3005
|
-
template: ` <div #toastPlaceholder></div>
|
|
3006
|
-
<div id="toast-overlay"></div>`,
|
|
3007
|
-
}]
|
|
3008
|
-
}], ctorParameters: () => [{ type: ToastService }, { type: i0.Injector }], propDecorators: { viewContainerRef: [{
|
|
3009
|
-
type: ViewChild,
|
|
3010
|
-
args: ['toastPlaceholder', { read: ViewContainerRef, static: true }]
|
|
3011
|
-
}] } });
|
|
3012
|
-
|
|
3013
3013
|
/*
|
|
3014
3014
|
* Public API Surface of dd-lib
|
|
3015
3015
|
*/
|
|
@@ -3019,5 +3019,5 @@ const t = true;
|
|
|
3019
3019
|
* Generated bundle index. Do not edit.
|
|
3020
3020
|
*/
|
|
3021
3021
|
|
|
3022
|
-
export { AutoHeightDirective, ClickOutsideDirective, CounterDirective, DEFAULT_FORMAT, DateService, Debounce, DeclensionDirective, DestroyService, DialogService, DisableAfterNCall, Disabled, FetcherService, FilterByKeyPipe, FilterPipe, FilterTabsPipe, HighlightPipe, ITab, InterceptorsService, LibAccordionComponent, LibBackButtonComponent, LibButtonComponent, LibCalendarComponent, LibCardComponent, LibCheckboxComponent, LibCommentInputComponent, LibCommonButtonComponent, LibCommonInputTextComponent, LibFileUploadComponent, LibFilterButtonComponent, LibImageLoaderComponent, LibInputComponent, LibLoaderComponent, LibPeriodComponent, LibRadioComponent, LibSearchInputComponent, LibSelectComponent, LibSkeletonComponent, LibSortComponent, LibStepComponent, LibSvgComponent, LibSvgIconComponent, LibTabsFragmentComponent, LibTextareaComponent, ResizeTextareaDirective, ReversePipe, SafePipe, SvgIconsService, TOAST_DATA, TOOLTIP_DATA, ThemeConfigurator, ThemeConstructorService, Throttle, ToastBaseComponent, ToastConfig, ToastPlaceholderComponent, ToastService, ToastType, TooltipComponent, TooltipDirective, ValidatorsService, t };
|
|
3022
|
+
export { AutoHeightDirective, ClickOutsideDirective, CounterDirective, DEFAULT_FORMAT, DateService, Debounce, DeclensionDirective, DestroyService, DialogService, DisableAfterNCall, Disabled, FetcherService, FilterByKeyPipe, FilterPipe, FilterTabsPipe, HighlightPipe, ITab, InterceptorsService, LibAccordionComponent, LibBackButtonComponent, LibButtonComponent, LibCalendarComponent, LibCardComponent, LibCheckboxComponent, LibCommentInputComponent, LibCommonButtonComponent, LibCommonInputTextComponent, LibFileUploadComponent, LibFilterButtonComponent, LibImageLoaderComponent, LibInputComponent, LibLoaderComponent, LibPeriodComponent, LibRadioComponent, LibSearchInputComponent, LibSelectComponent, LibSkeletonComponent, LibSortComponent, LibStepComponent, LibSvgComponent, LibSvgIconComponent, LibTabsFragmentComponent, LibTextareaComponent, ResizeTextareaDirective, ReversePipe, SafePipe, SvgIconsService, TOAST_DATA, TOOLTIP_DATA, ThemeConfigurator, ThemeConstructorService, Throttle, ToastBaseComponent, ToastConfig, ToastPlaceholderComponent, ToastService, ToastType, TooltipComponent, TooltipDirective, TriangleDirective, ValidatorsService, t };
|
|
3023
3023
|
//# sourceMappingURL=morozeckiy-dd-lib.mjs.map
|