mis-crystal-design-system 18.0.24 → 18.1.0-signal-test

package/fesm2022/mis-crystal-design-system-slider.mjs

@@ -1,48 +1,37 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
-import * as i1 from '@angular/forms';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { input, EventEmitter, signal, Component, ChangeDetectionStrategy, Output, NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
 class SliderComponent {
-    constructor(formBuilder) {
-        this.formBuilder = formBuilder;
-        this.min = 0;
-        this.max = 100;
-        this.value = 0;
+    constructor() {
+        this.min = input(0);
+        this.max = input(100);
+        this.value = input(0);
         this.valueChange = new EventEmitter();
-    }
-    ngOnInit() {
-        this.sliderForm = this.formBuilder.group({
-            sliderFormControl: [this.value]
-        });
+        // Internal signal for the current value
+        this.currentValue = signal(0);
+        // Initialize the current value with the input value
+        this.currentValue.set(this.value());
     }
     onInputChange(value) {
-        this.value = value;
-        this.sliderForm.patchValue({ sliderFormControl: value });
-        this.valueChange.emit(this.value);
+        const numValue = Number(value);
+        this.currentValue.set(numValue);
+        this.valueChange.emit(numValue);
     }
-    static { this.ɵfac = function SliderComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SliderComponent)(i0.ɵɵdirectiveInject(i1.UntypedFormBuilder)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SliderComponent, selectors: [["mis-slider"]], inputs: { min: "min", max: "max", value: "value" }, outputs: { valueChange: "valueChange" }, decls: 3, vars: 3, consts: [[3, "formGroup"], [1, "slider"], ["type", "range", "formControlName", "sliderFormControl", 3, "input", "min", "max"]], template: function SliderComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "form", 0)(1, "div", 1)(2, "input", 2);
-            i0.ɵɵlistener("input", function SliderComponent_Template_input_input_2_listener($event) { return ctx.onInputChange($event.target.value); });
-            i0.ɵɵelementEnd()()();
+    static { this.ɵfac = function SliderComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SliderComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SliderComponent, selectors: [["mis-slider"]], inputs: { min: [1, "min"], max: [1, "max"], value: [1, "value"] }, outputs: { valueChange: "valueChange" }, decls: 2, vars: 3, consts: [[1, "slider"], ["type", "range", 3, "input", "min", "max", "value"]], template: function SliderComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "input", 1);
+            i0.ɵɵlistener("input", function SliderComponent_Template_input_input_1_listener($event) { return ctx.onInputChange($event.target.value); });
+            i0.ɵɵelementEnd()();
         } if (rf & 2) {
-            i0.ɵɵproperty("formGroup", ctx.sliderForm);
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("min", ctx.min)("max", ctx.max);
-        } }, dependencies: [i1.ɵNgNoValidate, i1.DefaultValueAccessor, i1.RangeValueAccessor, i1.NgControlStatus, i1.NgControlStatusGroup, i1.FormGroupDirective, i1.FormControlName], styles: [".slider[_ngcontent-%COMP%]{width:100%;display:flex;align-items:center}.slider[_ngcontent-%COMP%]   input[type=range][_ngcontent-%COMP%]{width:100%;-webkit-appearance:none;appearance:none;height:8px;background:#cbddfb;outline:none;border-radius:5px}.slider[_ngcontent-%COMP%]   input[type=range][_ngcontent-%COMP%]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;background:#0937b2;cursor:pointer;border-radius:50%}.slider[_ngcontent-%COMP%]   input[type=range][_ngcontent-%COMP%]::-moz-range-thumb{width:15px;height:15px;background:#0937b2;cursor:pointer;border-radius:50%}.slider[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{margin-left:10px}"] }); }
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("min", ctx.min())("max", ctx.max())("value", ctx.currentValue());
+        } }, styles: [".slider[_ngcontent-%COMP%]{width:100%;display:flex;align-items:center}.slider[_ngcontent-%COMP%]   input[type=range][_ngcontent-%COMP%]{width:100%;-webkit-appearance:none;appearance:none;height:8px;background:#cbddfb;outline:none;border-radius:5px}.slider[_ngcontent-%COMP%]   input[type=range][_ngcontent-%COMP%]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;background:#0937b2;cursor:pointer;border-radius:50%}.slider[_ngcontent-%COMP%]   input[type=range][_ngcontent-%COMP%]::-moz-range-thumb{width:15px;height:15px;background:#0937b2;cursor:pointer;border-radius:50%}.slider[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{margin-left:10px}"], changeDetection: 0 }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SliderComponent, [{
         type: Component,
-        args: [{ selector: 'mis-slider', template: "<form [formGroup]=\"sliderForm\">\n    <div class=\"slider\">\n      <input type=\"range\" [min]=\"min\" [max]=\"max\" formControlName=\"sliderFormControl\" (input)=\"onInputChange($event.target.value)\" />\n    </div>\n  </form>\n  \n\n  ", styles: [".slider{width:100%;display:flex;align-items:center}.slider input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:8px;background:#cbddfb;outline:none;border-radius:5px}.slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;background:#0937b2;cursor:pointer;border-radius:50%}.slider input[type=range]::-moz-range-thumb{width:15px;height:15px;background:#0937b2;cursor:pointer;border-radius:50%}.slider span{margin-left:10px}\n"] }]
-    }], () => [{ type: i1.UntypedFormBuilder }], { min: [{
-            type: Input
-        }], max: [{
-            type: Input
-        }], value: [{
-            type: Input
-        }], valueChange: [{
+        args: [{ selector: 'mis-slider', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"slider\">\n  <input \n    type=\"range\" \n    [min]=\"min()\" \n    [max]=\"max()\" \n    [value]=\"currentValue()\"\n    (input)=\"onInputChange($event.target.value)\" />\n</div>\n  \n\n  ", styles: [".slider{width:100%;display:flex;align-items:center}.slider input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:8px;background:#cbddfb;outline:none;border-radius:5px}.slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;background:#0937b2;cursor:pointer;border-radius:50%}.slider input[type=range]::-moz-range-thumb{width:15px;height:15px;background:#0937b2;cursor:pointer;border-radius:50%}.slider span{margin-left:10px}\n"] }]
+    }], () => [], { valueChange: [{
             type: Output
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SliderComponent, { className: "SliderComponent" }); })();
@@ -50,9 +39,7 @@ class SliderComponent {
 class SliderModule {
     static { this.ɵfac = function SliderModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SliderModule)(); }; }
     static { this.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: SliderModule }); }
