mis-crystal-design-system 2.0.1 → 2.2.0

package/bundles/mis-crystal-design-system-input.umd.js

@@ -0,0 +1,111 @@
+(function (global, factory) {
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('rxjs'), require('rxjs/operators'), require('@angular/common')) :
+    typeof define === 'function' && define.amd ? define('mis-crystal-design-system/input', ['exports', '@angular/core', '@angular/forms', 'rxjs', 'rxjs/operators', '@angular/common'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global['mis-crystal-design-system'] = global['mis-crystal-design-system'] || {}, global['mis-crystal-design-system'].input = {}), global.ng.core, global.ng.forms, global.rxjs, global.rxjs.operators, global.ng.common));
+}(this, (function (exports, core, forms, rxjs, operators, common) { 'use strict';
+
+    var MisInputDirective = /** @class */ (function () {
+        function MisInputDirective(el, control) {
+            this.el = el;
+            this.control = control;
+            this.validityChange = new rxjs.ReplaySubject(1);
+            this.validity = this.validityChange.asObservable();
+            this.endObs = new rxjs.Subject();
+            this.focus = false;
+            this.hasValue = false;
+        }
+        MisInputDirective.prototype.ngOnInit = function () {
+            var _this = this;
+            var _a, _b;
+            (_b = (_a = this.control) === null || _a === void 0 ? void 0 : _a.control) === null || _b === void 0 ? void 0 : _b.statusChanges.pipe(operators.takeUntil(this.endObs)).subscribe(function () {
+                var _a;
+                _this.validityChange.next((_a = _this.control.control) === null || _a === void 0 ? void 0 : _a.valid);
+            });
+            this.el.nativeElement.placeholder += ' ';
+        };
+        MisInputDirective.prototype.ngOnDestroy = function () {
+            this.endObs.next();
+            this.endObs.complete();
+        };
+        return MisInputDirective;
+    }());
+    MisInputDirective.decorators = [
+        { type: core.Directive, args: [{
+                    // tslint:disable-next-line
+                    selector: 'input[misInput]',
+                },] }
+    ];
+    MisInputDirective.ctorParameters = function () { return [
+        { type: core.ElementRef },
+        { type: forms.NgControl, decorators: [{ type: core.Self }, { type: core.Optional }] }
+    ]; };
+
+    var MisInputComponent = /** @class */ (function () {
+        function MisInputComponent() {
+            this.type = 'floating';
+            this.noHints = false;
+            this.hasError = false; // show input in error state
+            this.inputValidity = true;
+        }
+        Object.defineProperty(MisInputComponent.prototype, "formInput", {
+            set: function (input) {
+                var _this = this;
+                var _a;
+                if (!this.placeholder) {
+                    this.placeholder = input.el.nativeElement.placeholder;
+                }
+                (_a = this.inputSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+                this.inputSubscription = input === null || input === void 0 ? void 0 : input.validity.subscribe(function (res) { return (_this.inputValidity = res); });
+                this.placeholder += ' ';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        MisInputComponent.prototype.ngOnInit = function () { };
+        MisInputComponent.prototype.ngOnDestroy = function () {
+            var _a;
+            (_a = this.inputSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+        };
+        return MisInputComponent;
+    }());
+    MisInputComponent.decorators = [
+        { type: core.Component, args: [{
+                    selector: 'mis-input',
+                    template: "<div class=\"input-container\" [ngClass]=\"{'rounded': type === 'rounded', 'floating': type === 'floating', 'has-error': !inputValidity || hasError, 'no-hint': noHints}\">\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>",
+                    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 .input-wrapper{border-radius:4px;border:1px solid #e0e0e0}.input-container.rounded .input-wrapper:focus-within,.input-container.rounded .input-wrapper:hover{background-color:#f5f5f5}.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}"]
+                },] }
+    ];
+    MisInputComponent.ctorParameters = function () { return []; };
+    MisInputComponent.propDecorators = {
+        type: [{ type: core.Input }],
+        placeholder: [{ type: core.Input }],
+        noHints: [{ type: core.Input }],
+        hasError: [{ type: core.Input }],
+        formInput: [{ type: core.ContentChild, args: [MisInputDirective,] }]
+    };
+
+    var MisInputModule = /** @class */ (function () {
+        function MisInputModule() {
+        }
+        return MisInputModule;
+    }());
+    MisInputModule.decorators = [
+        { type: core.NgModule, args: [{
+                    declarations: [MisInputComponent, MisInputDirective],
+                    imports: [common.CommonModule, forms.FormsModule],
+                    exports: [MisInputComponent, MisInputDirective],
+                },] }
+    ];
+
+    /**
+     * Generated bundle index. Do not edit.
+     */
+
+    exports.MisInputComponent = MisInputComponent;
+    exports.MisInputDirective = MisInputDirective;
+    exports.MisInputModule = MisInputModule;
+
+    Object.defineProperty(exports, '__esModule', { value: true });
+
+})));
+//# sourceMappingURL=mis-crystal-design-system-input.umd.js.map

package/bundles/mis-crystal-design-system-input.umd.js.map

@@ -0,0 +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 {\n  Directive,\n  ElementRef,\n  OnDestroy,\n  OnInit,\n  Optional,\n  Self,\n} 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(\n    public el: ElementRef,\n    @Self() @Optional() private control: NgControl\n  ) {}\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?.statusChanges\n      .pipe(takeUntil(this.endObs))\n      .subscribe(() => {\n        this.validityChange.next(this.control.control?.valid);\n      });\n    this.el.nativeElement.placeholder += ' ';\n  }\n  ngOnDestroy(): void {\n    this.endObs.next();\n    this.endObs.complete();\n  }\n}\n","import {\n  Component,\n  ContentChild,\n  Input,\n  OnDestroy,\n  OnInit,\n  ViewEncapsulation,\n} 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() 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(\n      (res) => (this.inputValidity = res)\n    );\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":";;;;;;;QAiBE,2BACS,EAAc,EACO,OAAkB;YADvC,OAAE,GAAF,EAAE,CAAY;YACO,YAAO,GAAP,OAAO,CAAW;YAExC,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;SALb;QAOJ,oCAAQ,GAAR;YAAA,iBAOC;;YANC,YAAA,IAAI,CAAC,OAAO,0CAAE,OAAO,0CAAE,aAAa,CACjC,IAAI,CAACC,mBAAS,CAAC,IAAI,CAAC,MAAM,CAAC,EAC3B,SAAS,CAAC;;gBACT,KAAI,CAAC,cAAc,CAAC,IAAI,OAAC,KAAI,CAAC,OAAO,CAAC,OAAO,0CAAE,KAAK,CAAC,CAAC;aACvD,EAAE;YACL,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;;;;gBA1BFC,cAAS,SAAC;;oBAET,QAAQ,EAAE,iBAAiB;iBAC5B;;;gBAbCC,eAAU;gBAMHC,eAAS,uBAWbC,SAAI,YAAIC,aAAQ;;;;QCcnB;YAhBS,SAAI,GAA2B,UAAU,CAAC;YAE1C,YAAO,GAAG,KAAK,CAAC;YAChB,aAAQ,GAAG,KAAK,CAAC;YAY1B,kBAAa,GAAY,IAAI,CAAC;SACd;QAZhB,sBAAqC,wCAAS;iBAA9C,UAA+C,KAAwB;gBAAvE,iBASC;;gBARC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;oBACrB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,EAAE,CAAC,aAAa,CAAC,WAAW,CAAC;iBACvD;gBACD,MAAA,IAAI,CAAC,iBAAiB,0CAAE,WAAW,GAAG;gBACtC,IAAI,CAAC,iBAAiB,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,CAAC,SAAS,CAChD,UAAC,GAAG,IAAK,QAAC,KAAI,CAAC,aAAa,GAAG,GAAG,IAAC,CACpC,CAAC;gBACF,IAAI,CAAC,WAAW,IAAI,GAAG,CAAC;aACzB;;;WAAA;QAKD,oCAAQ,GAAR,eAAmB;QACnB,uCAAW,GAAX;;YACE,MAAA,IAAI,CAAC,iBAAiB,0CAAE,WAAW,GAAG;SACvC;;;;gBA3BFC,cAAS,SAAC;oBACT,QAAQ,EAAE,WAAW;oBACrB,6mBAAyC;;iBAE1C;;;;uBAEEC,UAAK;8BACLA,UAAK;0BACLA,UAAK;2BACLA,UAAK;4BACLC,iBAAY,SAAC,iBAAiB;;;;QCVjC;;;;;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;;;;;;;;;;;;;;"}

package/bundles/mis-crystal-design-system-input.umd.min.js

@@ -0,0 +1,2 @@
+!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.statusChanges.pipe(o.takeUntil(this.endObs)).subscribe((function(){var n;i.validityChange.next(null===(n=i.control.control)||void 0===n?void 0:n.valid)})),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.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=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 class="input-container" [ngClass]="{\'rounded\': type === \'rounded\', \'floating\': type === \'floating\', \'has-error\': !inputValidity || hasError, \'no-hint\': noHints}">\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>',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 .input-wrapper{border-radius:4px;border:1px solid #e0e0e0}.input-container.rounded .input-wrapper:focus-within,.input-container.rounded .input-wrapper:hover{background-color:#f5f5f5}.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}],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})}));
+//# sourceMappingURL=mis-crystal-design-system-input.umd.min.js.map

package/bundles/mis-crystal-design-system-input.umd.min.js.map

@@ -0,0 +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","statusChanges","pipe","takeUntil","subscribe","next","valid","nativeElement","placeholder","ngOnDestroy","complete","Directive","args","selector","ElementRef","NgControl","decorators","type","Self","Optional","MisInputComponent","noHints","hasError","inputValidity","Object","defineProperty","input","inputSubscription","unsubscribe","res","Component","template","Input","ContentChild","NgModule","declarations","imports","CommonModule","FormsModule","exports"],"mappings":"uoBAiBE,SAAAA,EACSC,EACqBC,GADrBC,KAAAF,GAAAA,EACqBE,KAAAD,QAAAA,EAEtBC,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,cACpBC,KAAKC,EAAAA,UAAUhB,KAAKK,SACpBY,WAAU,iBACTN,EAAKV,eAAeiB,KAAyB,QAArBL,EAACF,EAAKZ,QAAQA,eAAO,IAAAc,OAAA,EAAAA,EAAEM,UAEnDnB,KAAKF,GAAGsB,cAAcC,aAAe,KAEvCxB,EAAAY,UAAAa,YAAA,WACEtB,KAAKK,OAAOa,OACZlB,KAAKK,OAAOkB,qCAzBfC,EAAAA,UAASC,KAAA,CAAC,CAETC,SAAU,+DAZVC,EAAAA,kBAMOC,EAAAA,UAASC,WAAA,CAAA,CAAAC,KAWbC,EAAAA,MAAI,CAAAD,KAAIE,EAAAA,+BCcX,SAAAC,IAhBSjC,KAAA8B,KAA+B,WAE/B9B,KAAAkC,SAAU,EACVlC,KAAAmC,UAAW,EAYpBnC,KAAAoC,eAAyB,SAXzBC,OAAAC,eAAqCL,EAAAxB,UAAA,YAAS,KAA9C,SAA+C8B,GAA/C,MAAA5B,EAAAX,KACOA,KAAKqB,cACRrB,KAAKqB,YAAckB,EAAMzC,GAAGsB,cAAcC,aAEtB,QAAtBR,EAAAb,KAAKwC,yBAAiB,IAAA3B,GAAAA,EAAE4B,cACxBzC,KAAKwC,kBAAoBD,MAAAA,OAAK,EAALA,EAAOpC,SAASc,WACvC,SAACyB,GAAQ,OAAC/B,EAAKyB,cAAgBM,KAEjC1C,KAAKqB,aAAe,qCAMtBY,EAAAxB,UAAAC,SAAA,aACAuB,EAAAxB,UAAAa,YAAA,iBACwB,QAAtBT,EAAAb,KAAKwC,yBAAiB,IAAA3B,GAAAA,EAAE4B,wCA1B3BE,EAAAA,UAASlB,KAAA,CAAC,CACTC,SAAU,YACVkB,SAAA,8zJAICC,EAAAA,2BACAA,EAAAA,uBACAA,EAAAA,wBACAA,EAAAA,yBACAC,EAAAA,aAAYrB,KAAA,CAAC5B,YCVhB,iCALCkD,EAAAA,SAAQtB,KAAA,CAAC,CACRuB,aAAc,CAACf,EAAmBpC,GAClCoD,QAAS,CAACC,EAAAA,aAAcC,EAAAA,aACxBC,QAAS,CAACnB,EAAmBpC","sourcesContent":["import {\n  Directive,\n  ElementRef,\n  OnDestroy,\n  OnInit,\n  Optional,\n  Self,\n} 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(\n    public el: ElementRef,\n    @Self() @Optional() private control: NgControl\n  ) {}\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?.statusChanges\n      .pipe(takeUntil(this.endObs))\n      .subscribe(() => {\n        this.validityChange.next(this.control.control?.valid);\n      });\n    this.el.nativeElement.placeholder += ' ';\n  }\n  ngOnDestroy(): void {\n    this.endObs.next();\n    this.endObs.complete();\n  }\n}\n","import {\n  Component,\n  ContentChild,\n  Input,\n  OnDestroy,\n  OnInit,\n  ViewEncapsulation,\n} 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() 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(\n      (res) => (this.inputValidity = res)\n    );\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"]}

package/bundles/mis-crystal-design-system-loader.umd.js

@@ -0,0 +1,54 @@
+(function (global, factory) {
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common')) :
+    typeof define === 'function' && define.amd ? define('mis-crystal-design-system/loader', ['exports', '@angular/core', '@angular/common'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global['mis-crystal-design-system'] = global['mis-crystal-design-system'] || {}, global['mis-crystal-design-system'].loader = {}), global.ng.core, global.ng.common));
+}(this, (function (exports, core, common) { 'use strict';
+
+    var LoaderComponent = /** @class */ (function () {
+        function LoaderComponent() {
+            /** Controls loader size */
+            this.mobileView = false;
+        }
+        LoaderComponent.prototype.ngOnInit = function () {
+        };
+        return LoaderComponent;
+    }());
+    LoaderComponent.decorators = [
+        { type: core.Component, args: [{
+                    selector: 'mis-loader',
+                    template: "<div id=\"spinner\" [ngClass]=\"{\n  'mobile': mobileView\n}\"></div>\n",
+                    styles: ["#spinner{-webkit-animation:frames 1s linear infinite;animation:frames 1s linear infinite;background:transparent;border-radius:100%;border:4px solid #e0e0e0;border-top-color:#6200ee;width:40px;height:40px;padding:0;position:absolute}@-webkit-keyframes frames{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes frames{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}.mobile{height:20px!important;width:20px!important;border:2px solid #e0e0e0!important;border-top-color:#6200ee!important}"]
+                },] }
+    ];
+    LoaderComponent.ctorParameters = function () { return []; };
+    LoaderComponent.propDecorators = {
+        mobileView: [{ type: core.Input }]
+    };
+
+    var LoaderModule = /** @class */ (function () {
+        function LoaderModule() {
+        }
+        LoaderModule.forRoot = function () {
+            return { ngModule: LoaderModule, providers: [] };
+        };
+        return LoaderModule;
+    }());
+    LoaderModule.decorators = [
+        { type: core.NgModule, args: [{
+                    declarations: [LoaderComponent],
+                    imports: [common.CommonModule],
+                    exports: [LoaderComponent]
+                },] }
+    ];
+
+    /**
+     * Generated bundle index. Do not edit.
+     */
+
+    exports.LoaderComponent = LoaderComponent;
+    exports.LoaderModule = LoaderModule;
+
+    Object.defineProperty(exports, '__esModule', { value: true });
+
+})));
+//# sourceMappingURL=mis-crystal-design-system-loader.umd.js.map

