inugami-ng 0.0.11 → 0.0.12

package/fesm2022/inugami-ng-components-inu-svg-switzerland.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
-import { input, output, viewChild, computed, signal, effect, Component } from '@angular/core';
-import { SVG_MATH, SVG_BUILDER, SVG_TRANSFORM } from 'inugami-ng/services';
+import { input, model, output, viewChild, computed, signal, effect, Component } from '@angular/core';
+import { GET_COLOR, COMPUTE_PERCENT, COLORS_MATLAB, SVG_MATH, SVG_BUILDER, SVG_TRANSFORM } from 'inugami-ng/services';
 
 const SVG_SWITZERLAND_COLORED = (selectItem) => {
     return {
@@ -39,27 +39,14 @@ const SVG_SWITZERLAND_LEVEL_MONOCHROME_RED = (selectItem) => {
 const SVG_SWITZERLAND_LEVEL_MONOCHROME_GREEN = (selectItem) => {
     return SVG_SWITZERLAND_LEVEL_MONOCHROME_GENERATOR(selectItem, 100, 0, 10);
 };
-const SVG_SWITZERLAND_LEVEL_COLOR_10 = (selectItem) => {
-    return SVG_SWITZERLAND_LEVEL_COLOR_GENERATOR(selectItem, 0, 10);
-};
 const SVG_SWITZERLAND_LEVEL_COLOR_100 = (selectItem) => {
     return SVG_SWITZERLAND_LEVEL_COLOR_GENERATOR(selectItem, 0, 100);
 };
-const SVG_SWITZERLAND_LEVEL_COLOR_GENERATOR = (selectItem, min, max) => {
-    let value = Number(selectItem.value) || 0;
-    if (value < min) {
-        value = min;
-    }
-    if (value > max) {
-        value = max;
-    }
-    const range = max - min;
-    const percentage = range <= 0 ? 0 : Math.min(Math.max(((value - min) / range) * 100, 0), 100);
-    const colorIndex = Math.round((percentage * 0.75) * 356);
-    const saturation = Math.round(percentage);
+const SVG_SWITZERLAND_LEVEL_COLOR_GENERATOR = (selectItem, min, max, colors) => {
+    const color = GET_COLOR(COMPUTE_PERCENT(Number(selectItem.value) || 0, min, max), colors ? colors : COLORS_MATLAB);
     return {
-        styleclass: `monochrome-level`,
-        style: `fill:hsl(${colorIndex} ${saturation}% 50% / 1);`
+        styleclass: `color-level`,
+        style: `fill:${color};`
     };
 };
 
@@ -67,16 +54,25 @@ class InuSvgSwitzerland {
     //==================================================================================================================
     // ATTRIBUTES
     //==================================================================================================================
-    styleclass = input('', ...(ngDevMode ? [{ debugName: "styleclass" }] : []));
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-    valid = input(true, ...(ngDevMode ? [{ debugName: "valid" }] : []));
     actionHandler = input(undefined, ...(ngDevMode ? [{ debugName: "actionHandler" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    formValue = model([], ...(ngDevMode ? [{ debugName: "formValue" }] : []));
+    matcher = input(...(ngDevMode ? [undefined, { debugName: "matcher" }] : []));
     styleGenerator = input(undefined, ...(ngDevMode ? [{ debugName: "styleGenerator" }] : []));
+    styleclass = input('', ...(ngDevMode ? [{ debugName: "styleclass" }] : []));
+    valid = input(true, ...(ngDevMode ? [{ debugName: "valid" }] : []));
+    value = model([], ...(ngDevMode ? [{ debugName: "value" }] : []));
+    valueExtractor = input(undefined, ...(ngDevMode ? [{ debugName: "valueExtractor" }] : []));
     //
     selected = output();
+    hover = output();
+    leave = output();
+    changed = output();
     //
     component = viewChild('component', ...(ngDevMode ? [{ debugName: "component" }] : []));
     container = viewChild('container', ...(ngDevMode ? [{ debugName: "container" }] : []));
+    onModelChange = () => {
+    };
     _styleClass = computed(() => {
         return [
             'inu-svg',
@@ -100,7 +96,6 @@ class InuSvgSwitzerland {
     //==================================================================================================================
     constructor() {
         effect(() => {
-            console.log('effect>>>');
             this.initStyleGenerator();
             this.updateValues();
         });
@@ -113,6 +108,7 @@ class InuSvgSwitzerland {
             this.resolveParentSize(component, container);
             this.initializeLayout(container);
             this.resize();
+            this.initValues(this.value());
             this.updateValues();
         }
     }
@@ -322,9 +318,13 @@ class InuSvgSwitzerland {
             result.onmousedown = (mouseEvent) => mouseEvent.preventDefault();
             result.onclick = (mouseEvent) => this.onClick(canton, result, mouseEvent);
             result.ondblclick = (mouseEvent) => this.ondblclick(canton, result, mouseEvent);
+            result.ontouchend = (toucheEvent) => this.ontouchend(canton, result, toucheEvent);
+            result.onmouseenter = (mouseEvent) => this.onHover(canton, mouseEvent);
+            result.onmouseleave = (mouseEvent) => this.onMouseLeave(canton, mouseEvent);
             this.cantons[canton] = {
                 name: canton,
                 node: result,
+                lastTap: 0,
                 selectItem: {
                     id: canton,
                     title: canton
@@ -336,12 +336,47 @@ class InuSvgSwitzerland {
     //==================================================================================================================
     // ACTIONS
     //==================================================================================================================
+    initValues(values) {
+        if (values.length == 0) {
+            return;
+        }
+        for (let value of values) {
+            const matcher = this.matcher();
+            const cantons = Object.keys(this.cantons);
+            for (let cantonName of cantons) {
+                const canton = this.cantons[cantonName];
+                const selectItem = this.extractMatchValue(canton, value, matcher);
+                if (selectItem) {
+                    canton.selectItem = selectItem;
+                }
+            }
+        }
+    }
+    extractMatchValue(canton, value, matcher) {
+        if (typeof value == 'string' && canton.name === value) {
+            return {
+                selected: true,
+                value: value
+            };
+        }
+        else if (matcher) {
+            return matcher(canton.selectItem, value);
+        }
+        return undefined;
+    }
     updateValues() {
+        const extractor = this.valueExtractor();
+        const valueExtractor = extractor ? extractor : (v) => v?.value;
         const styleGenerator = this._styleGenerator();
         const cantons = Object.keys(this.cantons);
         for (let cantonName of cantons) {
             const canton = this.cantons[cantonName];
-            const style = styleGenerator(canton.selectItem);
+            const style = styleGenerator({
+                id: canton.selectItem.id,
+                selected: canton.selectItem.selected,
+                title: canton.selectItem.title,
+                value: valueExtractor(canton.selectItem)
+            });
             if (style?.style) {
                 canton.node.setAttribute('style', style.style);
             }
@@ -359,8 +394,11 @@ class InuSvgSwitzerland {
     onClick(cantonName, result, event) {
         event.preventDefault();
         event.stopPropagation();
+        if (this.disabled()) {
+            return;
+        }
         if (event.ctrlKey) {
-            return this.deselect(cantonName, result, event);
+            return this.deselect(cantonName);
         }
         const canton = this.cantons[cantonName];
         if (!canton || canton.selectItem.disabled) {
@@ -375,7 +413,33 @@ class InuSvgSwitzerland {
         this.updateValues();
         this.sendSelected();
     }
-    deselect(cantonName, result, event) {
+    ontouchend(cantonName, result, toucheEvent) {
+        toucheEvent.preventDefault();
+        if (this.disabled()) {
+            return;
+        }
+        const canton = this.cantons[cantonName];
+        if (!canton) {
+            return;
+        }
+        const currentTime = new Date().getTime();
+        const tapLength = currentTime - canton.lastTap;
+        if (tapLength < 300 && tapLength > 0) {
+            this.deselect(cantonName);
+        }
+        else {
+            canton.selectItem.selected = true;
+            const handler = this.actionHandler();
+            if (handler) {
+                const newValue = handler.onSelected(canton.selectItem);
+                canton.selectItem.value = newValue;
+            }
+            canton.lastTap = currentTime;
+        }
+        this.updateValues();
+        this.sendSelected();
+    }
+    deselect(cantonName) {
         const canton = this.cantons[cantonName];
         if (!canton || canton.selectItem.disabled) {
             return;
@@ -393,17 +457,35 @@ class InuSvgSwitzerland {
         this.sendSelected();
     }
     sendSelected() {
+        const values = [];
         const result = [];
-        setTimeout(() => {
-            const cantons = Object.keys(this.cantons);
-            for (let cantonName of cantons) {
-                const cantonItem = this.cantons[cantonName];
-                if (cantonItem.selectItem.selected || cantonItem.selectItem.value != undefined) {
-                    result.push(cantonItem.selectItem);
-                }
+        const cantons = Object.keys(this.cantons);
+        for (let cantonName of cantons) {
+            const cantonItem = this.cantons[cantonName];
+            if (cantonItem.selectItem.selected || cantonItem.selectItem.value != undefined) {
+                result.push(cantonItem.selectItem);
+                values.push(cantonItem.selectItem.value);
             }
-            this.selected.emit(result);
-        });
+        }
+        this.selected.emit(result);
+        this.formValue.set([...values]);
+        this.value.set([...values]);
+        this.changed.emit([...values]);
+        this.onModelChange([...values]);
+    }
+    onHover(cantonName, mouseEvent) {
+        const canton = this.cantons[cantonName];
+        if (!canton) {
+            return;
+        }
+        setTimeout(() => this.hover.emit(canton.selectItem));
+    }
+    onMouseLeave(cantonName, mouseEvent) {
+        const canton = this.cantons[cantonName];
+        if (!canton) {
+            return;
+        }
+        setTimeout(() => this.leave.emit(canton.selectItem));
     }
     //==================================================================================================================
     // TOOLS
@@ -414,11 +496,11 @@ class InuSvgSwitzerland {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: InuSvgSwitzerland, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.8", type: InuSvgSwitzerland, isStandalone: true, selector: "inu-svg-switzerland", inputs: { styleclass: { classPropertyName: "styleclass", publicName: "styleclass", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, valid: { classPropertyName: "valid", publicName: "valid", isSignal: true, isRequired: false, transformFunction: null }, actionHandler: { classPropertyName: "actionHandler", publicName: "actionHandler", isSignal: true, isRequired: false, transformFunction: null }, styleGenerator: { classPropertyName: "styleGenerator", publicName: "styleGenerator", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selected" }, viewQueries: [{ propertyName: "component", first: true, predicate: ["component"], descendants: true, isSignal: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.8", type: InuSvgSwitzerland, isStandalone: true, selector: "inu-svg-switzerland", inputs: { actionHandler: { classPropertyName: "actionHandler", publicName: "actionHandler", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, formValue: { classPropertyName: "formValue", publicName: "formValue", isSignal: true, isRequired: false, transformFunction: null }, matcher: { classPropertyName: "matcher", publicName: "matcher", isSignal: true, isRequired: false, transformFunction: null }, styleGenerator: { classPropertyName: "styleGenerator", publicName: "styleGenerator", isSignal: true, isRequired: false, transformFunction: null }, styleclass: { classPropertyName: "styleclass", publicName: "styleclass", isSignal: true, isRequired: false, transformFunction: null }, valid: { classPropertyName: "valid", publicName: "valid", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, valueExtractor: { classPropertyName: "valueExtractor", publicName: "valueExtractor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { formValue: "formValueChange", value: "valueChange", selected: "selected", hover: "hover", leave: "leave", changed: "changed" }, viewQueries: [{ propertyName: "component", first: true, predicate: ["component"], descendants: true, isSignal: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div [class]="_styleClass()" #component>
       <svg #container xmlns="http://www.w3.org/2000/svg"></svg>
     </div>
-  `, isInline: true, styles: ["svg{border:1px solid black}::ng-deep .inu-svg-switzerland-lakes{fill:#729fcf;stroke-opacity:0}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton{stroke-opacity:0;stroke:#22241c;stroke-width:4;stroke-dasharray:none}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.selected{stroke:#dfdfdf;stroke-opacity:1}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton:hover{stroke-opacity:1}::ng-deep .colored-AI{fill:#20603d}::ng-deep .colored-AG{fill:#d36e70}::ng-deep .colored-AR{fill:#00bb2d}::ng-deep .colored-BE{fill:#4c9141}::ng-deep .colored-BL{fill:#641c34}::ng-deep .colored-BS{fill:#9c9c9c}::ng-deep .colored-FR{fill:#343e40}::ng-deep .colored-GE{fill:#5c3c60}::ng-deep .colored-GL{fill:#c6a664}::ng-deep .colored-GR{fill:#6d6552}::ng-deep .colored-JU{fill:#909090}::ng-deep .colored-LU{fill:#fdf4e3}::ng-deep .colored-NE{fill:#2e3a23}::ng-deep .colored-NW{fill:#5e2129}::ng-deep .colored-OW{fill:#4e5452}::ng-deep .colored-SG{fill:#3d642d}::ng-deep .colored-SH{fill:#ff2301}::ng-deep .colored-SO{fill:#d6ae01}::ng-deep .colored-SZ{fill:#23282b}::ng-deep .colored-TG{fill:#6c6874}::ng-deep .colored-TI{fill:#59351f}::ng-deep .colored-UR{fill:#434750}::ng-deep .colored-VD{fill:#8b8c7a}::ng-deep .colored-VS{fill:#aea04b}::ng-deep .colored-ZG{fill:#b32821}::ng-deep .colored-ZH{fill:#6c4675}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton{transition:fill .15s,stroke .1s,stroke-opacity 50ms;cursor:pointer;outline:none}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome{fill:#dcdcdc;stroke:#bdbcc3;stroke-opacity:.5}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome:hover{stroke-opacity:1;stroke:#717076}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome.selected{fill:#2f5e76;stroke-opacity:1;stroke:#717076}\n"] });
+  `, isInline: true, styles: ["::ng-deep .inu-svg-switzerland-lakes{fill:#729fcf;stroke-opacity:0}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton{stroke-opacity:0;stroke:#22241c;stroke-width:4;stroke-dasharray:none}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.selected{stroke:#dfdfdf;stroke-opacity:1}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton:hover{stroke-opacity:1}::ng-deep .colored-AI{fill:#20603d}::ng-deep .colored-AG{fill:#d36e70}::ng-deep .colored-AR{fill:#00bb2d}::ng-deep .colored-BE{fill:#4c9141}::ng-deep .colored-BL{fill:#641c34}::ng-deep .colored-BS{fill:#9c9c9c}::ng-deep .colored-FR{fill:#343e40}::ng-deep .colored-GE{fill:#5c3c60}::ng-deep .colored-GL{fill:#c6a664}::ng-deep .colored-GR{fill:#6d6552}::ng-deep .colored-JU{fill:#909090}::ng-deep .colored-LU{fill:#fdf4e3}::ng-deep .colored-NE{fill:#2e3a23}::ng-deep .colored-NW{fill:#5e2129}::ng-deep .colored-OW{fill:#4e5452}::ng-deep .colored-SG{fill:#3d642d}::ng-deep .colored-SH{fill:#ff2301}::ng-deep .colored-SO{fill:#d6ae01}::ng-deep .colored-SZ{fill:#23282b}::ng-deep .colored-TG{fill:#6c6874}::ng-deep .colored-TI{fill:#59351f}::ng-deep .colored-UR{fill:#434750}::ng-deep .colored-VD{fill:#8b8c7a}::ng-deep .colored-VS{fill:#aea04b}::ng-deep .colored-ZG{fill:#b32821}::ng-deep .colored-ZH{fill:#6c4675}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton{transition:fill .15s,stroke .1s,stroke-opacity 50ms;cursor:pointer;outline:none}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome{fill:#dcdcdc;stroke:#bdbcc3;stroke-opacity:.5}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome:hover{stroke-opacity:1;stroke:#717076}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome.selected{fill:#2f5e76;stroke-opacity:1;stroke:#717076}\n"] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: InuSvgSwitzerland, decorators: [{
             type: Component,
@@ -426,12 +508,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
     <div [class]="_styleClass()" #component>
       <svg #container xmlns="http://www.w3.org/2000/svg"></svg>
     </div>
-  `, styles: ["svg{border:1px solid black}::ng-deep .inu-svg-switzerland-lakes{fill:#729fcf;stroke-opacity:0}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton{stroke-opacity:0;stroke:#22241c;stroke-width:4;stroke-dasharray:none}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.selected{stroke:#dfdfdf;stroke-opacity:1}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton:hover{stroke-opacity:1}::ng-deep .colored-AI{fill:#20603d}::ng-deep .colored-AG{fill:#d36e70}::ng-deep .colored-AR{fill:#00bb2d}::ng-deep .colored-BE{fill:#4c9141}::ng-deep .colored-BL{fill:#641c34}::ng-deep .colored-BS{fill:#9c9c9c}::ng-deep .colored-FR{fill:#343e40}::ng-deep .colored-GE{fill:#5c3c60}::ng-deep .colored-GL{fill:#c6a664}::ng-deep .colored-GR{fill:#6d6552}::ng-deep .colored-JU{fill:#909090}::ng-deep .colored-LU{fill:#fdf4e3}::ng-deep .colored-NE{fill:#2e3a23}::ng-deep .colored-NW{fill:#5e2129}::ng-deep .colored-OW{fill:#4e5452}::ng-deep .colored-SG{fill:#3d642d}::ng-deep .colored-SH{fill:#ff2301}::ng-deep .colored-SO{fill:#d6ae01}::ng-deep .colored-SZ{fill:#23282b}::ng-deep .colored-TG{fill:#6c6874}::ng-deep .colored-TI{fill:#59351f}::ng-deep .colored-UR{fill:#434750}::ng-deep .colored-VD{fill:#8b8c7a}::ng-deep .colored-VS{fill:#aea04b}::ng-deep .colored-ZG{fill:#b32821}::ng-deep .colored-ZH{fill:#6c4675}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton{transition:fill .15s,stroke .1s,stroke-opacity 50ms;cursor:pointer;outline:none}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome{fill:#dcdcdc;stroke:#bdbcc3;stroke-opacity:.5}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome:hover{stroke-opacity:1;stroke:#717076}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome.selected{fill:#2f5e76;stroke-opacity:1;stroke:#717076}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { styleclass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleclass", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], valid: [{ type: i0.Input, args: [{ isSignal: true, alias: "valid", required: false }] }], actionHandler: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionHandler", required: false }] }], styleGenerator: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleGenerator", required: false }] }], selected: [{ type: i0.Output, args: ["selected"] }], component: [{ type: i0.ViewChild, args: ['component', { isSignal: true }] }], container: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }] } });
+  `, styles: ["::ng-deep .inu-svg-switzerland-lakes{fill:#729fcf;stroke-opacity:0}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton{stroke-opacity:0;stroke:#22241c;stroke-width:4;stroke-dasharray:none}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.selected{stroke:#dfdfdf;stroke-opacity:1}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton:hover{stroke-opacity:1}::ng-deep .colored-AI{fill:#20603d}::ng-deep .colored-AG{fill:#d36e70}::ng-deep .colored-AR{fill:#00bb2d}::ng-deep .colored-BE{fill:#4c9141}::ng-deep .colored-BL{fill:#641c34}::ng-deep .colored-BS{fill:#9c9c9c}::ng-deep .colored-FR{fill:#343e40}::ng-deep .colored-GE{fill:#5c3c60}::ng-deep .colored-GL{fill:#c6a664}::ng-deep .colored-GR{fill:#6d6552}::ng-deep .colored-JU{fill:#909090}::ng-deep .colored-LU{fill:#fdf4e3}::ng-deep .colored-NE{fill:#2e3a23}::ng-deep .colored-NW{fill:#5e2129}::ng-deep .colored-OW{fill:#4e5452}::ng-deep .colored-SG{fill:#3d642d}::ng-deep .colored-SH{fill:#ff2301}::ng-deep .colored-SO{fill:#d6ae01}::ng-deep .colored-SZ{fill:#23282b}::ng-deep .colored-TG{fill:#6c6874}::ng-deep .colored-TI{fill:#59351f}::ng-deep .colored-UR{fill:#434750}::ng-deep .colored-VD{fill:#8b8c7a}::ng-deep .colored-VS{fill:#aea04b}::ng-deep .colored-ZG{fill:#b32821}::ng-deep .colored-ZH{fill:#6c4675}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton{transition:fill .15s,stroke .1s,stroke-opacity 50ms;cursor:pointer;outline:none}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome{fill:#dcdcdc;stroke:#bdbcc3;stroke-opacity:.5}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome:hover{stroke-opacity:1;stroke:#717076}::ng-deep .inu-svg-switzerland-cantons .inu-svg-switzerland-canton.monochrome.selected{fill:#2f5e76;stroke-opacity:1;stroke:#717076}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { actionHandler: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionHandler", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], formValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "formValue", required: false }] }, { type: i0.Output, args: ["formValueChange"] }], matcher: [{ type: i0.Input, args: [{ isSignal: true, alias: "matcher", required: false }] }], styleGenerator: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleGenerator", required: false }] }], styleclass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleclass", required: false }] }], valid: [{ type: i0.Input, args: [{ isSignal: true, alias: "valid", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], valueExtractor: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueExtractor", required: false }] }], selected: [{ type: i0.Output, args: ["selected"] }], hover: [{ type: i0.Output, args: ["hover"] }], leave: [{ type: i0.Output, args: ["leave"] }], changed: [{ type: i0.Output, args: ["changed"] }], component: [{ type: i0.ViewChild, args: ['component', { isSignal: true }] }], container: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }] } });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { InuSvgSwitzerland, SVG_SWITZERLAND_COLORED, SVG_SWITZERLAND_LEVEL_COLOR_10, SVG_SWITZERLAND_LEVEL_COLOR_100, SVG_SWITZERLAND_LEVEL_COLOR_GENERATOR, SVG_SWITZERLAND_LEVEL_MONOCHROME_BLUE, SVG_SWITZERLAND_LEVEL_MONOCHROME_GENERATOR, SVG_SWITZERLAND_LEVEL_MONOCHROME_GREEN, SVG_SWITZERLAND_LEVEL_MONOCHROME_RED, SVG_SWITZERLAND_MONOCHROME };
+export { InuSvgSwitzerland, SVG_SWITZERLAND_COLORED, SVG_SWITZERLAND_LEVEL_COLOR_100, SVG_SWITZERLAND_LEVEL_COLOR_GENERATOR, SVG_SWITZERLAND_LEVEL_MONOCHROME_BLUE, SVG_SWITZERLAND_LEVEL_MONOCHROME_GENERATOR, SVG_SWITZERLAND_LEVEL_MONOCHROME_GREEN, SVG_SWITZERLAND_LEVEL_MONOCHROME_RED, SVG_SWITZERLAND_MONOCHROME };
 //# sourceMappingURL=inugami-ng-components-inu-svg-switzerland.mjs.map