-    static { this.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule] }); }
+    static { this.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SliderModule, [{
         type: NgModule,
@@ -61,16 +48,12 @@ class SliderModule {
                     SliderComponent
                 ],
                 imports: [
-                    CommonModule,
-                    FormsModule,
-                    ReactiveFormsModule
+                    CommonModule
                 ],
                 exports: [SliderComponent]
             }]
     }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(SliderModule, { declarations: [SliderComponent], imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule], exports: [SliderComponent] }); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(SliderModule, { declarations: [SliderComponent], imports: [CommonModule], exports: [SliderComponent] }); })();
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/mis-crystal-design-system-slider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mis-crystal-design-system-slider.mjs","sources":["../../../projects/mis-components/slider/slider.component.ts","../../../projects/mis-components/slider/slider.component.html","../../../projects/mis-components/slider/slider.module.ts","../../../projects/mis-components/slider/mis-crystal-design-system-slider.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';\n\n@Component({\n  selector: 'mis-slider',\n  templateUrl: './slider.component.html',\n  styleUrls: ['./slider.component.css']\n})\nexport class SliderComponent implements OnInit {\n\n  @Input() min?:number = 0;\n  @Input() max?:number = 100;\n  @Input() value: number = 0;\n  @Output() valueChange = new EventEmitter<number>()\n\n  sliderForm: UntypedFormGroup;\n\n  constructor(private formBuilder: UntypedFormBuilder) { }\n\n  ngOnInit(): void {\n    this.sliderForm = this.formBuilder.group({\n      sliderFormControl: [this.value]\n    });\n  }\n\n  onInputChange(value: number) {\n    this.value = value;\n    this.sliderForm.patchValue({sliderFormControl: value})\n    this.valueChange.emit(this.value);\n  }\n\n}\n","<form [formGroup]=\"sliderForm\">\n    <div class=\"slider\">\n      <input type=\"range\" [min]=\"min\" [max]=\"max\" formControlName=\"sliderFormControl\" (input)=\"onInputChange($event.target.value)\" />\n    </div>\n  </form>\n  \n\n  ","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SliderComponent } from './slider.component';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\n\n\n\n@NgModule({\n  declarations: [\n    SliderComponent\n  ],\n  imports: [\n    CommonModule,\n    FormsModule,\n    ReactiveFormsModule\n  ],\n  exports: [SliderComponent]\n})\nexport class SliderModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"mis-crystal-design-system-slider.mjs","sources":["../../../projects/mis-components/slider/slider.component.ts","../../../projects/mis-components/slider/slider.component.html","../../../projects/mis-components/slider/slider.module.ts","../../../projects/mis-components/slider/mis-crystal-design-system-slider.ts"],"sourcesContent":["import { Component, EventEmitter, input, Output, ChangeDetectionStrategy, signal, WritableSignal } from '@angular/core';\n\n@Component({\n  selector: 'mis-slider',\n  templateUrl: './slider.component.html',\n  styleUrls: ['./slider.component.css'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SliderComponent {\n  min = input<number>(0);\n  max = input<number>(100);\n  value = input<number>(0);\n  @Output() valueChange = new EventEmitter<number>();\n\n  // Internal signal for the current value\n  currentValue: WritableSignal<number> = signal(0);\n\n  constructor() {\n    // Initialize the current value with the input value\n    this.currentValue.set(this.value());\n  }\n\n  onInputChange(value: number) {\n    const numValue = Number(value);\n    this.currentValue.set(numValue);\n    this.valueChange.emit(numValue);\n  }\n}\n","<div class=\"slider\">\n  <input \n    type=\"range\" \n    [min]=\"min()\" \n    [max]=\"max()\" \n    [value]=\"currentValue()\"\n    (input)=\"onInputChange($event.target.value)\" />\n</div>\n  \n\n  ","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SliderComponent } from './slider.component';\n\n@NgModule({\n  declarations: [\n    SliderComponent\n  ],\n  imports: [\n    CommonModule\n  ],\n  exports: [SliderComponent]\n})\nexport class SliderModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/mis-crystal-design-system-snackbar.mjs