package/bundles/mis-crystal-design-system-loader.umd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mis-crystal-design-system-loader.umd.js","sources":["../../../projects/mis-components/loader/loader.component.ts","../../../projects/mis-components/loader/loader.module.ts","../../../projects/mis-components/loader/mis-crystal-design-system-loader.ts"],"sourcesContent":["import {Component, Input, OnInit} from '@angular/core';\n\n@Component({\n  selector: 'mis-loader',\n  templateUrl: './loader.component.html',\n  styleUrls: ['./loader.component.scss']\n})\nexport class LoaderComponent implements OnInit{\n\n  /** Controls loader size */\n  @Input() mobileView: boolean = false\n\n  constructor() {\n  }\n  ngOnInit(){\n  }\n}\n","import { NgModule, ModuleWithProviders } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { LoaderComponent } from './loader.component';\n\n@NgModule({\n  declarations: [LoaderComponent],\n  imports: [CommonModule],\n  exports: [LoaderComponent]\n})\nexport class LoaderModule {\n  static forRoot(): ModuleWithProviders<LoaderModule> {\n    return { ngModule: LoaderModule, providers: [] };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["Component","Input","NgModule","CommonModule"],"mappings":";;;;;;;QAYE;;YAFS,eAAU,GAAY,KAAK,CAAA;SAGnC;QACD,kCAAQ,GAAR;SACC;;;;gBAbFA,cAAS,SAAC;oBACT,QAAQ,EAAE,YAAY;oBACtB,mFAAsC;;iBAEvC;;;;6BAIEC,UAAK;;;;QCAR;;QACS,oBAAO,GAAd;YACE,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC;SAClD;;;;gBARFC,aAAQ,SAAC;oBACR,YAAY,EAAE,CAAC,eAAe,CAAC;oBAC/B,OAAO,EAAE,CAACC,mBAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,eAAe,CAAC;iBAC3B;;;ICTD;;;;;;;;;;;;;"}

package/bundles/mis-crystal-design-system-loader.umd.min.js

@@ -0,0 +1,2 @@
+!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/loader",["exports","@angular/core","@angular/common"],o):o(((e="undefined"!=typeof globalThis?globalThis:e||self)["mis-crystal-design-system"]=e["mis-crystal-design-system"]||{},e["mis-crystal-design-system"].loader={}),e.ng.core,e.ng.common)}(this,(function(e,o,r){"use strict";var t=function(){function e(){this.mobileView=!1}return e.prototype.ngOnInit=function(){},e}();t.decorators=[{type:o.Component,args:[{selector:"mis-loader",template:'<div id="spinner" [ngClass]="{\n  \'mobile\': mobileView\n}"></div>\n',styles:["#spinner{-webkit-animation:frames 1s linear infinite;animation:frames 1s linear infinite;background:transparent;border-radius:100%;border:4px solid #e0e0e0;border-top-color:#6200ee;width:40px;height:40px;padding:0;position:absolute}@-webkit-keyframes frames{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes frames{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}.mobile{height:20px!important;width:20px!important;border:2px solid #e0e0e0!important;border-top-color:#6200ee!important}"]}]}],t.ctorParameters=function(){return[]},t.propDecorators={mobileView:[{type:o.Input}]};var n=function(){function e(){}return e.forRoot=function(){return{ngModule:e,providers:[]}},e}();n.decorators=[{type:o.NgModule,args:[{declarations:[t],imports:[r.CommonModule],exports:[t]}]}],e.LoaderComponent=t,e.LoaderModule=n,Object.defineProperty(e,"__esModule",{value:!0})}));
+//# sourceMappingURL=mis-crystal-design-system-loader.umd.min.js.map

