mis-crystal-design-system 2.6.3 → 2.6.6-rc
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/bundles/mis-crystal-design-system-drawer.umd.js +40 -39
- package/bundles/mis-crystal-design-system-drawer.umd.js.map +1 -1
- package/bundles/mis-crystal-design-system-drawer.umd.min.js +1 -1
- package/bundles/mis-crystal-design-system-drawer.umd.min.js.map +1 -1
- package/bundles/mis-crystal-design-system-input.umd.js +4 -6
- package/bundles/mis-crystal-design-system-input.umd.js.map +1 -1
- package/bundles/mis-crystal-design-system-input.umd.min.js +1 -1
- package/bundles/mis-crystal-design-system-input.umd.min.js.map +1 -1
- package/bundles/mis-crystal-design-system-modal.umd.js +8 -1
- package/bundles/mis-crystal-design-system-modal.umd.js.map +1 -1
- package/bundles/mis-crystal-design-system-modal.umd.min.js +1 -1
- package/bundles/mis-crystal-design-system-modal.umd.min.js.map +1 -1
- package/drawer/drawer-body/drawer-body.component.d.ts +3 -4
- package/drawer/drawer.service.d.ts +2 -1
- package/drawer/mis-crystal-design-system-drawer.metadata.json +1 -1
- package/esm2015/drawer/drawer-body/drawer-body.component.js +2 -8
- package/esm2015/drawer/drawer.service.js +10 -4
- package/esm2015/input/directives/input/input.directive.js +4 -6
- package/esm2015/input/mis-input.component.js +1 -1
- package/esm2015/modal/modal.service.js +10 -3
- package/esm2015/modal/module-wrapper/module-wrapper.component.js +1 -1
- package/fesm2015/mis-crystal-design-system-drawer.js +37 -36
- package/fesm2015/mis-crystal-design-system-drawer.js.map +1 -1
- package/fesm2015/mis-crystal-design-system-input.js +4 -6
- package/fesm2015/mis-crystal-design-system-input.js.map +1 -1
- package/fesm2015/mis-crystal-design-system-modal.js +10 -3
- package/fesm2015/mis-crystal-design-system-modal.js.map +1 -1
- package/input/mis-crystal-design-system-input.metadata.json +1 -1
- package/input/mis-input.component.scss +10 -6
- package/modal/mis-crystal-design-system-modal.metadata.json +1 -1
- package/modal/module-wrapper/module-wrapper.component.d.ts +3 -3
- package/package.json +1 -1
|
@@ -4,38 +4,6 @@
|
|
|
4
4
|
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global['mis-crystal-design-system'] = global['mis-crystal-design-system'] || {}, global['mis-crystal-design-system'].drawer = {}), global.ng.cdk.overlay, global.ng.cdk.portal, global.ng.core, global.rxjs.operators, global.ng.animations, global.rxjs, global.ng.common));
|
|
5
5
|
}(this, (function (exports, i1, portal, i0, operators, animations, rxjs, common) { 'use strict';
|
|
6
6
|
|
|
7
|
-
/** @format */
|
|
8
|
-
var DrawerRef = /** @class */ (function () {
|
|
9
|
-
function DrawerRef(overlay) {
|
|
10
|
-
this.overlay = overlay;
|
|
11
|
-
this._isExpanded = false;
|
|
12
|
-
this.afterClosed$ = new rxjs.Subject();
|
|
13
|
-
this.afterClosed = this.afterClosed$.asObservable();
|
|
14
|
-
}
|
|
15
|
-
Object.defineProperty(DrawerRef.prototype, "isExpanded", {
|
|
16
|
-
get: function () {
|
|
17
|
-
return this._isExpanded;
|
|
18
|
-
},
|
|
19
|
-
enumerable: false,
|
|
20
|
-
configurable: true
|
|
21
|
-
});
|
|
22
|
-
DrawerRef.prototype.close = function (data) {
|
|
23
|
-
this.overlay.detach();
|
|
24
|
-
this.overlay.dispose();
|
|
25
|
-
this.afterClosed$.next(data);
|
|
26
|
-
this.afterClosed$.complete();
|
|
27
|
-
};
|
|
28
|
-
DrawerRef.prototype.expand = function () {
|
|
29
|
-
this.overlay.updateSize({ width: "100%" });
|
|
30
|
-
this._isExpanded = true;
|
|
31
|
-
};
|
|
32
|
-
DrawerRef.prototype.collapse = function () {
|
|
33
|
-
this.overlay.updateSize({ width: "422px" });
|
|
34
|
-
this._isExpanded = false;
|
|
35
|
-
};
|
|
36
|
-
return DrawerRef;
|
|
37
|
-
}());
|
|
38
|
-
|
|
39
7
|
/** @format */
|
|
40
8
|
var DrawerBodyComponent = /** @class */ (function () {
|
|
41
9
|
function DrawerBodyComponent(cfr) {
|
|
@@ -47,11 +15,6 @@
|
|
|
47
15
|
DrawerBodyComponent.prototype.initComponent = function (type, injector) {
|
|
48
16
|
this.drawerPortal = new portal.ComponentPortal(type, this.place, injector);
|
|
49
17
|
};
|
|
50
|
-
DrawerBodyComponent.prototype.createInjector = function (ref, inj) {
|
|
51
|
-
var injectorTokens = new WeakMap([[DrawerRef, ref]]);
|
|
52
|
-
return new portal.PortalInjector(inj, injectorTokens);
|
|
53
|
-
// return Injector.create({ providers: [{ provide: inj, useValue: injectorTokens }] });
|
|
54
|
-
};
|
|
55
18
|
return DrawerBodyComponent;
|
|
56
19
|
}());
|
|
57
20
|
DrawerBodyComponent.decorators = [
|
|
@@ -74,6 +37,38 @@
|
|
|
74
37
|
place: [{ type: i0.ViewChild, args: ["place", { static: false, read: i0.ViewContainerRef },] }]
|
|
75
38
|
};
|
|
76
39
|
|
|
40
|
+
/** @format */
|
|
41
|
+
var DrawerRef = /** @class */ (function () {
|
|
42
|
+
function DrawerRef(overlay) {
|
|
43
|
+
this.overlay = overlay;
|
|
44
|
+
this._isExpanded = false;
|
|
45
|
+
this.afterClosed$ = new rxjs.Subject();
|
|
46
|
+
this.afterClosed = this.afterClosed$.asObservable();
|
|
47
|
+
}
|
|
48
|
+
Object.defineProperty(DrawerRef.prototype, "isExpanded", {
|
|
49
|
+
get: function () {
|
|
50
|
+
return this._isExpanded;
|
|
51
|
+
},
|
|
52
|
+
enumerable: false,
|
|
53
|
+
configurable: true
|
|
54
|
+
});
|
|
55
|
+
DrawerRef.prototype.close = function (data) {
|
|
56
|
+
this.overlay.detach();
|
|
57
|
+
this.overlay.dispose();
|
|
58
|
+
this.afterClosed$.next(data);
|
|
59
|
+
this.afterClosed$.complete();
|
|
60
|
+
};
|
|
61
|
+
DrawerRef.prototype.expand = function () {
|
|
62
|
+
this.overlay.updateSize({ width: "100%" });
|
|
63
|
+
this._isExpanded = true;
|
|
64
|
+
};
|
|
65
|
+
DrawerRef.prototype.collapse = function () {
|
|
66
|
+
this.overlay.updateSize({ width: "422px" });
|
|
67
|
+
this._isExpanded = false;
|
|
68
|
+
};
|
|
69
|
+
return DrawerRef;
|
|
70
|
+
}());
|
|
71
|
+
|
|
77
72
|
/** @format */
|
|
78
73
|
var DRAWER_DATA_VAR = new i0.InjectionToken("MISDrawerDataInjectionToken");
|
|
79
74
|
|
|
@@ -112,8 +107,14 @@
|
|
|
112
107
|
var injectorTokens = new WeakMap();
|
|
113
108
|
injectorTokens.set(DrawerRef, ref);
|
|
114
109
|
injectorTokens.set(DRAWER_DATA_VAR, data);
|
|
115
|
-
return new
|
|
116
|
-
|
|
110
|
+
// return new PortalInjector(inj, injectorTokens);
|
|
111
|
+
return i0.Injector.create({
|
|
112
|
+
parent: inj,
|
|
113
|
+
providers: [
|
|
114
|
+
{ provide: DrawerRef, useValue: ref },
|
|
115
|
+
{ provide: DRAWER_DATA_VAR, useValue: data }
|
|
116
|
+
]
|
|
117
|
+
});
|
|
117
118
|
};
|
|
118
119
|
return DrawerService;
|
|
119
120
|
}());
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mis-crystal-design-system-drawer.umd.js","sources":["../../../projects/mis-components/drawer/drawer-ref.ts","../../../projects/mis-components/drawer/drawer-body/drawer-body.component.ts","../../../projects/mis-components/drawer/drawer-constants.ts","../../../projects/mis-components/drawer/drawer.service.ts","../../../projects/mis-components/drawer/drawer.module.ts","../../../projects/mis-components/drawer/mis-crystal-design-system-drawer.ts"],"sourcesContent":["/** @format */\n\nimport { OverlayRef } from \"@angular/cdk/overlay\";\nimport { Injectable } from \"@angular/core\";\nimport { Subject } from \"rxjs\";\n\nexport class DrawerRef {\n private _isExpanded = false;\n private afterClosed$ = new Subject<any>();\n afterClosed = this.afterClosed$.asObservable();\n get isExpanded(): boolean {\n return this._isExpanded;\n }\n constructor(public overlay: OverlayRef) {}\n\n close(data?: any): void {\n this.overlay.detach();\n this.overlay.dispose();\n this.afterClosed$.next(data);\n this.afterClosed$.complete();\n }\n\n expand(): void {\n this.overlay.updateSize({ width: \"100%\" });\n this._isExpanded = true;\n }\n\n collapse(): void {\n this.overlay.updateSize({ width: \"422px\" });\n this._isExpanded = false;\n }\n}\n","/** @format */\n\nimport { trigger, transition, style, animate } from \"@angular/animations\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { Component, ComponentFactoryResolver, Injector, OnInit, ViewChild, ViewContainerRef } from \"@angular/core\";\nimport { DrawerRef } from \"../drawer-ref\";\n\n@Component({\n selector: \"mis-drawer-body\",\n templateUrl: \"./drawer-body.component.html\",\n styleUrls: [\"./drawer-body.component.scss\"],\n animations: [\n trigger(\"slideInOut\", [\n transition(\":enter\", [style({ transform: \"translateX(100%)\" }), animate(\"200ms ease-out\", style({ transform: \"translateX(0%)\" }))]),\n transition(\":leave\", [animate(\"200ms ease-out\", style({ transform: \"translateX(100%)\" }))])\n ])\n ]\n})\nexport class DrawerBodyComponent {\n drawerPortal: ComponentPortal<any>;\n constructor(private cfr: ComponentFactoryResolver) {}\n\n @ViewChild(\"place\", { static: false, read: ViewContainerRef }) place: ViewContainerRef;\n\n bindComponent(type: any, injector: PortalInjector) {\n this.initComponent(type, injector);\n }\n\n private initComponent(type: any, injector: PortalInjector) {\n this.drawerPortal = new ComponentPortal(type, this.place, injector);\n }\n\n private createInjector(ref: DrawerRef, inj: Injector): PortalInjector {\n const injectorTokens = new WeakMap([[DrawerRef, ref]]);\n return new PortalInjector(inj, injectorTokens);\n // return Injector.create({ providers: [{ provide: inj, useValue: injectorTokens }] });\n }\n}\n","/** @format */\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const DRAWER_DATA_VAR = new InjectionToken<any>(\"MISDrawerDataInjectionToken\");\n","/** @format */\n\nimport { Overlay, OverlayConfig, OverlayRef } from \"@angular/cdk/overlay\";\nimport { ComponentPortal, ComponentType, PortalInjector } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable, Injector } from \"@angular/core\";\nimport { take } from \"rxjs/operators\";\nimport { DrawerBodyComponent } from \"./drawer-body/drawer-body.component\";\nimport { DrawerRef } from \"./drawer-ref\";\nimport { DRAWER_DATA_VAR } from \"./drawer-constants\";\n\n@Injectable({\n providedIn: \"root\"\n})\nexport class DrawerService {\n drawerRef: DrawerRef;\n componentInstance: ComponentRef<any>;\n\n constructor(private overlay: Overlay, private injector: Injector) {}\n\n show<T, D>(component: ComponentType<T>, data?: D, options?: { width?: string; height?: string }): DrawerRef {\n const positionStrategy = this.overlay.position().global().top(\"0px\").right(\"0px\");\n const { width = \"422px\", height = \"100%\" } = options || {};\n const config = new OverlayConfig({\n hasBackdrop: true,\n positionStrategy,\n scrollStrategy: this.overlay.scrollStrategies.noop(),\n width: width,\n height,\n panelClass: \"mis-drawer\",\n backdropClass: \"mis-drawer-overlay\"\n });\n const overlayRef = this.overlay.create(config);\n this.drawerRef = new DrawerRef(overlayRef);\n const injector = this.createInjector(this.drawerRef, this.injector, data);\n const portal = new ComponentPortal(DrawerBodyComponent, null);\n this.componentInstance = overlayRef.attach(portal);\n this.componentInstance.instance.bindComponent(component, injector);\n overlayRef.backdropClick().pipe(take(1)).subscribe(this.hide.bind(this));\n return this.drawerRef;\n }\n\n hide(): void {\n this.drawerRef?.close();\n }\n\n private createInjector<D>(ref: DrawerRef, inj: Injector, data?: D): PortalInjector {\n const injectorTokens = new WeakMap();\n injectorTokens.set(DrawerRef, ref);\n injectorTokens.set(DRAWER_DATA_VAR, data);\n return new PortalInjector(inj, injectorTokens);\n // return Injector.create({ providers: [{ provide: inj, useValue: injectorTokens }] });\n }\n}\n","import { ModuleWithProviders, NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { DrawerService } from \"./drawer.service\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\nimport { DrawerBodyComponent } from \"./drawer-body/drawer-body.component\";\nimport { PortalModule } from \"@angular/cdk/portal\";\n\n@NgModule({\n declarations: [DrawerBodyComponent],\n imports: [CommonModule, OverlayModule, PortalModule],\n entryComponents: [DrawerBodyComponent]\n})\nexport class DrawerModule {\n static forRoot(): ModuleWithProviders<DrawerModule> {\n return {\n ngModule: DrawerModule,\n providers: [DrawerService]\n };\n }\n\n static forChild(): ModuleWithProviders<DrawerModule> {\n return {\n ngModule: DrawerModule,\n providers: [DrawerService]\n };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n\nexport {DrawerBodyComponent as ɵa} from './drawer-body/drawer-body.component';"],"names":["Subject","ComponentPortal","PortalInjector","Component","trigger","transition","style","animate","ComponentFactoryResolver","ViewChild","ViewContainerRef","InjectionToken","OverlayConfig","portal","take","Injectable","Overlay","Injector","NgModule","CommonModule","OverlayModule","PortalModule"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"mis-crystal-design-system-drawer.umd.js","sources":["../../../projects/mis-components/drawer/drawer-body/drawer-body.component.ts","../../../projects/mis-components/drawer/drawer-ref.ts","../../../projects/mis-components/drawer/drawer-constants.ts","../../../projects/mis-components/drawer/drawer.service.ts","../../../projects/mis-components/drawer/drawer.module.ts","../../../projects/mis-components/drawer/mis-crystal-design-system-drawer.ts"],"sourcesContent":["/** @format */\n\nimport { trigger, transition, style, animate } from \"@angular/animations\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { Component, ComponentFactoryResolver, Injector, OnInit, ViewChild, ViewContainerRef } from \"@angular/core\";\nimport { DrawerRef } from \"../drawer-ref\";\n\n@Component({\n selector: \"mis-drawer-body\",\n templateUrl: \"./drawer-body.component.html\",\n styleUrls: [\"./drawer-body.component.scss\"],\n animations: [\n trigger(\"slideInOut\", [\n transition(\":enter\", [style({ transform: \"translateX(100%)\" }), animate(\"200ms ease-out\", style({ transform: \"translateX(0%)\" }))]),\n transition(\":leave\", [animate(\"200ms ease-out\", style({ transform: \"translateX(100%)\" }))])\n ])\n ]\n})\nexport class DrawerBodyComponent {\n drawerPortal: ComponentPortal<any>;\n constructor(private cfr: ComponentFactoryResolver) {}\n\n @ViewChild(\"place\", { static: false, read: ViewContainerRef }) place: ViewContainerRef;\n\n bindComponent(type: any, injector: Injector) {\n this.initComponent(type, injector);\n }\n\n private initComponent(type: any, injector: Injector) {\n this.drawerPortal = new ComponentPortal(type, this.place, injector);\n }\n}\n","/** @format */\n\nimport { OverlayRef } from \"@angular/cdk/overlay\";\nimport { Injectable } from \"@angular/core\";\nimport { Subject } from \"rxjs\";\n\nexport class DrawerRef {\n private _isExpanded = false;\n private afterClosed$ = new Subject<any>();\n afterClosed = this.afterClosed$.asObservable();\n get isExpanded(): boolean {\n return this._isExpanded;\n }\n constructor(public overlay: OverlayRef) {}\n\n close(data?: any): void {\n this.overlay.detach();\n this.overlay.dispose();\n this.afterClosed$.next(data);\n this.afterClosed$.complete();\n }\n\n expand(): void {\n this.overlay.updateSize({ width: \"100%\" });\n this._isExpanded = true;\n }\n\n collapse(): void {\n this.overlay.updateSize({ width: \"422px\" });\n this._isExpanded = false;\n }\n}\n","/** @format */\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const DRAWER_DATA_VAR = new InjectionToken<any>(\"MISDrawerDataInjectionToken\");\n","/** @format */\n\nimport { Overlay, OverlayConfig } from \"@angular/cdk/overlay\";\nimport { ComponentPortal, ComponentType } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable, Injector } from \"@angular/core\";\nimport { take } from \"rxjs/operators\";\nimport { DrawerBodyComponent } from \"./drawer-body/drawer-body.component\";\nimport { DrawerRef } from \"./drawer-ref\";\nimport { DRAWER_DATA_VAR } from \"./drawer-constants\";\n\n@Injectable({\n providedIn: \"root\"\n})\nexport class DrawerService {\n drawerRef: DrawerRef;\n componentInstance: ComponentRef<DrawerBodyComponent>;\n\n constructor(private overlay: Overlay, private injector: Injector) {}\n\n show<T, D>(component: ComponentType<T>, data?: D, options?: { width?: string; height?: string }): DrawerRef {\n const positionStrategy = this.overlay.position().global().top(\"0px\").right(\"0px\");\n const { width = \"422px\", height = \"100%\" } = options || {};\n const config = new OverlayConfig({\n hasBackdrop: true,\n positionStrategy,\n scrollStrategy: this.overlay.scrollStrategies.noop(),\n width: width,\n height,\n panelClass: \"mis-drawer\",\n backdropClass: \"mis-drawer-overlay\"\n });\n const overlayRef = this.overlay.create(config);\n this.drawerRef = new DrawerRef(overlayRef);\n const injector = this.createInjector(this.drawerRef, this.injector, data);\n const portal = new ComponentPortal(DrawerBodyComponent, null);\n this.componentInstance = overlayRef.attach(portal);\n this.componentInstance.instance.bindComponent(component, injector);\n overlayRef.backdropClick().pipe(take(1)).subscribe(this.hide.bind(this));\n return this.drawerRef;\n }\n\n hide(): void {\n this.drawerRef?.close();\n }\n\n private createInjector<D>(ref: DrawerRef, inj: Injector, data?: D): Injector {\n const injectorTokens = new WeakMap();\n injectorTokens.set(DrawerRef, ref);\n injectorTokens.set(DRAWER_DATA_VAR, data);\n // return new PortalInjector(inj, injectorTokens);\n return Injector.create({\n parent: inj,\n providers: [\n { provide: DrawerRef, useValue: ref },\n { provide: DRAWER_DATA_VAR, useValue: data }\n ]\n });\n }\n}\n","import { ModuleWithProviders, NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { DrawerService } from \"./drawer.service\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\nimport { DrawerBodyComponent } from \"./drawer-body/drawer-body.component\";\nimport { PortalModule } from \"@angular/cdk/portal\";\n\n@NgModule({\n declarations: [DrawerBodyComponent],\n imports: [CommonModule, OverlayModule, PortalModule],\n entryComponents: [DrawerBodyComponent]\n})\nexport class DrawerModule {\n static forRoot(): ModuleWithProviders<DrawerModule> {\n return {\n ngModule: DrawerModule,\n providers: [DrawerService]\n };\n }\n\n static forChild(): ModuleWithProviders<DrawerModule> {\n return {\n ngModule: DrawerModule,\n providers: [DrawerService]\n };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n\nexport {DrawerBodyComponent as ɵa} from './drawer-body/drawer-body.component';"],"names":["ComponentPortal","Component","trigger","transition","style","animate","ComponentFactoryResolver","ViewChild","ViewContainerRef","Subject","InjectionToken","OverlayConfig","portal","take","Injector","Injectable","Overlay","NgModule","CommonModule","OverlayModule","PortalModule"],"mappings":";;;;;;IAAA;;QAoBE,6BAAoB,GAA6B;YAA7B,QAAG,GAAH,GAAG,CAA0B;SAAI;QAIrD,2CAAa,GAAb,UAAc,IAAS,EAAE,QAAkB;YACzC,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;SACpC;QAEO,2CAAa,GAAb,UAAc,IAAS,EAAE,QAAkB;YACjD,IAAI,CAAC,YAAY,GAAG,IAAIA,sBAAe,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;SACrE;;;;gBAvBFC,YAAS,SAAC;oBACT,QAAQ,EAAE,iBAAiB;oBAC3B,8JAA2C;oBAE3C,UAAU,EAAE;wBACVC,kBAAO,CAAC,YAAY,EAAE;4BACpBC,qBAAU,CAAC,QAAQ,EAAE,CAACC,gBAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC,EAAEC,kBAAO,CAAC,gBAAgB,EAAED,gBAAK,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC,CAAC,CAAC,CAAC;4BACnID,qBAAU,CAAC,QAAQ,EAAE,CAACE,kBAAO,CAAC,gBAAgB,EAAED,gBAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC,CAAC,CAAC,CAAC;yBAC5F,CAAC;qBACH;;iBACF;;;gBAbmBE,2BAAwB;;;wBAkBzCC,YAAS,SAAC,OAAO,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAEC,mBAAgB,EAAE;;;ICtB/D;;QAaE,mBAAmB,OAAmB;YAAnB,YAAO,GAAP,OAAO,CAAY;YAN9B,gBAAW,GAAG,KAAK,CAAC;YACpB,iBAAY,GAAG,IAAIC,YAAO,EAAO,CAAC;YAC1C,gBAAW,GAAG,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,CAAC;SAIL;QAH1C,sBAAI,iCAAU;iBAAd;gBACE,OAAO,IAAI,CAAC,WAAW,CAAC;aACzB;;;WAAA;QAGD,yBAAK,GAAL,UAAM,IAAU;YACd,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;YACtB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;YACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC7B,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,CAAC;SAC9B;QAED,0BAAM,GAAN;YACE,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC;YAC3C,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;SACzB;QAED,4BAAQ,GAAR;YACE,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC;YAC5C,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;SAC1B;wBACF;KAAA;;IC/BD;QAIa,eAAe,GAAG,IAAIC,iBAAc,CAAM,6BAA6B;;ICJpF;;QAiBE,uBAAoB,OAAgB,EAAU,QAAkB;YAA5C,YAAO,GAAP,OAAO,CAAS;YAAU,aAAQ,GAAR,QAAQ,CAAU;SAAI;QAEpE,4BAAI,GAAJ,UAAW,SAA2B,EAAE,IAAQ,EAAE,OAA6C;YAC7F,IAAM,gBAAgB,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YAC5E,IAAA,KAAuC,OAAO,IAAI,EAAE,EAAlD,aAAe,EAAf,KAAK,mBAAG,OAAO,KAAA,EAAE,cAAe,EAAf,MAAM,mBAAG,MAAM,KAAkB,CAAC;YAC3D,IAAM,MAAM,GAAG,IAAIC,gBAAa,CAAC;gBAC/B,WAAW,EAAE,IAAI;gBACjB,gBAAgB,kBAAA;gBAChB,cAAc,EAAE,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,EAAE;gBACpD,KAAK,EAAE,KAAK;gBACZ,MAAM,QAAA;gBACN,UAAU,EAAE,YAAY;gBACxB,aAAa,EAAE,oBAAoB;aACpC,CAAC,CAAC;YACH,IAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YAC/C,IAAI,CAAC,SAAS,GAAG,IAAI,SAAS,CAAC,UAAU,CAAC,CAAC;YAC3C,IAAM,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;YAC1E,IAAMC,QAAM,GAAG,IAAIZ,sBAAe,CAAC,mBAAmB,EAAE,IAAI,CAAC,CAAC;YAC9D,IAAI,CAAC,iBAAiB,GAAG,UAAU,CAAC,MAAM,CAACY,QAAM,CAAC,CAAC;YACnD,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,aAAa,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;YACnE,UAAU,CAAC,aAAa,EAAE,CAAC,IAAI,CAACC,cAAI,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YACzE,OAAO,IAAI,CAAC,SAAS,CAAC;SACvB;QAED,4BAAI,GAAJ;;YACE,MAAA,IAAI,CAAC,SAAS,0CAAE,KAAK,GAAG;SACzB;QAEO,sCAAc,GAAd,UAAkB,GAAc,EAAE,GAAa,EAAE,IAAQ;YAC/D,IAAM,cAAc,GAAG,IAAI,OAAO,EAAE,CAAC;YACrC,cAAc,CAAC,GAAG,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC;YACnC,cAAc,CAAC,GAAG,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;;YAE1C,OAAOC,WAAQ,CAAC,MAAM,CAAC;gBACrB,MAAM,EAAE,GAAG;gBACX,SAAS,EAAE;oBACT,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE;oBACrC,EAAE,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,IAAI,EAAE;iBAC7C;aACF,CAAC,CAAC;SACJ;;;;;gBA/CFC,aAAU,SAAC;oBACV,UAAU,EAAE,MAAM;iBACnB;;;gBAVQC,UAAO;gBAEmBF,WAAQ;;;;QCQ3C;;QACS,oBAAO,GAAd;YACE,OAAO;gBACL,QAAQ,EAAE,YAAY;gBACtB,SAAS,EAAE,CAAC,aAAa,CAAC;aAC3B,CAAC;SACH;QAEM,qBAAQ,GAAf;YACE,OAAO;gBACL,QAAQ,EAAE,YAAY;gBACtB,SAAS,EAAE,CAAC,aAAa,CAAC;aAC3B,CAAC;SACH;;;;gBAlBFG,WAAQ,SAAC;oBACR,YAAY,EAAE,CAAC,mBAAmB,CAAC;oBACnC,OAAO,EAAE,CAACC,mBAAY,EAAEC,gBAAa,EAAEC,mBAAY,CAAC;oBACpD,eAAe,EAAE,CAAC,mBAAmB,CAAC;iBACvC;;;ICXD;;;;;;;;;;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/cdk/overlay"),require("@angular/cdk/portal"),require("@angular/core"),require("rxjs/operators"),require("@angular/animations"),require("rxjs"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/drawer",["exports","@angular/cdk/overlay","@angular/cdk/portal","@angular/core","rxjs/operators","@angular/animations","rxjs","@angular/common"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self)["mis-crystal-design-system"]=e["mis-crystal-design-system"]||{},e["mis-crystal-design-system"].drawer={}),e.ng.cdk.overlay,e.ng.cdk.portal,e.ng.core,e.rxjs.operators,e.ng.animations,e.rxjs,e.ng.common)}(this,(function(e,t,r,o,n,a,i,s){"use strict";var l=function(){function e(e){this.
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/cdk/overlay"),require("@angular/cdk/portal"),require("@angular/core"),require("rxjs/operators"),require("@angular/animations"),require("rxjs"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/drawer",["exports","@angular/cdk/overlay","@angular/cdk/portal","@angular/core","rxjs/operators","@angular/animations","rxjs","@angular/common"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self)["mis-crystal-design-system"]=e["mis-crystal-design-system"]||{},e["mis-crystal-design-system"].drawer={}),e.ng.cdk.overlay,e.ng.cdk.portal,e.ng.core,e.rxjs.operators,e.ng.animations,e.rxjs,e.ng.common)}(this,(function(e,t,r,o,n,a,i,s){"use strict";var l=function(){function e(e){this.cfr=e}return e.prototype.bindComponent=function(e,t){this.initComponent(e,t)},e.prototype.initComponent=function(e,t){this.drawerPortal=new r.ComponentPortal(e,this.place,t)},e}();l.decorators=[{type:o.Component,args:[{selector:"mis-drawer-body",template:'\x3c!-- @format --\x3e\n\n<div class="mis-drawer-body" #place @slideInOut>\n <ng-template [cdkPortalOutlet]="drawerPortal"></ng-template>\n</div>\n',animations:[a.trigger("slideInOut",[a.transition(":enter",[a.style({transform:"translateX(100%)"}),a.animate("200ms ease-out",a.style({transform:"translateX(0%)"}))]),a.transition(":leave",[a.animate("200ms ease-out",a.style({transform:"translateX(100%)"}))])])],styles:[".mis-drawer-body{display:block;width:100%;height:100%}"]}]}],l.ctorParameters=function(){return[{type:o.ComponentFactoryResolver}]},l.propDecorators={place:[{type:o.ViewChild,args:["place",{static:!1,read:o.ViewContainerRef}]}]};var d=function(){function e(e){this.overlay=e,this._isExpanded=!1,this.afterClosed$=new i.Subject,this.afterClosed=this.afterClosed$.asObservable()}return Object.defineProperty(e.prototype,"isExpanded",{get:function(){return this._isExpanded},enumerable:!1,configurable:!0}),e.prototype.close=function(e){this.overlay.detach(),this.overlay.dispose(),this.afterClosed$.next(e),this.afterClosed$.complete()},e.prototype.expand=function(){this.overlay.updateSize({width:"100%"}),this._isExpanded=!0},e.prototype.collapse=function(){this.overlay.updateSize({width:"422px"}),this._isExpanded=!1},e}(),c=new o.InjectionToken("MISDrawerDataInjectionToken"),p=function(){function e(e,t){this.overlay=e,this.injector=t}return e.prototype.show=function(e,o,a){var i=this.overlay.position().global().top("0px").right("0px"),s=a||{},c=s.width,p=void 0===c?"422px":c,u=s.height,y=void 0===u?"100%":u,f=new t.OverlayConfig({hasBackdrop:!0,positionStrategy:i,scrollStrategy:this.overlay.scrollStrategies.noop(),width:p,height:y,panelClass:"mis-drawer",backdropClass:"mis-drawer-overlay"}),h=this.overlay.create(f);this.drawerRef=new d(h);var m=this.createInjector(this.drawerRef,this.injector,o),g=new r.ComponentPortal(l,null);return this.componentInstance=h.attach(g),this.componentInstance.instance.bindComponent(e,m),h.backdropClick().pipe(n.take(1)).subscribe(this.hide.bind(this)),this.drawerRef},e.prototype.hide=function(){var e;null===(e=this.drawerRef)||void 0===e||e.close()},e.prototype.createInjector=function(e,t,r){var n=new WeakMap;return n.set(d,e),n.set(c,r),o.Injector.create({parent:t,providers:[{provide:d,useValue:e},{provide:c,useValue:r}]})},e}();p.ɵprov=o.ɵɵdefineInjectable({factory:function(){return new p(o.ɵɵinject(t.Overlay),o.ɵɵinject(o.INJECTOR))},token:p,providedIn:"root"}),p.decorators=[{type:o.Injectable,args:[{providedIn:"root"}]}],p.ctorParameters=function(){return[{type:t.Overlay},{type:o.Injector}]};var u=function(){function e(){}return e.forRoot=function(){return{ngModule:e,providers:[p]}},e.forChild=function(){return{ngModule:e,providers:[p]}},e}();u.decorators=[{type:o.NgModule,args:[{declarations:[l],imports:[s.CommonModule,t.OverlayModule,r.PortalModule],entryComponents:[l]}]}],e.DRAWER_DATA_VAR=c,e.DrawerModule=u,e.DrawerRef=d,e.DrawerService=p,e.ɵa=l,Object.defineProperty(e,"__esModule",{value:!0})}));
|
|
2
2
|
//# sourceMappingURL=mis-crystal-design-system-drawer.umd.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../projects/mis-components/drawer/drawer-
|
|
1
|
+
{"version":3,"sources":["../../../projects/mis-components/drawer/drawer-body/drawer-body.component.ts","../../../projects/mis-components/drawer/drawer-ref.ts","../../../projects/mis-components/drawer/drawer-constants.ts","../../../projects/mis-components/drawer/drawer.service.ts","../../../projects/mis-components/drawer/drawer.module.ts"],"names":["DrawerBodyComponent","cfr","this","prototype","bindComponent","type","injector","initComponent","drawerPortal","ComponentPortal","place","Component","args","selector","template","animations","trigger","transition","style","transform","animate","ComponentFactoryResolver","ViewChild","static","read","ViewContainerRef","DrawerRef","overlay","_isExpanded","afterClosed$","Subject","afterClosed","asObservable","Object","defineProperty","close","data","detach","dispose","next","complete","expand","updateSize","width","collapse","DRAWER_DATA_VAR","InjectionToken","DrawerService","show","component","options","positionStrategy","position","global","top","right","_b","_c","_d","height","config","OverlayConfig","hasBackdrop","scrollStrategy","scrollStrategies","noop","panelClass","backdropClass","overlayRef","create","drawerRef","createInjector","portal","componentInstance","attach","instance","backdropClick","pipe","take","subscribe","hide","bind","_a","ref","inj","injectorTokens","WeakMap","set","Injector","parent","providers","provide","useValue","Injectable","providedIn","Overlay","DrawerModule","forRoot","ngModule","forChild","NgModule","declarations","imports","CommonModule","OverlayModule","PortalModule","entryComponents"],"mappings":"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","sourcesContent":["/** @format */\n\nimport { trigger, transition, style, animate } from \"@angular/animations\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { Component, ComponentFactoryResolver, Injector, OnInit, ViewChild, ViewContainerRef } from \"@angular/core\";\nimport { DrawerRef } from \"../drawer-ref\";\n\n@Component({\n selector: \"mis-drawer-body\",\n templateUrl: \"./drawer-body.component.html\",\n styleUrls: [\"./drawer-body.component.scss\"],\n animations: [\n trigger(\"slideInOut\", [\n transition(\":enter\", [style({ transform: \"translateX(100%)\" }), animate(\"200ms ease-out\", style({ transform: \"translateX(0%)\" }))]),\n transition(\":leave\", [animate(\"200ms ease-out\", style({ transform: \"translateX(100%)\" }))])\n ])\n ]\n})\nexport class DrawerBodyComponent {\n drawerPortal: ComponentPortal<any>;\n constructor(private cfr: ComponentFactoryResolver) {}\n\n @ViewChild(\"place\", { static: false, read: ViewContainerRef }) place: ViewContainerRef;\n\n bindComponent(type: any, injector: Injector) {\n this.initComponent(type, injector);\n }\n\n private initComponent(type: any, injector: Injector) {\n this.drawerPortal = new ComponentPortal(type, this.place, injector);\n }\n}\n","/** @format */\n\nimport { OverlayRef } from \"@angular/cdk/overlay\";\nimport { Injectable } from \"@angular/core\";\nimport { Subject } from \"rxjs\";\n\nexport class DrawerRef {\n private _isExpanded = false;\n private afterClosed$ = new Subject<any>();\n afterClosed = this.afterClosed$.asObservable();\n get isExpanded(): boolean {\n return this._isExpanded;\n }\n constructor(public overlay: OverlayRef) {}\n\n close(data?: any): void {\n this.overlay.detach();\n this.overlay.dispose();\n this.afterClosed$.next(data);\n this.afterClosed$.complete();\n }\n\n expand(): void {\n this.overlay.updateSize({ width: \"100%\" });\n this._isExpanded = true;\n }\n\n collapse(): void {\n this.overlay.updateSize({ width: \"422px\" });\n this._isExpanded = false;\n }\n}\n","/** @format */\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const DRAWER_DATA_VAR = new InjectionToken<any>(\"MISDrawerDataInjectionToken\");\n","/** @format */\n\nimport { Overlay, OverlayConfig } from \"@angular/cdk/overlay\";\nimport { ComponentPortal, ComponentType } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable, Injector } from \"@angular/core\";\nimport { take } from \"rxjs/operators\";\nimport { DrawerBodyComponent } from \"./drawer-body/drawer-body.component\";\nimport { DrawerRef } from \"./drawer-ref\";\nimport { DRAWER_DATA_VAR } from \"./drawer-constants\";\n\n@Injectable({\n providedIn: \"root\"\n})\nexport class DrawerService {\n drawerRef: DrawerRef;\n componentInstance: ComponentRef<DrawerBodyComponent>;\n\n constructor(private overlay: Overlay, private injector: Injector) {}\n\n show<T, D>(component: ComponentType<T>, data?: D, options?: { width?: string; height?: string }): DrawerRef {\n const positionStrategy = this.overlay.position().global().top(\"0px\").right(\"0px\");\n const { width = \"422px\", height = \"100%\" } = options || {};\n const config = new OverlayConfig({\n hasBackdrop: true,\n positionStrategy,\n scrollStrategy: this.overlay.scrollStrategies.noop(),\n width: width,\n height,\n panelClass: \"mis-drawer\",\n backdropClass: \"mis-drawer-overlay\"\n });\n const overlayRef = this.overlay.create(config);\n this.drawerRef = new DrawerRef(overlayRef);\n const injector = this.createInjector(this.drawerRef, this.injector, data);\n const portal = new ComponentPortal(DrawerBodyComponent, null);\n this.componentInstance = overlayRef.attach(portal);\n this.componentInstance.instance.bindComponent(component, injector);\n overlayRef.backdropClick().pipe(take(1)).subscribe(this.hide.bind(this));\n return this.drawerRef;\n }\n\n hide(): void {\n this.drawerRef?.close();\n }\n\n private createInjector<D>(ref: DrawerRef, inj: Injector, data?: D): Injector {\n const injectorTokens = new WeakMap();\n injectorTokens.set(DrawerRef, ref);\n injectorTokens.set(DRAWER_DATA_VAR, data);\n // return new PortalInjector(inj, injectorTokens);\n return Injector.create({\n parent: inj,\n providers: [\n { provide: DrawerRef, useValue: ref },\n { provide: DRAWER_DATA_VAR, useValue: data }\n ]\n });\n }\n}\n","import { ModuleWithProviders, NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { DrawerService } from \"./drawer.service\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\nimport { DrawerBodyComponent } from \"./drawer-body/drawer-body.component\";\nimport { PortalModule } from \"@angular/cdk/portal\";\n\n@NgModule({\n declarations: [DrawerBodyComponent],\n imports: [CommonModule, OverlayModule, PortalModule],\n entryComponents: [DrawerBodyComponent]\n})\nexport class DrawerModule {\n static forRoot(): ModuleWithProviders<DrawerModule> {\n return {\n ngModule: DrawerModule,\n providers: [DrawerService]\n };\n }\n\n static forChild(): ModuleWithProviders<DrawerModule> {\n return {\n ngModule: DrawerModule,\n providers: [DrawerService]\n };\n }\n}\n"]}
|
|
@@ -17,11 +17,9 @@
|
|
|
17
17
|
MisInputDirective.prototype.ngOnInit = function () {
|
|
18
18
|
var _this = this;
|
|
19
19
|
var _a, _b;
|
|
20
|
-
(_b = (_a = this.control) === null || _a === void 0 ? void 0 : _a.control) === null || _b === void 0 ? void 0 : _b.
|
|
21
|
-
var _a
|
|
22
|
-
|
|
23
|
-
_this.validityChange.next(!((_b = _this.control.control) === null || _b === void 0 ? void 0 : _b.invalid));
|
|
24
|
-
}
|
|
20
|
+
(_b = (_a = this.control) === null || _a === void 0 ? void 0 : _a.control) === null || _b === void 0 ? void 0 : _b.valueChanges.pipe(operators.takeUntil(this.endObs)).subscribe(function () {
|
|
21
|
+
var _a;
|
|
22
|
+
_this.validityChange.next(!((_a = _this.control.control) === null || _a === void 0 ? void 0 : _a.invalid));
|
|
25
23
|
});
|
|
26
24
|
this.el.nativeElement.placeholder += " ";
|
|
27
25
|
};
|
|
@@ -75,7 +73,7 @@
|
|
|
75
73
|
{ type: core.Component, args: [{
|
|
76
74
|
selector: "mis-input",
|
|
77
75
|
template: "<div\n [class]=\"'input-container ' + size\"\n [ngClass]=\"{\n rounded: type === 'rounded',\n floating: type === 'floating',\n 'has-error': !inputValidity || hasError,\n 'no-hint': noHints\n }\"\n>\n <div class=\"input-wrapper\">\n <ng-content select=\"[mis-input-icon]\"></ng-content>\n <div class=\"mis-input\">\n <ng-content select=\"input\"></ng-content>\n <span class=\"mis-placeholder\">{{ placeholder }}</span>\n </div>\n <ng-content select=\"[mis-input-act]\"></ng-content>\n </div>\n <ng-content select=\"[mis-input-hint]\"></ng-content>\n <ng-content select=\"[mis-input-error]\"></ng-content>\n</div>\n",
|
|
78
|
-
styles: [".input-container{position:relative;padding-bottom:24px}.input-container .input-wrapper{box-sizing:border-box;display:flex;align-items:center;flex-direction:row;flex-wrap:nowrap;transition:all 60ms ease-in;background-color:#fff;padding:3px 16px}.input-container .input-wrapper>:not(:last-child){margin-right:16px}.input-container .input-wrapper .mis-input{flex:1 1 auto;z-index:0;position:relative;display:flex;align-items:center}.input-container .input-wrapper input{flex:1 1 auto;border:none;outline:none;height:100%;padding:0;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;height:24px;color:#181f33;background-color:transparent;width:100%;vertical-align:middle}.input-container .input-wrapper input::-moz-placeholder{-moz-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input:-ms-input-placeholder{-ms-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input::placeholder{transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper .mis-placeholder{position:absolute;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;line-height:24px;color:#6a737d;z-index:-1;transition:all .15s ease-in}.input-container .input-wrapper:focus-within{background-color:#f5f5f5}.input-container .input-wrapper:focus-within{border:1px solid #0937b2}.input-container .input-wrapper [mis-input-act],.input-container .input-wrapper [mis-input-icon]{width:18px;height:18px;color:#6a737d;font-size:24px;line-height:18px}.input-container .input-wrapper [mis-input-act]{cursor:pointer}.input-container.no-hint{padding-bottom:0}.input-container.rounded.sm input{padding:
|
|
76
|
+
styles: [".input-container{position:relative;padding-bottom:24px}.input-container .input-wrapper{box-sizing:border-box;display:flex;align-items:center;flex-direction:row;flex-wrap:nowrap;transition:all 60ms ease-in;background-color:#fff;padding:3px 16px}.input-container .input-wrapper>:not(:last-child){margin-right:16px}.input-container .input-wrapper .mis-input{flex:1 1 auto;z-index:0;position:relative;display:flex;align-items:center}.input-container .input-wrapper input{flex:1 1 auto;border:none;outline:none;height:100%;padding:0;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;height:24px;color:#181f33;background-color:transparent;width:100%;vertical-align:middle}.input-container .input-wrapper input::-moz-placeholder{-moz-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input:-ms-input-placeholder{-ms-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input::placeholder{transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper .mis-placeholder{position:absolute;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;line-height:24px;color:#6a737d;z-index:-1;transition:all .15s ease-in}.input-container .input-wrapper:focus-within{background-color:#f5f5f5}.input-container .input-wrapper:focus-within{border:1px solid #0937b2}.input-container .input-wrapper [mis-input-act],.input-container .input-wrapper [mis-input-icon]{width:18px;height:18px;color:#6a737d;font-size:24px;line-height:18px}.input-container .input-wrapper [mis-input-act]{cursor:pointer}.input-container.no-hint{padding-bottom:0}.input-container.rounded{box-sizing:initial}.input-container.rounded.sm input{padding:3px 16px}.input-container.rounded.md input{padding:9px 16px}.input-container.rounded.lg input{padding:15px 16px}.input-container.rounded .input-wrapper{border-radius:4px;border:1px solid #e0e0e0;padding:0}.input-container.rounded .input-wrapper input:not(:disabled):focus,.input-container.rounded .input-wrapper input:not(:disabled):hover{background-color:#f5f5f5}.input-container.rounded .input-wrapper:focus-within{border:1px solid #0937b2}.input-container.rounded .input-wrapper input:not(:-moz-placeholder-shown)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper input:not(:-ms-input-placeholder)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper input:not(:placeholder-shown)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper .mis-placeholder{transition-duration:50ms}.input-container.rounded.has-error .input-wrapper{border:1px solid #b00020!important}.input-container.floating .input-wrapper{padding-top:24px;padding-bottom:7px;border-bottom:1px solid #e0e0e0}.input-container.floating .input-wrapper input:focus+.mis-placeholder{color:#0937b2!important}.input-container.floating .input-wrapper input:not(:-moz-placeholder-shown)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper input:not(:-ms-input-placeholder)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper input:focus+.mis-placeholder,.input-container.floating .input-wrapper input:not(:placeholder-shown)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper:focus-within{border:none;border-bottom:1px solid #0937b2}.input-container.floating .input-wrapper:focus-within input::-moz-placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating .input-wrapper:focus-within input:-ms-input-placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating .input-wrapper:focus-within input::placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating.has-error .input-wrapper{border-bottom:1px solid #b00020!important}.input-container.floating.has-error .input-wrapper .mis-placeholder{color:#b00020!important}.input-container [mis-input-error],.input-container [mis-input-hint]{position:absolute;left:0;right:0;bottom:0;line-height:24px;height:24px;font-size:12px;color:#6a737d;letter-spacing:.2px}.input-container [mis-input-error]{color:#b00020}"]
|
|
79
77
|
},] }
|
|
80
78
|
];
|
|
81
79
|
MisInputComponent.ctorParameters = function () { return []; };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mis-crystal-design-system-input.umd.js","sources":["../../../projects/mis-components/input/directives/input/input.directive.ts","../../../projects/mis-components/input/mis-input.component.ts","../../../projects/mis-components/input/mis-input.module.ts","../../../projects/mis-components/input/mis-crystal-design-system-input.ts"],"sourcesContent":["import { Directive, ElementRef, OnDestroy, OnInit, Optional, Self } from \"@angular/core\";\nimport { NgControl } from \"@angular/forms\";\nimport { ReplaySubject, Subject, Subscription } from \"rxjs\";\nimport { takeUntil } from \"rxjs/operators\";\n\n@Directive({\n // tslint:disable-next-line\n selector: \"input[misInput]\"\n})\nexport class MisInputDirective implements OnInit, OnDestroy {\n constructor(public el: ElementRef, @Self() @Optional() private control: NgControl) {}\n private validityChange: ReplaySubject<boolean> = new ReplaySubject(1);\n validity = this.validityChange.asObservable();\n endObs: Subject<void> = new Subject();\n focus = false;\n hasValue = false;\n\n ngOnInit(): void {\n this.control?.control?.
|
|
1
|
+
{"version":3,"file":"mis-crystal-design-system-input.umd.js","sources":["../../../projects/mis-components/input/directives/input/input.directive.ts","../../../projects/mis-components/input/mis-input.component.ts","../../../projects/mis-components/input/mis-input.module.ts","../../../projects/mis-components/input/mis-crystal-design-system-input.ts"],"sourcesContent":["import { Directive, ElementRef, OnDestroy, OnInit, Optional, Self } from \"@angular/core\";\nimport { NgControl } from \"@angular/forms\";\nimport { ReplaySubject, Subject, Subscription } from \"rxjs\";\nimport { takeUntil } from \"rxjs/operators\";\n\n@Directive({\n // tslint:disable-next-line\n selector: \"input[misInput]\"\n})\nexport class MisInputDirective implements OnInit, OnDestroy {\n constructor(public el: ElementRef, @Self() @Optional() private control: NgControl) {}\n private validityChange: ReplaySubject<boolean> = new ReplaySubject(1);\n validity = this.validityChange.asObservable();\n endObs: Subject<void> = new Subject();\n focus = false;\n hasValue = false;\n\n ngOnInit(): void {\n this.control?.control?.valueChanges.pipe(takeUntil(this.endObs)).subscribe(() => {\n this.validityChange.next(!this.control.control?.invalid);\n });\n this.el.nativeElement.placeholder += \" \";\n }\n ngOnDestroy(): void {\n this.endObs.next();\n this.endObs.complete();\n }\n}\n","import { Component, ContentChild, Input, OnDestroy, OnInit, ViewEncapsulation } from \"@angular/core\";\nimport { Subscription } from \"rxjs\";\nimport { MisInputDirective } from \"./directives/input/input.directive\";\n\n@Component({\n selector: \"mis-input\",\n templateUrl: \"./mis-input.component.html\",\n styleUrls: [\"./mis-input.component.scss\"]\n})\nexport class MisInputComponent implements OnInit, OnDestroy {\n @Input() type: \"rounded\" | \"floating\" = \"floating\";\n @Input() size: \"sm\" | \"md\" | \"lg\" = \"sm\";\n @Input() placeholder: string; // floating placeholder text\n @Input() noHints = false;\n @Input() hasError = false; // show input in error state\n @ContentChild(MisInputDirective) set formInput(input: MisInputDirective) {\n if (!this.placeholder) {\n this.placeholder = input?.el.nativeElement.placeholder || \"\";\n }\n this.inputSubscription?.unsubscribe();\n this.inputSubscription = input?.validity.subscribe(res => (this.inputValidity = res));\n this.placeholder += \" \";\n }\n inputSubscription: Subscription | undefined;\n inputValidity: boolean = true;\n constructor() {}\n\n ngOnInit(): void {}\n ngOnDestroy(): void {\n this.inputSubscription?.unsubscribe();\n }\n}\n","import { CommonModule } from \"@angular/common\";\nimport { NgModule } from \"@angular/core\";\nimport { FormsModule } from \"@angular/forms\";\nimport { MisInputDirective } from \"./directives/input/input.directive\";\nimport { MisInputComponent } from \"./mis-input.component\";\n\n@NgModule({\n declarations: [MisInputComponent, MisInputDirective],\n imports: [CommonModule, FormsModule],\n exports: [MisInputComponent, MisInputDirective]\n})\nexport class MisInputModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["ReplaySubject","Subject","takeUntil","Directive","ElementRef","NgControl","Self","Optional","Component","Input","ContentChild","NgModule","CommonModule","FormsModule"],"mappings":";;;;;;;QAUE,2BAAmB,EAAc,EAA8B,OAAkB;YAA9D,OAAE,GAAF,EAAE,CAAY;YAA8B,YAAO,GAAP,OAAO,CAAW;YACzE,mBAAc,GAA2B,IAAIA,kBAAa,CAAC,CAAC,CAAC,CAAC;YACtE,aAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;YAC9C,WAAM,GAAkB,IAAIC,YAAO,EAAE,CAAC;YACtC,UAAK,GAAG,KAAK,CAAC;YACd,aAAQ,GAAG,KAAK,CAAC;SALoE;QAOrF,oCAAQ,GAAR;YAAA,iBAKC;;YAJC,YAAA,IAAI,CAAC,OAAO,0CAAE,OAAO,0CAAE,YAAY,CAAC,IAAI,CAACC,mBAAS,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC;;gBACzE,KAAI,CAAC,cAAc,CAAC,IAAI,CAAC,QAAC,KAAI,CAAC,OAAO,CAAC,OAAO,0CAAE,OAAO,CAAA,CAAC,CAAC;aAC1D,EAAE;YACH,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,WAAW,IAAI,GAAG,CAAC;SAC1C;QACD,uCAAW,GAAX;YACE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;YACnB,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC;SACxB;;;;gBArBFC,cAAS,SAAC;;oBAET,QAAQ,EAAE,iBAAiB;iBAC5B;;;gBARmBC,eAAU;gBACrBC,eAAS,uBASoBC,SAAI,YAAIC,aAAQ;;;;QCepD;YAfS,SAAI,GAA2B,UAAU,CAAC;YAC1C,SAAI,GAAuB,IAAI,CAAC;YAEhC,YAAO,GAAG,KAAK,CAAC;YAChB,aAAQ,GAAG,KAAK,CAAC;YAU1B,kBAAa,GAAY,IAAI,CAAC;SACd;QAVhB,sBAAqC,wCAAS;iBAA9C,UAA+C,KAAwB;gBAAvE,iBAOC;;gBANC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;oBACrB,IAAI,CAAC,WAAW,GAAG,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAC,aAAa,CAAC,WAAW,KAAI,EAAE,CAAC;iBAC9D;gBACD,MAAA,IAAI,CAAC,iBAAiB,0CAAE,WAAW,GAAG;gBACtC,IAAI,CAAC,iBAAiB,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,CAAC,SAAS,CAAC,UAAA,GAAG,IAAI,QAAC,KAAI,CAAC,aAAa,GAAG,GAAG,IAAC,CAAC,CAAC;gBACtF,IAAI,CAAC,WAAW,IAAI,GAAG,CAAC;aACzB;;;WAAA;QAKD,oCAAQ,GAAR,eAAmB;QACnB,uCAAW,GAAX;;YACE,MAAA,IAAI,CAAC,iBAAiB,0CAAE,WAAW,GAAG;SACvC;;;;gBA1BFC,cAAS,SAAC;oBACT,QAAQ,EAAE,WAAW;oBACrB,0pBAAyC;;iBAE1C;;;;uBAEEC,UAAK;uBACLA,UAAK;8BACLA,UAAK;0BACLA,UAAK;2BACLA,UAAK;4BACLC,iBAAY,SAAC,iBAAiB;;;;QCJjC;;;;;gBALCC,aAAQ,SAAC;oBACR,YAAY,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,CAAC;oBACpD,OAAO,EAAE,CAACC,mBAAY,EAAEC,iBAAW,CAAC;oBACpC,OAAO,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,CAAC;iBAChD;;;ICVD;;;;;;;;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("rxjs"),require("rxjs/operators"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/input",["exports","@angular/core","@angular/forms","rxjs","rxjs/operators","@angular/common"],t):t(((n="undefined"!=typeof globalThis?globalThis:n||self)["mis-crystal-design-system"]=n["mis-crystal-design-system"]||{},n["mis-crystal-design-system"].input={}),n.ng.core,n.ng.forms,n.rxjs,n.rxjs.operators,n.ng.common)}(this,(function(n,t,i,e,o,r){"use strict";var p=function(){function n(n,t){this.el=n,this.control=t,this.validityChange=new e.ReplaySubject(1),this.validity=this.validityChange.asObservable(),this.endObs=new e.Subject,this.focus=!1,this.hasValue=!1}return n.prototype.ngOnInit=function(){var n,t,i=this;null===(t=null===(n=this.control)||void 0===n?void 0:n.control)||void 0===t||t.
|
|
1
|
+
!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("rxjs"),require("rxjs/operators"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/input",["exports","@angular/core","@angular/forms","rxjs","rxjs/operators","@angular/common"],t):t(((n="undefined"!=typeof globalThis?globalThis:n||self)["mis-crystal-design-system"]=n["mis-crystal-design-system"]||{},n["mis-crystal-design-system"].input={}),n.ng.core,n.ng.forms,n.rxjs,n.rxjs.operators,n.ng.common)}(this,(function(n,t,i,e,o,r){"use strict";var p=function(){function n(n,t){this.el=n,this.control=t,this.validityChange=new e.ReplaySubject(1),this.validity=this.validityChange.asObservable(),this.endObs=new e.Subject,this.focus=!1,this.hasValue=!1}return n.prototype.ngOnInit=function(){var n,t,i=this;null===(t=null===(n=this.control)||void 0===n?void 0:n.control)||void 0===t||t.valueChanges.pipe(o.takeUntil(this.endObs)).subscribe((function(){var n;i.validityChange.next(!(null===(n=i.control.control)||void 0===n?void 0:n.invalid))})),this.el.nativeElement.placeholder+=" "},n.prototype.ngOnDestroy=function(){this.endObs.next(),this.endObs.complete()},n}();p.decorators=[{type:t.Directive,args:[{selector:"input[misInput]"}]}],p.ctorParameters=function(){return[{type:t.ElementRef},{type:i.NgControl,decorators:[{type:t.Self},{type:t.Optional}]}]};var a=function(){function n(){this.type="floating",this.size="sm",this.noHints=!1,this.hasError=!1,this.inputValidity=!0}return Object.defineProperty(n.prototype,"formInput",{set:function(n){var t,i=this;this.placeholder||(this.placeholder=(null==n?void 0:n.el.nativeElement.placeholder)||""),null===(t=this.inputSubscription)||void 0===t||t.unsubscribe(),this.inputSubscription=null==n?void 0:n.validity.subscribe((function(n){return i.inputValidity=n})),this.placeholder+=" "},enumerable:!1,configurable:!0}),n.prototype.ngOnInit=function(){},n.prototype.ngOnDestroy=function(){var n;null===(n=this.inputSubscription)||void 0===n||n.unsubscribe()},n}();a.decorators=[{type:t.Component,args:[{selector:"mis-input",template:'<div\n [class]="\'input-container \' + size"\n [ngClass]="{\n rounded: type === \'rounded\',\n floating: type === \'floating\',\n \'has-error\': !inputValidity || hasError,\n \'no-hint\': noHints\n }"\n>\n <div class="input-wrapper">\n <ng-content select="[mis-input-icon]"></ng-content>\n <div class="mis-input">\n <ng-content select="input"></ng-content>\n <span class="mis-placeholder">{{ placeholder }}</span>\n </div>\n <ng-content select="[mis-input-act]"></ng-content>\n </div>\n <ng-content select="[mis-input-hint]"></ng-content>\n <ng-content select="[mis-input-error]"></ng-content>\n</div>\n',styles:[".input-container{position:relative;padding-bottom:24px}.input-container .input-wrapper{box-sizing:border-box;display:flex;align-items:center;flex-direction:row;flex-wrap:nowrap;transition:all 60ms ease-in;background-color:#fff;padding:3px 16px}.input-container .input-wrapper>:not(:last-child){margin-right:16px}.input-container .input-wrapper .mis-input{flex:1 1 auto;z-index:0;position:relative;display:flex;align-items:center}.input-container .input-wrapper input{flex:1 1 auto;border:none;outline:none;height:100%;padding:0;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;height:24px;color:#181f33;background-color:transparent;width:100%;vertical-align:middle}.input-container .input-wrapper input::-moz-placeholder{-moz-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input:-ms-input-placeholder{-ms-transition:all .1s ease-in;transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper input::placeholder{transition:all .1s ease-in;opacity:0;transform-origin:left center;color:transparent}.input-container .input-wrapper .mis-placeholder{position:absolute;font-family:Lato;font-style:normal;font-weight:400;font-size:16px;line-height:24px;color:#6a737d;z-index:-1;transition:all .15s ease-in}.input-container .input-wrapper:focus-within{background-color:#f5f5f5}.input-container .input-wrapper:focus-within{border:1px solid #0937b2}.input-container .input-wrapper [mis-input-act],.input-container .input-wrapper [mis-input-icon]{width:18px;height:18px;color:#6a737d;font-size:24px;line-height:18px}.input-container .input-wrapper [mis-input-act]{cursor:pointer}.input-container.no-hint{padding-bottom:0}.input-container.rounded{box-sizing:initial}.input-container.rounded.sm input{padding:3px 16px}.input-container.rounded.md input{padding:9px 16px}.input-container.rounded.lg input{padding:15px 16px}.input-container.rounded .input-wrapper{border-radius:4px;border:1px solid #e0e0e0;padding:0}.input-container.rounded .input-wrapper input:not(:disabled):focus,.input-container.rounded .input-wrapper input:not(:disabled):hover{background-color:#f5f5f5}.input-container.rounded .input-wrapper:focus-within{border:1px solid #0937b2}.input-container.rounded .input-wrapper input:not(:-moz-placeholder-shown)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper input:not(:-ms-input-placeholder)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper input:not(:placeholder-shown)+.mis-placeholder{color:transparent!important}.input-container.rounded .input-wrapper .mis-placeholder{transition-duration:50ms}.input-container.rounded.has-error .input-wrapper{border:1px solid #b00020!important}.input-container.floating .input-wrapper{padding-top:24px;padding-bottom:7px;border-bottom:1px solid #e0e0e0}.input-container.floating .input-wrapper input:focus+.mis-placeholder{color:#0937b2!important}.input-container.floating .input-wrapper input:not(:-moz-placeholder-shown)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper input:not(:-ms-input-placeholder)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper input:focus+.mis-placeholder,.input-container.floating .input-wrapper input:not(:placeholder-shown)+.mis-placeholder{transform:translateY(calc(-100% + 6px))!important;font-size:12px!important;letter-spacing:.2px!important}.input-container.floating .input-wrapper:focus-within{border:none;border-bottom:1px solid #0937b2}.input-container.floating .input-wrapper:focus-within input::-moz-placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating .input-wrapper:focus-within input:-ms-input-placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating .input-wrapper:focus-within input::placeholder{color:#6a737d;opacity:1;font-size:16px}.input-container.floating.has-error .input-wrapper{border-bottom:1px solid #b00020!important}.input-container.floating.has-error .input-wrapper .mis-placeholder{color:#b00020!important}.input-container [mis-input-error],.input-container [mis-input-hint]{position:absolute;left:0;right:0;bottom:0;line-height:24px;height:24px;font-size:12px;color:#6a737d;letter-spacing:.2px}.input-container [mis-input-error]{color:#b00020}"]}]}],a.ctorParameters=function(){return[]},a.propDecorators={type:[{type:t.Input}],size:[{type:t.Input}],placeholder:[{type:t.Input}],noHints:[{type:t.Input}],hasError:[{type:t.Input}],formInput:[{type:t.ContentChild,args:[p]}]};var s=function(){};s.decorators=[{type:t.NgModule,args:[{declarations:[a,p],imports:[r.CommonModule,i.FormsModule],exports:[a,p]}]}],n.MisInputComponent=a,n.MisInputDirective=p,n.MisInputModule=s,Object.defineProperty(n,"__esModule",{value:!0})}));
|
|
2
2
|
//# sourceMappingURL=mis-crystal-design-system-input.umd.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../projects/mis-components/input/directives/input/input.directive.ts","../../../projects/mis-components/input/mis-input.component.ts","../../../projects/mis-components/input/mis-input.module.ts"],"names":["MisInputDirective","el","control","this","validityChange","ReplaySubject","validity","asObservable","endObs","Subject","focus","hasValue","prototype","ngOnInit","_this","_b","_a","
|
|
1
|
+
{"version":3,"sources":["../../../projects/mis-components/input/directives/input/input.directive.ts","../../../projects/mis-components/input/mis-input.component.ts","../../../projects/mis-components/input/mis-input.module.ts"],"names":["MisInputDirective","el","control","this","validityChange","ReplaySubject","validity","asObservable","endObs","Subject","focus","hasValue","prototype","ngOnInit","_this","_b","_a","valueChanges","pipe","takeUntil","subscribe","next","invalid","nativeElement","placeholder","ngOnDestroy","complete","Directive","args","selector","ElementRef","NgControl","decorators","type","Self","Optional","MisInputComponent","size","noHints","hasError","inputValidity","Object","defineProperty","input","inputSubscription","unsubscribe","res","Component","template","Input","ContentChild","NgModule","declarations","imports","CommonModule","FormsModule","exports"],"mappings":"uoBAUE,SAAAA,EAAmBC,EAA4CC,GAA5CC,KAAAF,GAAAA,EAA4CE,KAAAD,QAAAA,EACvDC,KAAAC,eAAyC,IAAIC,EAAAA,cAAc,GACnEF,KAAAG,SAAWH,KAAKC,eAAeG,eAC/BJ,KAAAK,OAAwB,IAAIC,EAAAA,QAC5BN,KAAAO,OAAQ,EACRP,KAAAQ,UAAW,SAEXX,EAAAY,UAAAC,SAAA,WAAA,QAAAC,EAAAX,KACuB,QAArBY,EAAY,QAAZC,EAAAb,KAAKD,eAAO,IAAAc,OAAA,EAAAA,EAAEd,eAAO,IAAAa,GAAAA,EAAEE,aAAaC,KAAKC,EAAAA,UAAUhB,KAAKK,SAASY,WAAU,iBACzEN,EAAKV,eAAeiB,OAA0B,QAArBL,EAACF,EAAKZ,QAAQA,eAAO,IAAAc,OAAA,EAAAA,EAAEM,aAElDnB,KAAKF,GAAGsB,cAAcC,aAAe,KAEvCxB,EAAAY,UAAAa,YAAA,WACEtB,KAAKK,OAAOa,OACZlB,KAAKK,OAAOkB,qCApBfC,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,+DAPQC,EAAAA,kBACXC,EAAAA,UAASC,WAAA,CAAA,CAAAC,KASoBC,EAAAA,MAAI,CAAAD,KAAIE,EAAAA,+BCe5C,SAAAC,IAfSjC,KAAA8B,KAA+B,WAC/B9B,KAAAkC,KAA2B,KAE3BlC,KAAAmC,SAAU,EACVnC,KAAAoC,UAAW,EAUpBpC,KAAAqC,eAAyB,SATzBC,OAAAC,eAAqCN,EAAAxB,UAAA,YAAS,KAA9C,SAA+C+B,GAA/C,MAAA7B,EAAAX,KACOA,KAAKqB,cACRrB,KAAKqB,aAAcmB,MAAAA,OAAK,EAALA,EAAO1C,GAAGsB,cAAcC,cAAe,IAEtC,QAAtBR,EAAAb,KAAKyC,yBAAiB,IAAA5B,GAAAA,EAAE6B,cACxB1C,KAAKyC,kBAAoBD,MAAAA,OAAK,EAALA,EAAOrC,SAASc,WAAU,SAAA0B,GAAO,OAAChC,EAAK0B,cAAgBM,KAChF3C,KAAKqB,aAAe,qCAMtBY,EAAAxB,UAAAC,SAAA,aACAuB,EAAAxB,UAAAa,YAAA,iBACwB,QAAtBT,EAAAb,KAAKyC,yBAAiB,IAAA5B,GAAAA,EAAE6B,wCAzB3BE,EAAAA,UAASnB,KAAA,CAAC,CACTC,SAAU,YACVmB,SAAA,0qKAICC,EAAAA,oBACAA,EAAAA,2BACAA,EAAAA,uBACAA,EAAAA,wBACAA,EAAAA,yBACAC,EAAAA,aAAYtB,KAAA,CAAC5B,YCJhB,iCALCmD,EAAAA,SAAQvB,KAAA,CAAC,CACRwB,aAAc,CAAChB,EAAmBpC,GAClCqD,QAAS,CAACC,EAAAA,aAAcC,EAAAA,aACxBC,QAAS,CAACpB,EAAmBpC","sourcesContent":["import { Directive, ElementRef, OnDestroy, OnInit, Optional, Self } from \"@angular/core\";\nimport { NgControl } from \"@angular/forms\";\nimport { ReplaySubject, Subject, Subscription } from \"rxjs\";\nimport { takeUntil } from \"rxjs/operators\";\n\n@Directive({\n // tslint:disable-next-line\n selector: \"input[misInput]\"\n})\nexport class MisInputDirective implements OnInit, OnDestroy {\n constructor(public el: ElementRef, @Self() @Optional() private control: NgControl) {}\n private validityChange: ReplaySubject<boolean> = new ReplaySubject(1);\n validity = this.validityChange.asObservable();\n endObs: Subject<void> = new Subject();\n focus = false;\n hasValue = false;\n\n ngOnInit(): void {\n this.control?.control?.valueChanges.pipe(takeUntil(this.endObs)).subscribe(() => {\n this.validityChange.next(!this.control.control?.invalid);\n });\n this.el.nativeElement.placeholder += \" \";\n }\n ngOnDestroy(): void {\n this.endObs.next();\n this.endObs.complete();\n }\n}\n","import { Component, ContentChild, Input, OnDestroy, OnInit, ViewEncapsulation } from \"@angular/core\";\nimport { Subscription } from \"rxjs\";\nimport { MisInputDirective } from \"./directives/input/input.directive\";\n\n@Component({\n selector: \"mis-input\",\n templateUrl: \"./mis-input.component.html\",\n styleUrls: [\"./mis-input.component.scss\"]\n})\nexport class MisInputComponent implements OnInit, OnDestroy {\n @Input() type: \"rounded\" | \"floating\" = \"floating\";\n @Input() size: \"sm\" | \"md\" | \"lg\" = \"sm\";\n @Input() placeholder: string; // floating placeholder text\n @Input() noHints = false;\n @Input() hasError = false; // show input in error state\n @ContentChild(MisInputDirective) set formInput(input: MisInputDirective) {\n if (!this.placeholder) {\n this.placeholder = input?.el.nativeElement.placeholder || \"\";\n }\n this.inputSubscription?.unsubscribe();\n this.inputSubscription = input?.validity.subscribe(res => (this.inputValidity = res));\n this.placeholder += \" \";\n }\n inputSubscription: Subscription | undefined;\n inputValidity: boolean = true;\n constructor() {}\n\n ngOnInit(): void {}\n ngOnDestroy(): void {\n this.inputSubscription?.unsubscribe();\n }\n}\n","import { CommonModule } from \"@angular/common\";\nimport { NgModule } from \"@angular/core\";\nimport { FormsModule } from \"@angular/forms\";\nimport { MisInputDirective } from \"./directives/input/input.directive\";\nimport { MisInputComponent } from \"./mis-input.component\";\n\n@NgModule({\n declarations: [MisInputComponent, MisInputDirective],\n imports: [CommonModule, FormsModule],\n exports: [MisInputComponent, MisInputDirective]\n})\nexport class MisInputModule {}\n"]}
|
|
@@ -87,7 +87,14 @@
|
|
|
87
87
|
var injectorTokens = new WeakMap();
|
|
88
88
|
injectorTokens.set(ModalRef, ref);
|
|
89
89
|
injectorTokens.set(MODAL_DATA_VAR, data);
|
|
90
|
-
return new
|
|
90
|
+
// return new PortalInjector(inj, injectorTokens);
|
|
91
|
+
return i0.Injector.create({
|
|
92
|
+
parent: inj,
|
|
93
|
+
providers: [
|
|
94
|
+
{ provide: ModalRef, useValue: ref },
|
|
95
|
+
{ provide: MODAL_DATA_VAR, useValue: data }
|
|
96
|
+
]
|
|
97
|
+
});
|
|
91
98
|
};
|
|
92
99
|
ModalService.prototype.calculatePosition = function (options) {
|
|
93
100
|
var position = this.overlay.position().global().centerHorizontally().centerVertically();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mis-crystal-design-system-modal.umd.js","sources":["../../../projects/mis-components/modal/modal-constants.ts","../../../projects/mis-components/modal/modal-ref.ts","../../../projects/mis-components/modal/module-wrapper/module-wrapper.component.ts","../../../projects/mis-components/modal/modal.service.ts","../../../projects/mis-components/modal/modal.module.ts","../../../projects/mis-components/modal/mis-crystal-design-system-modal.ts"],"sourcesContent":["/** @format */\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const MODAL_DATA_VAR = new InjectionToken<any>(\"MISModalDataInjectionToken\");\n","/** @format */\n\nimport { OverlayRef } from \"@angular/cdk/overlay\";\nimport { Injectable } from \"@angular/core\";\nimport { Subject } from \"rxjs\";\n\nexport class ModalRef {\n private afterClosed$ = new Subject<unknown>();\n afterClosed = this.afterClosed$.asObservable();\n\n constructor(public overlay: OverlayRef) {}\n\n close(data?: unknown): void {\n this.overlay.detach();\n this.overlay.dispose();\n this.afterClosed$.next(data);\n this.afterClosed$.complete();\n }\n}\n","import { trigger, transition, style, animate } from \"@angular/animations\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { Component, Injector, OnInit, ViewChild, ViewContainerRef } from \"@angular/core\";\nimport { ModalRef } from \"../modal-ref\";\n\n@Component({\n selector: \"mis-module-wrapper\",\n templateUrl: \"./module-wrapper.component.html\",\n styleUrls: [\"./module-wrapper.component.scss\"],\n animations: [\n trigger(\"slideInOut\", [\n transition(\":enter\", [\n style({ transform: \"translateY(-30%)\", opacity: 0 }),\n animate(\"200ms ease-out\", style({ transform: \"translatey(0%)\", opacity: 1 }))\n ]),\n transition(\":leave\", [animate(\"200ms ease-out\", style({ transform: \"translatey(-30%)\", opacity: 0 }))])\n ])\n ]\n})\nexport class ModuleWrapperComponent {\n modalPortal: ComponentPortal<any>;\n constructor() {}\n\n @ViewChild(\"place\", { static: false, read: ViewContainerRef }) place: ViewContainerRef;\n\n bindComponent(type: any, injector: PortalInjector) {\n this.initComponent(type, injector);\n }\n\n private initComponent(type: any, injector: PortalInjector) {\n this.modalPortal = new ComponentPortal(type, this.place, injector);\n }\n}\n","import { ComponentType, Overlay, OverlayConfig } from \"@angular/cdk/overlay\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable, Injector } from \"@angular/core\";\nimport { MODAL_DATA_VAR } from \"./modal-constants\";\nimport { ModalRef } from \"./modal-ref\";\nimport { ModuleWrapperComponent } from \"./module-wrapper/module-wrapper.component\";\n\ninterface IModalOptions {\n width?: string;\n height?: string;\n top?: string;\n right?: string;\n bottom?: string;\n left?: string;\n closeOnBackdropClick?: boolean;\n}\n@Injectable({\n providedIn: \"root\"\n})\nexport class ModalService {\n private componentInstance: ComponentRef<ModuleWrapperComponent>;\n\n constructor(private overlay: Overlay, private injector: Injector) {}\n\n show<T, D>(component: ComponentType<T>, data?: D, options?: IModalOptions): ModalRef {\n const positionStrategy = this.calculatePosition(options);\n const { width, height } = options || {};\n const config = new OverlayConfig({\n hasBackdrop: true,\n positionStrategy,\n scrollStrategy: this.overlay.scrollStrategies.noop(),\n width: width,\n height,\n panelClass: \"mis-modal\",\n backdropClass: \"mis-modal-overlay\"\n });\n const overlayRef = this.overlay.create(config);\n const modalRef = new ModalRef(overlayRef);\n const injector = this.createInjector(modalRef, this.injector, data);\n const portal = new ComponentPortal(ModuleWrapperComponent, null);\n this.componentInstance = overlayRef.attach(portal);\n if (options?.closeOnBackdropClick) {\n overlayRef.backdropClick().subscribe(() => modalRef.close());\n }\n this.componentInstance.instance.bindComponent(component, injector);\n return modalRef;\n }\n private createInjector<D>(ref: ModalRef, inj: Injector, data?: D): PortalInjector {\n const injectorTokens = new WeakMap();\n injectorTokens.set(ModalRef, ref);\n injectorTokens.set(MODAL_DATA_VAR, data);\n return new PortalInjector(inj, injectorTokens);\n }\n\n private calculatePosition(options: IModalOptions) {\n const position = this.overlay.position().global().centerHorizontally().centerVertically();\n if (options && screen.width > 600) {\n if (options.top) {\n position.top(options.top);\n }\n if (options.left) {\n position.left(options.left);\n }\n if (options.right) {\n position.right(options.right);\n }\n if (options.bottom) {\n position.bottom(options.bottom);\n }\n }\n return position;\n }\n}\n","import { ModuleWithProviders, NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\nimport { PortalModule } from \"@angular/cdk/portal\";\nimport { ModuleWrapperComponent } from \"./module-wrapper/module-wrapper.component\";\nimport { ModalService } from \"./modal.service\";\n\n@NgModule({\n declarations: [ModuleWrapperComponent],\n imports: [CommonModule, OverlayModule, PortalModule],\n entryComponents: [ModuleWrapperComponent]\n})\nexport class ModalModule {\n static forRoot(): ModuleWithProviders<ModalModule> {\n return {\n ngModule: ModalModule,\n providers: [ModalService]\n };\n }\n\n static forChild(): ModuleWithProviders<ModalModule> {\n return {\n ngModule: ModalModule,\n providers: [ModalService]\n };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n\nexport {ModuleWrapperComponent as ɵa} from './module-wrapper/module-wrapper.component';"],"names":["InjectionToken","Subject","ComponentPortal","Component","trigger","transition","style","animate","ViewChild","ViewContainerRef","OverlayConfig","portal","PortalInjector","Injectable","Overlay","Injector","NgModule","CommonModule","OverlayModule","PortalModule"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"mis-crystal-design-system-modal.umd.js","sources":["../../../projects/mis-components/modal/modal-constants.ts","../../../projects/mis-components/modal/modal-ref.ts","../../../projects/mis-components/modal/module-wrapper/module-wrapper.component.ts","../../../projects/mis-components/modal/modal.service.ts","../../../projects/mis-components/modal/modal.module.ts","../../../projects/mis-components/modal/mis-crystal-design-system-modal.ts"],"sourcesContent":["/** @format */\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const MODAL_DATA_VAR = new InjectionToken<any>(\"MISModalDataInjectionToken\");\n","/** @format */\n\nimport { OverlayRef } from \"@angular/cdk/overlay\";\nimport { Injectable } from \"@angular/core\";\nimport { Subject } from \"rxjs\";\n\nexport class ModalRef {\n private afterClosed$ = new Subject<unknown>();\n afterClosed = this.afterClosed$.asObservable();\n\n constructor(public overlay: OverlayRef) {}\n\n close(data?: unknown): void {\n this.overlay.detach();\n this.overlay.dispose();\n this.afterClosed$.next(data);\n this.afterClosed$.complete();\n }\n}\n","import { trigger, transition, style, animate } from \"@angular/animations\";\nimport { ComponentPortal } from \"@angular/cdk/portal\";\nimport { Component, Injector, ViewChild, ViewContainerRef } from \"@angular/core\";\n\n@Component({\n selector: \"mis-module-wrapper\",\n templateUrl: \"./module-wrapper.component.html\",\n styleUrls: [\"./module-wrapper.component.scss\"],\n animations: [\n trigger(\"slideInOut\", [\n transition(\":enter\", [\n style({ transform: \"translateY(-30%)\", opacity: 0 }),\n animate(\"200ms ease-out\", style({ transform: \"translatey(0%)\", opacity: 1 }))\n ]),\n transition(\":leave\", [animate(\"200ms ease-out\", style({ transform: \"translatey(-30%)\", opacity: 0 }))])\n ])\n ]\n})\nexport class ModuleWrapperComponent {\n modalPortal: ComponentPortal<any>;\n constructor() {}\n\n @ViewChild(\"place\", { static: false, read: ViewContainerRef }) place: ViewContainerRef;\n\n bindComponent(type: any, injector: Injector) {\n this.initComponent(type, injector);\n }\n\n private initComponent(type: any, injector: Injector) {\n this.modalPortal = new ComponentPortal(type, this.place, injector);\n }\n}\n","import { ComponentType, Overlay, OverlayConfig } from \"@angular/cdk/overlay\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable, Injector } from \"@angular/core\";\nimport { MODAL_DATA_VAR } from \"./modal-constants\";\nimport { ModalRef } from \"./modal-ref\";\nimport { ModuleWrapperComponent } from \"./module-wrapper/module-wrapper.component\";\n\ninterface IModalOptions {\n width?: string;\n height?: string;\n top?: string;\n right?: string;\n bottom?: string;\n left?: string;\n closeOnBackdropClick?: boolean;\n}\n@Injectable({\n providedIn: \"root\"\n})\nexport class ModalService {\n private componentInstance: ComponentRef<ModuleWrapperComponent>;\n\n constructor(private overlay: Overlay, private injector: Injector) {}\n\n show<T, D>(component: ComponentType<T>, data?: D, options?: IModalOptions): ModalRef {\n const positionStrategy = this.calculatePosition(options);\n const { width, height } = options || {};\n const config = new OverlayConfig({\n hasBackdrop: true,\n positionStrategy,\n scrollStrategy: this.overlay.scrollStrategies.noop(),\n width: width,\n height,\n panelClass: \"mis-modal\",\n backdropClass: \"mis-modal-overlay\"\n });\n const overlayRef = this.overlay.create(config);\n const modalRef = new ModalRef(overlayRef);\n const injector = this.createInjector(modalRef, this.injector, data);\n const portal = new ComponentPortal(ModuleWrapperComponent, null);\n this.componentInstance = overlayRef.attach(portal);\n if (options?.closeOnBackdropClick) {\n overlayRef.backdropClick().subscribe(() => modalRef.close());\n }\n this.componentInstance.instance.bindComponent(component, injector);\n return modalRef;\n }\n private createInjector<D>(ref: ModalRef, inj: Injector, data?: D): Injector {\n const injectorTokens = new WeakMap();\n injectorTokens.set(ModalRef, ref);\n injectorTokens.set(MODAL_DATA_VAR, data);\n // return new PortalInjector(inj, injectorTokens);\n return Injector.create({\n parent: inj,\n providers: [\n { provide: ModalRef, useValue: ref },\n { provide: MODAL_DATA_VAR, useValue: data }\n ]\n });\n }\n\n private calculatePosition(options: IModalOptions) {\n const position = this.overlay.position().global().centerHorizontally().centerVertically();\n if (options && screen.width > 600) {\n if (options.top) {\n position.top(options.top);\n }\n if (options.left) {\n position.left(options.left);\n }\n if (options.right) {\n position.right(options.right);\n }\n if (options.bottom) {\n position.bottom(options.bottom);\n }\n }\n return position;\n }\n}\n","import { ModuleWithProviders, NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\nimport { PortalModule } from \"@angular/cdk/portal\";\nimport { ModuleWrapperComponent } from \"./module-wrapper/module-wrapper.component\";\nimport { ModalService } from \"./modal.service\";\n\n@NgModule({\n declarations: [ModuleWrapperComponent],\n imports: [CommonModule, OverlayModule, PortalModule],\n entryComponents: [ModuleWrapperComponent]\n})\nexport class ModalModule {\n static forRoot(): ModuleWithProviders<ModalModule> {\n return {\n ngModule: ModalModule,\n providers: [ModalService]\n };\n }\n\n static forChild(): ModuleWithProviders<ModalModule> {\n return {\n ngModule: ModalModule,\n providers: [ModalService]\n };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n\nexport {ModuleWrapperComponent as ɵa} from './module-wrapper/module-wrapper.component';"],"names":["InjectionToken","Subject","ComponentPortal","Component","trigger","transition","style","animate","ViewChild","ViewContainerRef","OverlayConfig","portal","Injector","Injectable","Overlay","NgModule","CommonModule","OverlayModule","PortalModule"],"mappings":";;;;;;IAAA;QAIa,cAAc,GAAG,IAAIA,iBAAc,CAAM,4BAA4B;;ICJlF;;QAUE,kBAAmB,OAAmB;YAAnB,YAAO,GAAP,OAAO,CAAY;YAH9B,iBAAY,GAAG,IAAIC,YAAO,EAAW,CAAC;YAC9C,gBAAW,GAAG,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,CAAC;SAEL;QAE1C,wBAAK,GAAL,UAAM,IAAc;YAClB,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;YACtB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;YACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC7B,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,CAAC;SAC9B;uBACF;KAAA;;;QCEC;SAAgB;QAIhB,8CAAa,GAAb,UAAc,IAAS,EAAE,QAAkB;YACzC,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;SACpC;QAEO,8CAAa,GAAb,UAAc,IAAS,EAAE,QAAkB;YACjD,IAAI,CAAC,WAAW,GAAG,IAAIC,sBAAe,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;SACpE;;;;gBA1BFC,YAAS,SAAC;oBACT,QAAQ,EAAE,oBAAoB;oBAC9B,wIAA8C;oBAE9C,UAAU,EAAE;wBACVC,kBAAO,CAAC,YAAY,EAAE;4BACpBC,qBAAU,CAAC,QAAQ,EAAE;gCACnBC,gBAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;gCACpDC,kBAAO,CAAC,gBAAgB,EAAED,gBAAK,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC;6BAC9E,CAAC;4BACFD,qBAAU,CAAC,QAAQ,EAAE,CAACE,kBAAO,CAAC,gBAAgB,EAAED,gBAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;yBACxG,CAAC;qBACH;;iBACF;;;;wBAKEE,YAAS,SAAC,OAAO,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAEC,mBAAgB,EAAE;;;;QCA7D,sBAAoB,OAAgB,EAAU,QAAkB;YAA5C,YAAO,GAAP,OAAO,CAAS;YAAU,aAAQ,GAAR,QAAQ,CAAU;SAAI;QAEpE,2BAAI,GAAJ,UAAW,SAA2B,EAAE,IAAQ,EAAE,OAAuB;YACvE,IAAM,gBAAgB,GAAG,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC;YACnD,IAAA,KAAoB,OAAO,IAAI,EAAE,EAA/B,KAAK,WAAA,EAAE,MAAM,YAAkB,CAAC;YACxC,IAAM,MAAM,GAAG,IAAIC,gBAAa,CAAC;gBAC/B,WAAW,EAAE,IAAI;gBACjB,gBAAgB,kBAAA;gBAChB,cAAc,EAAE,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,EAAE;gBACpD,KAAK,EAAE,KAAK;gBACZ,MAAM,QAAA;gBACN,UAAU,EAAE,WAAW;gBACvB,aAAa,EAAE,mBAAmB;aACnC,CAAC,CAAC;YACH,IAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YAC/C,IAAM,QAAQ,GAAG,IAAI,QAAQ,CAAC,UAAU,CAAC,CAAC;YAC1C,IAAM,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;YACpE,IAAMC,QAAM,GAAG,IAAIT,sBAAe,CAAC,sBAAsB,EAAE,IAAI,CAAC,CAAC;YACjE,IAAI,CAAC,iBAAiB,GAAG,UAAU,CAAC,MAAM,CAACS,QAAM,CAAC,CAAC;YACnD,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,oBAAoB,EAAE;gBACjC,UAAU,CAAC,aAAa,EAAE,CAAC,SAAS,CAAC,cAAM,OAAA,QAAQ,CAAC,KAAK,EAAE,GAAA,CAAC,CAAC;aAC9D;YACD,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,aAAa,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;YACnE,OAAO,QAAQ,CAAC;SACjB;QACO,qCAAc,GAAd,UAAkB,GAAa,EAAE,GAAa,EAAE,IAAQ;YAC9D,IAAM,cAAc,GAAG,IAAI,OAAO,EAAE,CAAC;YACrC,cAAc,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;YAClC,cAAc,CAAC,GAAG,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;;YAEzC,OAAOC,WAAQ,CAAC,MAAM,CAAC;gBACrB,MAAM,EAAE,GAAG;gBACX,SAAS,EAAE;oBACT,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE;oBACpC,EAAE,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,IAAI,EAAE;iBAC5C;aACF,CAAC,CAAC;SACJ;QAEO,wCAAiB,GAAjB,UAAkB,OAAsB;YAC9C,IAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,kBAAkB,EAAE,CAAC,gBAAgB,EAAE,CAAC;YAC1F,IAAI,OAAO,IAAI,MAAM,CAAC,KAAK,GAAG,GAAG,EAAE;gBACjC,IAAI,OAAO,CAAC,GAAG,EAAE;oBACf,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;iBAC3B;gBACD,IAAI,OAAO,CAAC,IAAI,EAAE;oBAChB,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;iBAC7B;gBACD,IAAI,OAAO,CAAC,KAAK,EAAE;oBACjB,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;iBAC/B;gBACD,IAAI,OAAO,CAAC,MAAM,EAAE;oBAClB,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;iBACjC;aACF;YACD,OAAO,QAAQ,CAAC;SACjB;;;;;gBA9DFC,aAAU,SAAC;oBACV,UAAU,EAAE,MAAM;iBACnB;;;gBAlBuBC,UAAO;gBAEIF,WAAQ;;;;QCU3C;;QACS,mBAAO,GAAd;YACE,OAAO;gBACL,QAAQ,EAAE,WAAW;gBACrB,SAAS,EAAE,CAAC,YAAY,CAAC;aAC1B,CAAC;SACH;QAEM,oBAAQ,GAAf;YACE,OAAO;gBACL,QAAQ,EAAE,WAAW;gBACrB,SAAS,EAAE,CAAC,YAAY,CAAC;aAC1B,CAAC;SACH;;;;gBAlBFG,WAAQ,SAAC;oBACR,YAAY,EAAE,CAAC,sBAAsB,CAAC;oBACtC,OAAO,EAAE,CAACC,mBAAY,EAAEC,gBAAa,EAAEC,mBAAY,CAAC;oBACpD,eAAe,EAAE,CAAC,sBAAsB,CAAC;iBAC1C;;;ICXD;;;;;;;;;;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/cdk/overlay"),require("@angular/cdk/portal"),require("@angular/core"),require("rxjs"),require("@angular/animations"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/modal",["exports","@angular/cdk/overlay","@angular/cdk/portal","@angular/core","rxjs","@angular/animations","@angular/common"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self)["mis-crystal-design-system"]=e["mis-crystal-design-system"]||{},e["mis-crystal-design-system"].modal={}),e.ng.cdk.overlay,e.ng.cdk.portal,e.ng.core,e.rxjs,e.ng.animations,e.ng.common)}(this,(function(e,t,o,n,
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/cdk/overlay"),require("@angular/cdk/portal"),require("@angular/core"),require("rxjs"),require("@angular/animations"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/modal",["exports","@angular/cdk/overlay","@angular/cdk/portal","@angular/core","rxjs","@angular/animations","@angular/common"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self)["mis-crystal-design-system"]=e["mis-crystal-design-system"]||{},e["mis-crystal-design-system"].modal={}),e.ng.cdk.overlay,e.ng.cdk.portal,e.ng.core,e.rxjs,e.ng.animations,e.ng.common)}(this,(function(e,t,o,r,n,a,i){"use strict";var s=new r.InjectionToken("MISModalDataInjectionToken"),l=function(){function e(e){this.overlay=e,this.afterClosed$=new n.Subject,this.afterClosed=this.afterClosed$.asObservable()}return e.prototype.close=function(e){this.overlay.detach(),this.overlay.dispose(),this.afterClosed$.next(e),this.afterClosed$.complete()},e}(),c=function(){function e(){}return e.prototype.bindComponent=function(e,t){this.initComponent(e,t)},e.prototype.initComponent=function(e,t){this.modalPortal=new o.ComponentPortal(e,this.place,t)},e}();c.decorators=[{type:r.Component,args:[{selector:"mis-module-wrapper",template:'<div class="mis-modal-body" #place @slideInOut>\n <ng-template [cdkPortalOutlet]="modalPortal"></ng-template>\n</div>\n',animations:[a.trigger("slideInOut",[a.transition(":enter",[a.style({transform:"translateY(-30%)",opacity:0}),a.animate("200ms ease-out",a.style({transform:"translatey(0%)",opacity:1}))]),a.transition(":leave",[a.animate("200ms ease-out",a.style({transform:"translatey(-30%)",opacity:0}))])])],styles:[".mis-modal-body{display:block;width:100%;height:100%;background-color:transparent;border-radius:12px;box-shadow:0 12px 24px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.12);overflow:hidden}"]}]}],c.ctorParameters=function(){return[]},c.propDecorators={place:[{type:r.ViewChild,args:["place",{static:!1,read:r.ViewContainerRef}]}]};var d=function(){function e(e,t){this.overlay=e,this.injector=t}return e.prototype.show=function(e,r,n){var a=this.calculatePosition(n),i=n||{},s=i.width,d=i.height,p=new t.OverlayConfig({hasBackdrop:!0,positionStrategy:a,scrollStrategy:this.overlay.scrollStrategies.noop(),width:s,height:d,panelClass:"mis-modal",backdropClass:"mis-modal-overlay"}),u=this.overlay.create(p),m=new l(u),y=this.createInjector(m,this.injector,r),f=new o.ComponentPortal(c,null);return this.componentInstance=u.attach(f),(null==n?void 0:n.closeOnBackdropClick)&&u.backdropClick().subscribe((function(){return m.close()})),this.componentInstance.instance.bindComponent(e,y),m},e.prototype.createInjector=function(e,t,o){var n=new WeakMap;return n.set(l,e),n.set(s,o),r.Injector.create({parent:t,providers:[{provide:l,useValue:e},{provide:s,useValue:o}]})},e.prototype.calculatePosition=function(e){var t=this.overlay.position().global().centerHorizontally().centerVertically();return e&&screen.width>600&&(e.top&&t.top(e.top),e.left&&t.left(e.left),e.right&&t.right(e.right),e.bottom&&t.bottom(e.bottom)),t},e}();d.ɵprov=r.ɵɵdefineInjectable({factory:function(){return new d(r.ɵɵinject(t.Overlay),r.ɵɵinject(r.INJECTOR))},token:d,providedIn:"root"}),d.decorators=[{type:r.Injectable,args:[{providedIn:"root"}]}],d.ctorParameters=function(){return[{type:t.Overlay},{type:r.Injector}]};var p=function(){function e(){}return e.forRoot=function(){return{ngModule:e,providers:[d]}},e.forChild=function(){return{ngModule:e,providers:[d]}},e}();p.decorators=[{type:r.NgModule,args:[{declarations:[c],imports:[i.CommonModule,t.OverlayModule,o.PortalModule],entryComponents:[c]}]}],e.MODAL_DATA_VAR=s,e.ModalModule=p,e.ModalRef=l,e.ModalService=d,e.ɵa=c,Object.defineProperty(e,"__esModule",{value:!0})}));
|
|
2
2
|
//# sourceMappingURL=mis-crystal-design-system-modal.umd.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../projects/mis-components/modal/modal-constants.ts","../../../projects/mis-components/modal/modal-ref.ts","../../../projects/mis-components/modal/module-wrapper/module-wrapper.component.ts","../../../projects/mis-components/modal/modal.service.ts","../../../projects/mis-components/modal/modal.module.ts"],"names":["MODAL_DATA_VAR","InjectionToken","ModalRef","overlay","this","afterClosed$","Subject","afterClosed","asObservable","prototype","close","data","detach","dispose","next","complete","ModuleWrapperComponent","bindComponent","type","injector","initComponent","modalPortal","ComponentPortal","place","Component","args","selector","template","animations","trigger","transition","style","transform","opacity","animate","ViewChild","static","read","ViewContainerRef","ModalService","show","component","options","positionStrategy","calculatePosition","_a","width","height","config","OverlayConfig","hasBackdrop","scrollStrategy","scrollStrategies","noop","panelClass","backdropClass","overlayRef","create","modalRef","createInjector","portal","componentInstance","attach","closeOnBackdropClick","backdropClick","subscribe","instance","ref","inj","injectorTokens","WeakMap","set","
|
|
1
|
+
{"version":3,"sources":["../../../projects/mis-components/modal/modal-constants.ts","../../../projects/mis-components/modal/modal-ref.ts","../../../projects/mis-components/modal/module-wrapper/module-wrapper.component.ts","../../../projects/mis-components/modal/modal.service.ts","../../../projects/mis-components/modal/modal.module.ts"],"names":["MODAL_DATA_VAR","InjectionToken","ModalRef","overlay","this","afterClosed$","Subject","afterClosed","asObservable","prototype","close","data","detach","dispose","next","complete","ModuleWrapperComponent","bindComponent","type","injector","initComponent","modalPortal","ComponentPortal","place","Component","args","selector","template","animations","trigger","transition","style","transform","opacity","animate","ViewChild","static","read","ViewContainerRef","ModalService","show","component","options","positionStrategy","calculatePosition","_a","width","height","config","OverlayConfig","hasBackdrop","scrollStrategy","scrollStrategies","noop","panelClass","backdropClass","overlayRef","create","modalRef","createInjector","portal","componentInstance","attach","closeOnBackdropClick","backdropClick","subscribe","instance","ref","inj","injectorTokens","WeakMap","set","Injector","parent","providers","provide","useValue","position","global","centerHorizontally","centerVertically","screen","top","left","right","bottom","Injectable","providedIn","Overlay","ModalModule","forRoot","ngModule","forChild","NgModule","declarations","imports","CommonModule","OverlayModule","PortalModule","entryComponents"],"mappings":"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","sourcesContent":["/** @format */\n\nimport { InjectionToken } from \"@angular/core\";\n\nexport const MODAL_DATA_VAR = new InjectionToken<any>(\"MISModalDataInjectionToken\");\n","/** @format */\n\nimport { OverlayRef } from \"@angular/cdk/overlay\";\nimport { Injectable } from \"@angular/core\";\nimport { Subject } from \"rxjs\";\n\nexport class ModalRef {\n private afterClosed$ = new Subject<unknown>();\n afterClosed = this.afterClosed$.asObservable();\n\n constructor(public overlay: OverlayRef) {}\n\n close(data?: unknown): void {\n this.overlay.detach();\n this.overlay.dispose();\n this.afterClosed$.next(data);\n this.afterClosed$.complete();\n }\n}\n","import { trigger, transition, style, animate } from \"@angular/animations\";\nimport { ComponentPortal } from \"@angular/cdk/portal\";\nimport { Component, Injector, ViewChild, ViewContainerRef } from \"@angular/core\";\n\n@Component({\n selector: \"mis-module-wrapper\",\n templateUrl: \"./module-wrapper.component.html\",\n styleUrls: [\"./module-wrapper.component.scss\"],\n animations: [\n trigger(\"slideInOut\", [\n transition(\":enter\", [\n style({ transform: \"translateY(-30%)\", opacity: 0 }),\n animate(\"200ms ease-out\", style({ transform: \"translatey(0%)\", opacity: 1 }))\n ]),\n transition(\":leave\", [animate(\"200ms ease-out\", style({ transform: \"translatey(-30%)\", opacity: 0 }))])\n ])\n ]\n})\nexport class ModuleWrapperComponent {\n modalPortal: ComponentPortal<any>;\n constructor() {}\n\n @ViewChild(\"place\", { static: false, read: ViewContainerRef }) place: ViewContainerRef;\n\n bindComponent(type: any, injector: Injector) {\n this.initComponent(type, injector);\n }\n\n private initComponent(type: any, injector: Injector) {\n this.modalPortal = new ComponentPortal(type, this.place, injector);\n }\n}\n","import { ComponentType, Overlay, OverlayConfig } from \"@angular/cdk/overlay\";\nimport { ComponentPortal, PortalInjector } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable, Injector } from \"@angular/core\";\nimport { MODAL_DATA_VAR } from \"./modal-constants\";\nimport { ModalRef } from \"./modal-ref\";\nimport { ModuleWrapperComponent } from \"./module-wrapper/module-wrapper.component\";\n\ninterface IModalOptions {\n width?: string;\n height?: string;\n top?: string;\n right?: string;\n bottom?: string;\n left?: string;\n closeOnBackdropClick?: boolean;\n}\n@Injectable({\n providedIn: \"root\"\n})\nexport class ModalService {\n private componentInstance: ComponentRef<ModuleWrapperComponent>;\n\n constructor(private overlay: Overlay, private injector: Injector) {}\n\n show<T, D>(component: ComponentType<T>, data?: D, options?: IModalOptions): ModalRef {\n const positionStrategy = this.calculatePosition(options);\n const { width, height } = options || {};\n const config = new OverlayConfig({\n hasBackdrop: true,\n positionStrategy,\n scrollStrategy: this.overlay.scrollStrategies.noop(),\n width: width,\n height,\n panelClass: \"mis-modal\",\n backdropClass: \"mis-modal-overlay\"\n });\n const overlayRef = this.overlay.create(config);\n const modalRef = new ModalRef(overlayRef);\n const injector = this.createInjector(modalRef, this.injector, data);\n const portal = new ComponentPortal(ModuleWrapperComponent, null);\n this.componentInstance = overlayRef.attach(portal);\n if (options?.closeOnBackdropClick) {\n overlayRef.backdropClick().subscribe(() => modalRef.close());\n }\n this.componentInstance.instance.bindComponent(component, injector);\n return modalRef;\n }\n private createInjector<D>(ref: ModalRef, inj: Injector, data?: D): Injector {\n const injectorTokens = new WeakMap();\n injectorTokens.set(ModalRef, ref);\n injectorTokens.set(MODAL_DATA_VAR, data);\n // return new PortalInjector(inj, injectorTokens);\n return Injector.create({\n parent: inj,\n providers: [\n { provide: ModalRef, useValue: ref },\n { provide: MODAL_DATA_VAR, useValue: data }\n ]\n });\n }\n\n private calculatePosition(options: IModalOptions) {\n const position = this.overlay.position().global().centerHorizontally().centerVertically();\n if (options && screen.width > 600) {\n if (options.top) {\n position.top(options.top);\n }\n if (options.left) {\n position.left(options.left);\n }\n if (options.right) {\n position.right(options.right);\n }\n if (options.bottom) {\n position.bottom(options.bottom);\n }\n }\n return position;\n }\n}\n","import { ModuleWithProviders, NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\nimport { OverlayModule } from \"@angular/cdk/overlay\";\nimport { PortalModule } from \"@angular/cdk/portal\";\nimport { ModuleWrapperComponent } from \"./module-wrapper/module-wrapper.component\";\nimport { ModalService } from \"./modal.service\";\n\n@NgModule({\n declarations: [ModuleWrapperComponent],\n imports: [CommonModule, OverlayModule, PortalModule],\n entryComponents: [ModuleWrapperComponent]\n})\nexport class ModalModule {\n static forRoot(): ModuleWithProviders<ModalModule> {\n return {\n ngModule: ModalModule,\n providers: [ModalService]\n };\n }\n\n static forChild(): ModuleWithProviders<ModalModule> {\n return {\n ngModule: ModalModule,\n providers: [ModalService]\n };\n }\n}\n"]}
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
/** @format */
|
|
2
|
-
import { ComponentPortal
|
|
3
|
-
import { ComponentFactoryResolver, ViewContainerRef } from "@angular/core";
|
|
2
|
+
import { ComponentPortal } from "@angular/cdk/portal";
|
|
3
|
+
import { ComponentFactoryResolver, Injector, ViewContainerRef } from "@angular/core";
|
|
4
4
|
export declare class DrawerBodyComponent {
|
|
5
5
|
private cfr;
|
|
6
6
|
drawerPortal: ComponentPortal<any>;
|
|
7
7
|
constructor(cfr: ComponentFactoryResolver);
|
|
8
8
|
place: ViewContainerRef;
|
|
9
|
-
bindComponent(type: any, injector:
|
|
9
|
+
bindComponent(type: any, injector: Injector): void;
|
|
10
10
|
private initComponent;
|
|
11
|
-
private createInjector;
|
|
12
11
|
}
|