@@ -2,7 +2,7 @@ import * as i1$1 from '@angular/cdk/overlay';
 import { OverlayConfig } from '@angular/cdk/overlay';
 import { ComponentPortal } from '@angular/cdk/portal';
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, Input, Output, Injectable, NgModule } from '@angular/core';
+import { signal, EventEmitter, Component, ChangeDetectionStrategy, Output, Injectable, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 
@@ -10,8 +10,9 @@ const _c0 = ["*"];
 function SnackbarComponent_div_1_img_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "img", 7);
 } if (rf & 2) {
+    let tmp_2_0;
     const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("src", ctx_r0.config.iconUrl, i0.ɵɵsanitizeUrl);
+    i0.ɵɵproperty("src", (tmp_2_0 = ctx_r0.config()) == null ? null : tmp_2_0.iconUrl, i0.ɵɵsanitizeUrl);
 } }
 function SnackbarComponent_div_1_div_4_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
@@ -20,9 +21,10 @@ function SnackbarComponent_div_1_div_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
+    let tmp_2_0;
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r0.config.actionString);
+    i0.ɵɵtextInterpolate((tmp_2_0 = ctx_r0.config()) == null ? null : tmp_2_0.actionString);
 } }
 function SnackbarComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 3)(1, "span", 4);
@@ -32,13 +34,16 @@ function SnackbarComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtemplate(4, SnackbarComponent_div_1_div_4_Template, 3, 1, "div", 6);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
+    let tmp_1_0;
+    let tmp_2_0;
+    let tmp_3_0;
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", ctx_r0.config.iconUrl);
+    i0.ɵɵproperty("ngIf", (tmp_1_0 = ctx_r0.config()) == null ? null : tmp_1_0.iconUrl);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", ctx_r0.config.message, " ");
+    i0.ɵɵtextInterpolate1(" ", (tmp_2_0 = ctx_r0.config()) == null ? null : tmp_2_0.message, " ");
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r0.config.actionString);
+    i0.ɵɵproperty("ngIf", (tmp_3_0 = ctx_r0.config()) == null ? null : tmp_3_0.actionString);
 } }
 function SnackbarComponent_div_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 10);