package/bundles/mis-crystal-design-system-loader.umd.min.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../projects/mis-components/loader/loader.component.ts","../../../projects/mis-components/loader/loader.module.ts"],"names":["LoaderComponent","this","mobileView","prototype","ngOnInit","Component","args","selector","template","Input","LoaderModule","forRoot","ngModule","providers","NgModule","declarations","imports","CommonModule","exports"],"mappings":"mfAYE,SAAAA,IAFSC,KAAAC,YAAsB,SAI/BF,EAAAG,UAAAC,SAAA,sCAZDC,EAAAA,UAASC,KAAA,CAAC,CACTC,SAAU,aACVC,SAAA,6pBAMCC,EAAAA,0BCAH,SAAAC,YACSA,EAAAC,QAAP,WACE,MAAO,CAAEC,SAAUF,EAAcG,UAAW,8BAP/CC,EAAAA,SAAQR,KAAA,CAAC,CACRS,aAAc,CAACf,GACfgB,QAAS,CAACC,EAAAA,cACVC,QAAS,CAAClB","sourcesContent":["import {Component, Input, OnInit} from '@angular/core';\n\n@Component({\n  selector: 'mis-loader',\n  templateUrl: './loader.component.html',\n  styleUrls: ['./loader.component.scss']\n})\nexport class LoaderComponent implements OnInit{\n\n  /** Controls loader size */\n  @Input() mobileView: boolean = false\n\n  constructor() {\n  }\n  ngOnInit(){\n  }\n}\n","import { NgModule, ModuleWithProviders } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { LoaderComponent } from './loader.component';\n\n@NgModule({\n  declarations: [LoaderComponent],\n  imports: [CommonModule],\n  exports: [LoaderComponent]\n})\nexport class LoaderModule {\n  static forRoot(): ModuleWithProviders<LoaderModule> {\n    return { ngModule: LoaderModule, providers: [] };\n  }\n}\n"]}