@@ -47,30 +52,31 @@ function SnackbarComponent_div_2_Template(rf, ctx) { if (rf & 1) {
 } }
 class SnackbarComponent {
     constructor() {
+        this.config = signal(undefined);
         this.triggerAction = new EventEmitter();
     }
     onActionClick() {
         this.triggerAction.emit();
     }
     static { this.ɵfac = function SnackbarComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SnackbarComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SnackbarComponent, selectors: [["app-snackbar"]], inputs: { config: "config" }, outputs: { triggerAction: "triggerAction" }, ngContentSelectors: _c0, decls: 3, vars: 2, consts: [[1, "snackbar-container"], ["class", "messages", 4, "ngIf"], ["class", "component-container", 4, "ngIf"], [1, "messages"], [1, "message"], ["alt", "", 3, "src", 4, "ngIf"], ["class", "snackbar-action", 4, "ngIf"], ["alt", "", 3, "src"], [1, "snackbar-action"], [3, "click"], [1, "component-container"]], template: function SnackbarComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SnackbarComponent, selectors: [["app-snackbar"]], outputs: { triggerAction: "triggerAction" }, ngContentSelectors: _c0, decls: 3, vars: 2, consts: [[1, "snackbar-container"], ["class", "messages", 4, "ngIf"], ["class", "component-container", 4, "ngIf"], [1, "messages"], [1, "message"], ["alt", "", 3, "src", 4, "ngIf"], ["class", "snackbar-action", 4, "ngIf"], ["alt", "", 3, "src"], [1, "snackbar-action"], [3, "click"], [1, "component-container"]], template: function SnackbarComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵtemplate(1, SnackbarComponent_div_1_Template, 5, 3, "div", 1)(2, SnackbarComponent_div_2_Template, 2, 0, "div", 2);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
+            let tmp_0_0;
+            let tmp_1_0;
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", !ctx.config.hasComponent);
+            i0.ɵɵproperty("ngIf", !((tmp_0_0 = ctx.config()) == null ? null : tmp_0_0.hasComponent));
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.config.hasComponent);
-        } }, dependencies: [i1.NgIf], styles: [".snackbar-container[_ngcontent-%COMP%]{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background-color:#181f33;color:#fff;border-radius:8px;padding:8px 12px;max-width:400px;width:90%;z-index:1000;box-shadow:0 4px 8px #0003}.messages[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:space-between}.message[_ngcontent-%COMP%]{flex:1;padding-right:10px;font-size:16px;font-weight:700}.snackbar-action[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{background-color:#181f33;color:#fff;border:none;border-radius:4px;padding:8px 16px;cursor:pointer;font-size:16px!important;transition:background-color .3s ease}.snackbar-action[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover{background-color:#0056b3}.component-container[_ngcontent-%COMP%]{margin-top:10px}@media (max-width: 768px){.snackbar-container[_ngcontent-%COMP%]{left:10px;right:10px;transform:none;width:auto;max-width:none}}"] }); }
+            i0.ɵɵproperty("ngIf", (tmp_1_0 = ctx.config()) == null ? null : tmp_1_0.hasComponent);
+        } }, dependencies: [i1.NgIf], styles: [".snackbar-container[_ngcontent-%COMP%]{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background-color:#181f33;color:#fff;border-radius:8px;padding:8px 12px;max-width:400px;width:90%;z-index:1000;box-shadow:0 4px 8px #0003}.messages[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:space-between}.message[_ngcontent-%COMP%]{flex:1;padding-right:10px;font-size:16px;font-weight:700}.snackbar-action[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{background-color:#181f33;color:#fff;border:none;border-radius:4px;padding:8px 16px;cursor:pointer;font-size:16px!important;transition:background-color .3s ease}.snackbar-action[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover{background-color:#0056b3}.component-container[_ngcontent-%COMP%]{margin-top:10px}@media (max-width: 768px){.snackbar-container[_ngcontent-%COMP%]{left:10px;right:10px;transform:none;width:auto;max-width:none}}"], changeDetection: 0 }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SnackbarComponent, [{
         type: Component,
-        args: [{ selector: 'app-snackbar', template: "<div class=\"snackbar-container\">\n  <div class=\"messages\" *ngIf=\"!config.hasComponent\">\n    <span class=\"message\">\n      <img *ngIf=\"config.iconUrl\" [src]=\"config.iconUrl\" alt=\"\">\n      {{ config.message }}\n    </span>\n    <div class=\"snackbar-action\" *ngIf=\"config.actionString\">\n      <button (click)=\"onActionClick()\">{{ config.actionString }}</button>\n    </div>\n  </div>\n  <div class=\"component-container\" *ngIf=\"config.hasComponent\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".snackbar-container{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background-color:#181f33;color:#fff;border-radius:8px;padding:8px 12px;max-width:400px;width:90%;z-index:1000;box-shadow:0 4px 8px #0003}.messages{display:flex;align-items:center;justify-content:space-between}.message{flex:1;padding-right:10px;font-size:16px;font-weight:700}.snackbar-action button{background-color:#181f33;color:#fff;border:none;border-radius:4px;padding:8px 16px;cursor:pointer;font-size:16px!important;transition:background-color .3s ease}.snackbar-action button:hover{background-color:#0056b3}.component-container{margin-top:10px}@media (max-width: 768px){.snackbar-container{left:10px;right:10px;transform:none;width:auto;max-width:none}}\n"] }]
-    }], () => [], { config: [{
-            type: Input
-        }], triggerAction: [{
+        args: [{ selector: 'app-snackbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"snackbar-container\">\n  <div class=\"messages\" *ngIf=\"!config()?.hasComponent\">\n    <span class=\"message\">\n      <img *ngIf=\"config()?.iconUrl\" [src]=\"config()?.iconUrl\" alt=\"\">\n      {{ config()?.message }}\n    </span>\n    <div class=\"snackbar-action\" *ngIf=\"config()?.actionString\">\n      <button (click)=\"onActionClick()\">{{ config()?.actionString }}</button>\n    </div>\n  </div>\n  <div class=\"component-container\" *ngIf=\"config()?.hasComponent\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".snackbar-container{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background-color:#181f33;color:#fff;border-radius:8px;padding:8px 12px;max-width:400px;width:90%;z-index:1000;box-shadow:0 4px 8px #0003}.messages{display:flex;align-items:center;justify-content:space-between}.message{flex:1;padding-right:10px;font-size:16px;font-weight:700}.snackbar-action button{background-color:#181f33;color:#fff;border:none;border-radius:4px;padding:8px 16px;cursor:pointer;font-size:16px!important;transition:background-color .3s ease}.snackbar-action button:hover{background-color:#0056b3}.component-container{margin-top:10px}@media (max-width: 768px){.snackbar-container{left:10px;right:10px;transform:none;width:auto;max-width:none}}\n"] }]
+    }], () => [], { triggerAction: [{
             type: Output
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SnackbarComponent, { className: "SnackbarComponent" }); })();
@@ -88,7 +94,8 @@ class SnackbarService {
         this.snackbarRef = this.overlay.create(overlayConfig);
         const snackbarPortal = new ComponentPortal(SnackbarComponent);
         const componentRef = this.snackbarRef.attach(snackbarPortal);
-        //   componentRef.instance.config = config;
+        // Set the config using the writable signal
+        componentRef.instance.config.set(config);
         config.duration = config.duration || 3000;
         setTimeout(() => {
             this.closeSnackbar();

package/fesm2022/mis-crystal-design-system-snackbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mis-crystal-design-system-snackbar.mjs","sources":["../../../projects/mis-components/snackbar/snackbar/snackbar.component.html","../../../projects/mis-components/snackbar/snackbar/snackbar.component.ts","../../../projects/mis-components/snackbar/snackbar.service.ts","../../../projects/mis-components/snackbar/snackbar.module.ts","../../../projects/mis-components/snackbar/mis-crystal-design-system-snackbar.ts"],"sourcesContent":["<div class=\"snackbar-container\">\n  <div class=\"messages\" *ngIf=\"!config.hasComponent\">\n    <span class=\"message\">\n      <img *ngIf=\"config.iconUrl\" [src]=\"config.iconUrl\" alt=\"\">\n      {{ config.message }}\n    </span>\n    <div class=\"snackbar-action\" *ngIf=\"config.actionString\">\n      <button (click)=\"onActionClick()\">{{ config.actionString }}</button>\n    </div>\n  </div>\n  <div class=\"component-container\" *ngIf=\"config.hasComponent\">\n    <ng-content></ng-content>\n  </div>\n</div>\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { ISnackBarConfig } from '../snackbar.service';\n\n@Component({\n  selector: 'app-snackbar',\n  templateUrl: './snackbar.component.html',\n  styleUrls: ['./snackbar.component.css']\n})\nexport class SnackbarComponent {\n  @Input() config: ISnackBarConfig;\n  @Output() triggerAction = new EventEmitter<void>();\n  constructor(){}\n  onActionClick(): void {\n    this.triggerAction.emit();\n  }\n}\n","export interface ISnackBarConfig {\n  message: string;\n  actionString: string;\n  hasComponent: boolean;\n  iconUrl?: string;\n  component?: ComponentRef<any>;\n  duration?: number;\n  onActionClick?: () => void;\n}\nimport { Overlay, OverlayConfig, OverlayRef } from \"@angular/cdk/overlay\";\nimport { ComponentPortal } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable } from \"@angular/core\"; // Assuming you have defined ISnackBarConfig interface\nimport { SnackbarComponent } from \"./snackbar/snackbar.component\";\n\n@Injectable({\n  providedIn: \"root\"\n})\nexport class SnackbarService {\n  config: ISnackBarConfig;\n  private snackbarRef: OverlayRef;\n\n  constructor(private overlay: Overlay) {}\n\n  openSnackbar(config: ISnackBarConfig): void {\n    this.config = config;\n    const overlayConfig = new OverlayConfig({\n      hasBackdrop: false,\n      positionStrategy: this.overlay.position().global().centerHorizontally().bottom(\"48px\")\n    });\n\n    this.snackbarRef = this.overlay.create(overlayConfig);\n\n    const snackbarPortal = new ComponentPortal(SnackbarComponent);\n    const componentRef = this.snackbarRef.attach(snackbarPortal);\n\n    //   componentRef.instance.config = config;\n\n    config.duration = config.duration || 3000;\n    setTimeout(() => {\n      this.closeSnackbar();\n    }, config.duration);\n\n    componentRef.instance.triggerAction.subscribe(() => {\n      if (config.onActionClick) {\n        config.onActionClick();\n      }\n      this.closeSnackbar();\n    });\n  }\n\n  closeSnackbar(): void {\n    if (this.snackbarRef) {\n      this.snackbarRef.dispose();\n      this.snackbarRef = null;\n    }\n  }\n}\n","import { ModuleWithProviders, NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SnackbarComponent } from './snackbar/snackbar.component';\nimport { SnackbarService } from './snackbar.service';\n\n\n\n@NgModule({\n    declarations: [\n        SnackbarComponent\n    ],\n    imports: [\n        CommonModule\n    ],\n    exports: [SnackbarComponent]\n})\nexport class SnackbarModule {\n  static forRoot(): ModuleWithProviders<SnackbarModule> {\n    return {\n      ngModule: SnackbarModule,\n      providers: [SnackbarService]\n    };\n  }\n\n  static forChild(): ModuleWithProviders<SnackbarModule> {\n    return {\n      ngModule: SnackbarModule,\n      providers: [ SnackbarService]\n    };\n  }\n }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1"],"mappings":"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"}
+{"version":3,"file":"mis-crystal-design-system-snackbar.mjs","sources":["../../../projects/mis-components/snackbar/snackbar/snackbar.component.html","../../../projects/mis-components/snackbar/snackbar/snackbar.component.ts","../../../projects/mis-components/snackbar/snackbar.service.ts","../../../projects/mis-components/snackbar/snackbar.module.ts","../../../projects/mis-components/snackbar/mis-crystal-design-system-snackbar.ts"],"sourcesContent":["<div class=\"snackbar-container\">\n  <div class=\"messages\" *ngIf=\"!config()?.hasComponent\">\n    <span class=\"message\">\n      <img *ngIf=\"config()?.iconUrl\" [src]=\"config()?.iconUrl\" alt=\"\">\n      {{ config()?.message }}\n    </span>\n    <div class=\"snackbar-action\" *ngIf=\"config()?.actionString\">\n      <button (click)=\"onActionClick()\">{{ config()?.actionString }}</button>\n    </div>\n  </div>\n  <div class=\"component-container\" *ngIf=\"config()?.hasComponent\">\n    <ng-content></ng-content>\n  </div>\n</div>\n","import { Component, EventEmitter, Output, ChangeDetectionStrategy, signal, WritableSignal } from '@angular/core';\nimport { ISnackBarConfig } from '../snackbar.service';\n\n@Component({\n  selector: 'app-snackbar',\n  templateUrl: './snackbar.component.html',\n  styleUrls: ['./snackbar.component.css'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SnackbarComponent {\n  config: WritableSignal<ISnackBarConfig | undefined> = signal(undefined);\n  @Output() triggerAction = new EventEmitter<void>();\n  \n  constructor(){}\n  \n  onActionClick(): void {\n    this.triggerAction.emit();\n  }\n}\n","export interface ISnackBarConfig {\n  message: string;\n  actionString: string;\n  hasComponent: boolean;\n  iconUrl?: string;\n  component?: ComponentRef<any>;\n  duration?: number;\n  onActionClick?: () => void;\n}\nimport { Overlay, OverlayConfig, OverlayRef } from \"@angular/cdk/overlay\";\nimport { ComponentPortal } from \"@angular/cdk/portal\";\nimport { ComponentRef, Injectable } from \"@angular/core\"; // Assuming you have defined ISnackBarConfig interface\nimport { SnackbarComponent } from \"./snackbar/snackbar.component\";\n\n@Injectable({\n  providedIn: \"root\"\n})\nexport class SnackbarService {\n  config: ISnackBarConfig;\n  private snackbarRef: OverlayRef;\n\n  constructor(private overlay: Overlay) {}\n\n  openSnackbar(config: ISnackBarConfig): void {\n    this.config = config;\n    const overlayConfig = new OverlayConfig({\n      hasBackdrop: false,\n      positionStrategy: this.overlay.position().global().centerHorizontally().bottom(\"48px\")\n    });\n\n    this.snackbarRef = this.overlay.create(overlayConfig);\n\n    const snackbarPortal = new ComponentPortal(SnackbarComponent);\n    const componentRef = this.snackbarRef.attach(snackbarPortal);\n\n    // Set the config using the writable signal\n    componentRef.instance.config.set(config);\n\n    config.duration = config.duration || 3000;\n    setTimeout(() => {\n      this.closeSnackbar();\n    }, config.duration);\n\n    componentRef.instance.triggerAction.subscribe(() => {\n      if (config.onActionClick) {\n        config.onActionClick();\n      }\n      this.closeSnackbar();\n    });\n  }\n\n  closeSnackbar(): void {\n    if (this.snackbarRef) {\n      this.snackbarRef.dispose();\n      this.snackbarRef = null;\n    }\n  }\n}\n","import { ModuleWithProviders, NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SnackbarComponent } from './snackbar/snackbar.component';\nimport { SnackbarService } from './snackbar.service';\n\n\n\n@NgModule({\n    declarations: [\n        SnackbarComponent\n    ],\n    imports: [\n        CommonModule\n    ],\n    exports: [SnackbarComponent]\n})\nexport class SnackbarModule {\n  static forRoot(): ModuleWithProviders<SnackbarModule> {\n    return {\n      ngModule: SnackbarModule,\n      providers: [SnackbarService]\n    };\n  }\n\n  static forChild(): ModuleWithProviders<SnackbarModule> {\n    return {\n      ngModule: SnackbarModule,\n      providers: [ SnackbarService]\n    };\n  }\n }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1"],"mappings":"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"}