package/bundles/mis-crystal-design-system-modal.umd.js

@@ -0,0 +1,165 @@
+(function (global, factory) {
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/core'), require('rxjs'), require('@angular/animations'), require('@angular/common')) :
+    typeof define === 'function' && define.amd ? define('mis-crystal-design-system/modal', ['exports', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/core', 'rxjs', '@angular/animations', '@angular/common'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global['mis-crystal-design-system'] = global['mis-crystal-design-system'] || {}, global['mis-crystal-design-system'].modal = {}), global.ng.cdk.overlay, global.ng.cdk.portal, global.ng.core, global.rxjs, global.ng.animations, global.ng.common));
+}(this, (function (exports, i1, portal, i0, rxjs, animations, common) { 'use strict';
+
+    /** @format */
+    var MODAL_DATA_VAR = new i0.InjectionToken("MISModalDataInjectionToken");
+
+    /** @format */
+    var ModalRef = /** @class */ (function () {
+        function ModalRef(overlay) {
+            this.overlay = overlay;
+            this.afterClosed$ = new rxjs.Subject();
+            this.afterClosed = this.afterClosed$.asObservable();
+        }
+        ModalRef.prototype.close = function (data) {
+            this.overlay.detach();
+            this.overlay.dispose();
+            this.afterClosed$.next(data);
+            this.afterClosed$.complete();
+        };
+        return ModalRef;
+    }());
+
+    var ModuleWrapperComponent = /** @class */ (function () {
+        function ModuleWrapperComponent() {
+        }
+        ModuleWrapperComponent.prototype.bindComponent = function (type, injector) {
+            this.initComponent(type, injector);
+        };
+        ModuleWrapperComponent.prototype.initComponent = function (type, injector) {
+            this.modalPortal = new portal.ComponentPortal(type, this.place, injector);
+        };
+        return ModuleWrapperComponent;
+    }());
+    ModuleWrapperComponent.decorators = [
+        { type: i0.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: [
+                        animations.trigger("slideInOut", [
+                            animations.transition(":enter", [
+                                animations.style({ transform: "translateY(-30%)", opacity: 0 }),
+                                animations.animate("200ms ease-out", animations.style({ transform: "translatey(0%)", opacity: 1 })),
+                            ]),
+                            animations.transition(":leave", [animations.animate("200ms ease-out", animations.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}"]
+                },] }
+    ];
+    ModuleWrapperComponent.ctorParameters = function () { return []; };
+    ModuleWrapperComponent.propDecorators = {
+        place: [{ type: i0.ViewChild, args: ["place", { static: false, read: i0.ViewContainerRef },] }]
+    };
+
+    var ModalService = /** @class */ (function () {
+        function ModalService(overlay, injector) {
+            this.overlay = overlay;
+            this.injector = injector;
+        }
+        ModalService.prototype.show = function (component, data, options) {
+            var positionStrategy = this.calculatePosition(options);
+            var _a = options || {}, width = _a.width, height = _a.height;
+            var config = new i1.OverlayConfig({
+                hasBackdrop: true,
+                positionStrategy: positionStrategy,
+                scrollStrategy: this.overlay.scrollStrategies.noop(),
+                width: width,
+                height: height,
+                panelClass: "mis-modal",
+                backdropClass: "mis-modal-overlay",
+            });
+            var overlayRef = this.overlay.create(config);
+            var modalRef = new ModalRef(overlayRef);
+            var injector = this.createInjector(modalRef, this.injector, data);
+            var portal$1 = new portal.ComponentPortal(ModuleWrapperComponent, null);
+            this.componentInstance = overlayRef.attach(portal$1);
+            if (options === null || options === void 0 ? void 0 : options.closeOnBackdropClick) {
+                overlayRef.backdropClick().subscribe(function () { return modalRef.close(); });
+            }
+            this.componentInstance.instance.bindComponent(component, injector);
+            return modalRef;
+        };
+        ModalService.prototype.createInjector = function (ref, inj, data) {
+            var injectorTokens = new WeakMap();
+            injectorTokens.set(ModalRef, ref);
+            injectorTokens.set(MODAL_DATA_VAR, data);
+            return new portal.PortalInjector(inj, injectorTokens);
+        };
+        ModalService.prototype.calculatePosition = function (options) {
+            var position = this.overlay.position().global().centerHorizontally().centerVertically();
+            if (options && screen.width > 600) {
+                if (options.top) {
+                    position.top(options.top);
+                }
+                if (options.left) {
+                    position.left(options.left);
+                }
+                if (options.right) {
+                    position.right(options.right);
+                }
+                if (options.bottom) {
+                    position.bottom(options.bottom);
+                }
+            }
+            return position;
+        };
+        return ModalService;
+    }());
+    ModalService.ɵprov = i0.ɵɵdefineInjectable({ factory: function ModalService_Factory() { return new ModalService(i0.ɵɵinject(i1.Overlay), i0.ɵɵinject(i0.INJECTOR)); }, token: ModalService, providedIn: "root" });
+    ModalService.decorators = [
+        { type: i0.Injectable, args: [{
+                    providedIn: "root",
+                },] }
+    ];
+    ModalService.ctorParameters = function () { return [
+        { type: i1.Overlay },
+        { type: i0.Injector }
+    ]; };
+
+    var ModalModule = /** @class */ (function () {
+        function ModalModule() {
+        }
+        ModalModule.forRoot = function () {
+            return {
+                ngModule: ModalModule,
+                providers: [ModalService],
+            };
+        };
+        ModalModule.forChild = function () {
+            return {
+                ngModule: ModalModule,
+                providers: [ModalService],
+            };
+        };
+        return ModalModule;
+    }());
+    ModalModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [ModuleWrapperComponent],
+                    imports: [
+                        common.CommonModule,
+                        i1.OverlayModule,
+                        portal.PortalModule
+                    ],
+                    entryComponents: [ModuleWrapperComponent]
+                },] }
+    ];
+
+    /**
+     * Generated bundle index. Do not edit.
+     */
+
+    exports.MODAL_DATA_VAR = MODAL_DATA_VAR;
+    exports.ModalModule = ModalModule;
+    exports.ModalRef = ModalRef;
+    exports.ModalService = ModalService;
+    exports.ɵa = ModuleWrapperComponent;
+
+    Object.defineProperty(exports, '__esModule', { value: true });
+
+})));
+//# sourceMappingURL=mis-crystal-design-system-modal.umd.js.map

package/bundles/mis-crystal-design-system-modal.umd.js.map

@@ -0,0 +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\n\n@NgModule({\n  declarations: [ModuleWrapperComponent],\n  imports: [\n    CommonModule,\n    OverlayModule, \n    PortalModule\n  ],\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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"}

package/bundles/mis-crystal-design-system-modal.umd.min.js

@@ -0,0 +1,2 @@
+!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,r,a,i){"use strict";var s=new n.InjectionToken("MISModalDataInjectionToken"),l=function(){function e(e){this.overlay=e,this.afterClosed$=new r.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:n.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:n.ViewChild,args:["place",{static:!1,read:n.ViewContainerRef}]}]};var d=function(){function e(e,t){this.overlay=e,this.injector=t}return e.prototype.show=function(e,n,r){var a=this.calculatePosition(r),i=r||{},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,n),f=new o.ComponentPortal(c,null);return this.componentInstance=u.attach(f),(null==r?void 0:r.closeOnBackdropClick)&&u.backdropClick().subscribe((function(){return m.close()})),this.componentInstance.instance.bindComponent(e,y),m},e.prototype.createInjector=function(e,t,n){var r=new WeakMap;return r.set(l,e),r.set(s,n),new o.PortalInjector(t,r)},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=n.ɵɵdefineInjectable({factory:function(){return new d(n.ɵɵinject(t.Overlay),n.ɵɵinject(n.INJECTOR))},token:d,providedIn:"root"}),d.decorators=[{type:n.Injectable,args:[{providedIn:"root"}]}],d.ctorParameters=function(){return[{type:t.Overlay},{type:n.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:n.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})}));
+//# sourceMappingURL=mis-crystal-design-system-modal.umd.min.js.map

package/bundles/mis-crystal-design-system-modal.umd.min.js.map

@@ -0,0 +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","PortalInjector","position","global","centerHorizontally","centerVertically","screen","top","left","right","bottom","Injectable","providedIn","Overlay","Injector","ModalModule","forRoot","ngModule","providers","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, 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\n\n@NgModule({\n  declarations: [ModuleWrapperComponent],\n  imports: [\n    CommonModule,\n    OverlayModule, \n    PortalModule\n  ],\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"]}