npm - @norwegian/core-components - Versions diffs - 6.38.0 → 6.39.1 - Mend

@norwegian/core-components 6.38.0 → 6.39.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (16) hide show

package/assets/icons/icon-external-link--light.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
+    <path d="M12.5834 9.66665H11.75C11.6395 9.66665 11.5336 9.71055 11.4554 9.78868C11.3773 9.86683 11.3334 9.97281 11.3334 10.0833V13H3.00004V4.66665H6.75004C6.86055 4.66665 6.96653 4.62275 7.04467 4.54461C7.12281 4.46647 7.16671 4.36049 7.16671 4.24998V3.41665C7.16671 3.30614 7.12281 3.20016 7.04467 3.12202C6.96653 3.04388 6.86055 2.99998 6.75004 2.99998H2.58337C2.25185 2.99998 1.93391 3.13168 1.69949 3.3661C1.46507 3.60052 1.33337 3.91846 1.33337 4.24998L1.33337 13.4166C1.33337 13.7482 1.46507 14.0661 1.69949 14.3005C1.93391 14.535 2.25185 14.6666 2.58337 14.6666H11.75C12.0816 14.6666 12.3995 14.535 12.6339 14.3005C12.8683 14.0661 13 13.7482 13 13.4166V10.0833C13 9.97281 12.9561 9.86683 12.878 9.78868C12.7999 9.71055 12.6939 9.66665 12.5834 9.66665ZM14.0417 1.33331H10.7084C10.1519 1.33331 9.87374 2.00805 10.2657 2.40102L11.1961 3.33149L4.849 9.67628C4.79073 9.73435 4.7445 9.80334 4.71296 9.87931C4.68141 9.95528 4.66517 10.0367 4.66517 10.119C4.66517 10.2012 4.68141 10.2827 4.71296 10.3587C4.7445 10.4346 4.79073 10.5036 4.849 10.5617L5.43936 11.151C5.49743 11.2093 5.56642 11.2555 5.64239 11.2871C5.71836 11.3186 5.79981 11.3348 5.88207 11.3348C5.96433 11.3348 6.04578 11.3186 6.12175 11.2871C6.19772 11.2555 6.26672 11.2093 6.32478 11.151L12.6688 4.80519L13.599 5.73435C13.9896 6.12498 14.6667 5.85154 14.6667 5.29165V1.95831C14.6667 1.79255 14.6009 1.63358 14.4836 1.51637C14.3664 1.39916 14.2075 1.33331 14.0417 1.33331Z" fill="#FFFFFF"/>
+</svg>

package/assets/icons/icon-external-link.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
+    <path d="M12.5834 9.66665H11.75C11.6395 9.66665 11.5336 9.71055 11.4554 9.78868C11.3773 9.86683 11.3334 9.97281 11.3334 10.0833V13H3.00004V4.66665H6.75004C6.86055 4.66665 6.96653 4.62275 7.04467 4.54461C7.12281 4.46647 7.16671 4.36049 7.16671 4.24998V3.41665C7.16671 3.30614 7.12281 3.20016 7.04467 3.12202C6.96653 3.04388 6.86055 2.99998 6.75004 2.99998H2.58337C2.25185 2.99998 1.93391 3.13168 1.69949 3.3661C1.46507 3.60052 1.33337 3.91846 1.33337 4.24998L1.33337 13.4166C1.33337 13.7482 1.46507 14.0661 1.69949 14.3005C1.93391 14.535 2.25185 14.6666 2.58337 14.6666H11.75C12.0816 14.6666 12.3995 14.535 12.6339 14.3005C12.8683 14.0661 13 13.7482 13 13.4166V10.0833C13 9.97281 12.9561 9.86683 12.878 9.78868C12.7999 9.71055 12.6939 9.66665 12.5834 9.66665ZM14.0417 1.33331H10.7084C10.1519 1.33331 9.87374 2.00805 10.2657 2.40102L11.1961 3.33149L4.849 9.67628C4.79073 9.73435 4.7445 9.80334 4.71296 9.87931C4.68141 9.95528 4.66517 10.0367 4.66517 10.119C4.66517 10.2012 4.68141 10.2827 4.71296 10.3587C4.7445 10.4346 4.79073 10.5036 4.849 10.5617L5.43936 11.151C5.49743 11.2093 5.56642 11.2555 5.64239 11.2871C5.71836 11.3186 5.79981 11.3348 5.88207 11.3348C5.96433 11.3348 6.04578 11.3186 6.12175 11.2871C6.19772 11.2555 6.26672 11.2093 6.32478 11.151L12.6688 4.80519L13.599 5.73435C13.9896 6.12498 14.6667 5.85154 14.6667 5.29165V1.95831C14.6667 1.79255 14.6009 1.63358 14.4836 1.51637C14.3664 1.39916 14.2075 1.33331 14.0417 1.33331Z" fill="#15273F"/>
+</svg>

package/assets/icons/icon-negative--light.svg CHANGED Viewed

@@ -1,11 +1,3 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
-<g>
-	<circle fill="#FFFFFF" cx="12" cy="11.9" r="10"/>
-	<polygon fill="#D81939" points="17.2,8.8 15.1,6.7 12,9.8 8.9,6.7 6.8,8.8 9.9,11.9 6.8,15 8.9,17.1 12,14 15.1,17.1 17.2,15
-		14.1,11.9 	"/>
-</g>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 17" fill="none">
+	<path id="Exclude" fill-rule="evenodd" clip-rule="evenodd" d="M16 8.5C16 12.9183 12.4183 16.5 8 16.5C3.58172 16.5 0 12.9183 0 8.5C0 4.08172 3.58172 0.5 8 0.5C12.4183 0.5 16 4.08172 16 8.5ZM10.3846 4.58008L12 6.19546L9.61539 8.58008L12 10.9647L10.3846 12.5801L8 10.1955L5.61538 12.5801L4 10.9647L6.38461 8.58008L4 6.19546L5.61538 4.58008L8 6.96469L10.3846 4.58008Z" fill="#FFFFFF"/>
+</svg>

package/assets/icons/icon-negative.svg CHANGED Viewed

@@ -1,11 +1,3 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
-<g>
-	<circle fill="#D81939" cx="12" cy="11.9" r="10"/>
-	<polygon fill="#FFFFFF" points="17.2,8.8 15.1,6.7 12,9.8 8.9,6.7 6.8,8.8 9.9,11.9 6.8,15 8.9,17.1 12,14 15.1,17.1 17.2,15
-		14.1,11.9 	"/>
-</g>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 17" fill="none">
+	<path id="Exclude" fill-rule="evenodd" clip-rule="evenodd" d="M16 8.5C16 12.9183 12.4183 16.5 8 16.5C3.58172 16.5 0 12.9183 0 8.5C0 4.08172 3.58172 0.5 8 0.5C12.4183 0.5 16 4.08172 16 8.5ZM10.3846 4.58008L12 6.19546L9.61539 8.58008L12 10.9647L10.3846 12.5801L8 10.1955L5.61538 12.5801L4 10.9647L6.38461 8.58008L4 6.19546L5.61538 4.58008L8 6.96469L10.3846 4.58008Z" fill="#B12A0B"/>
+</svg>

package/assets/icons/icon-positive--disabled.svg ADDED Viewed

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 17" fill="none">
+	<path id="Exclude" fill-rule="evenodd" clip-rule="evenodd" d="M16 8.5C16 12.9183 12.4183 16.5 8 16.5C3.58172 16.5 0 12.9183 0 8.5C0 4.08172 3.58172 0.5 8 0.5C12.4183 0.5 16 4.08172 16 8.5ZM11.5479 4.5L13.2001 6.11168L6.6273 12.5L2.80013 8.76667L4.44035 7.16667L6.6273 9.3L11.5479 4.5Z" fill="#6F6F6F"/>
+</svg>

package/assets/icons/icon-positive--light.svg CHANGED Viewed

@@ -1,98 +1,4 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg
-   xmlns:dc="http://purl.org/dc/elements/1.1/"
-   xmlns:cc="http://creativecommons.org/ns#"
-   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   version="1.1"
-   id="Layer_1"
-   x="0px"
-   y="0px"
-   width="24px"
-   height="24px"
-   viewBox="0 0 24 24"
-   enable-background="new 0 0 24 24"
-   xml:space="preserve"
-   sodipodi:docname="icon-positive-light.svg"
-   inkscape:version="0.92.3 (2405546, 2018-03-11)"><metadata
-   id="metadata13"><rdf:RDF><cc:Work
-       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
-         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
-   id="defs11" /><sodipodi:namedview
-   pagecolor="#ffffff"
-   bordercolor="#666666"
-   borderopacity="1"
-   objecttolerance="10"
-   gridtolerance="10"
-   guidetolerance="10"
-   inkscape:pageopacity="0"
-   inkscape:pageshadow="2"
-   inkscape:window-width="1920"
-   inkscape:window-height="1017"
-   id="namedview9"
-   showgrid="false"
-   inkscape:zoom="9.8333333"
-   inkscape:cx="12"
-   inkscape:cy="12"
-   inkscape:window-x="-8"
-   inkscape:window-y="-8"
-   inkscape:window-maximized="1"
-   inkscape:current-layer="Layer_1" />
-<g
-   id="g4"
-   style="display:inline;fill:#ffffff">
-	<circle
-   cx="12"
-   cy="12"
-   r="10"
-   id="circle2"
-   style="fill:#ffffff;fill-opacity:1" />
-<path
-   style="opacity:0;fill:#ffffff;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path828"
-   inkscape:connector-curvature="0" /><path
-   style="opacity:0;fill:#ffffff;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path830"
-   inkscape:connector-curvature="0" /></g>
-<polygon
-   points="6.7,12.1 9.4,14.7 11.5,16.8 13.6,14.7 18,10.3 15.9,8.2 11.5,12.6 8.8,10 "
-   id="polygon6"
-   style="display:inline;fill:#238e00;fill-opacity:1" />
-<path
-   style="opacity:0;fill:#238e00;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path832"
-   inkscape:connector-curvature="0" /><path
-   style="opacity:0;fill:#238e00;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path834"
-   inkscape:connector-curvature="0" /><path
-   style="opacity:0;fill:#238e00;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path836"
-   inkscape:connector-curvature="0" /><path
-   style="opacity:0;fill:#238e00;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path838"
-   inkscape:connector-curvature="0" /><path
-   style="opacity:0;fill:#238e00;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path840"
-   inkscape:connector-curvature="0" /><path
-   style="opacity:0;fill:#238e00;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path842"
-   inkscape:connector-curvature="0" /><path
-   style="opacity:0;fill:#238e00;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path844"
-   inkscape:connector-curvature="0" /><path
-   style="opacity:0;fill:#238e00;fill-opacity:1;stroke-width:0.10169491"
-   d="m 9.1083615,14.464783 -2.4136724,-2.359706 1.0590374,-1.055433 1.0590374,-1.0554329 1.3486031,1.2928199 1.348603,1.292821 2.193806,-2.192106 2.193806,-2.1921063 1.065455,1.0690932 1.065455,1.0690931 -3.253229,3.245331 -3.253229,3.245331 z"
-   id="path846"
-   inkscape:connector-curvature="0" /></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 17" fill="none">
+	<path id="Exclude" fill-rule="evenodd" clip-rule="evenodd" d="M16 8.5C16 12.9183 12.4183 16.5 8 16.5C3.58242 16.5 0 12.9183 0 8.5C0 4.08172 3.58172 0.5 8 0.5C12.4183 0.5 16 4.08172 16 8.5ZM11.5479 4.5L13.2001 6.11168L6.6273 12.5L2.80013 8.76667L4.44035 7.16667L6.6273 9.3L11.5479 4.5Z" fill="#FFFFFF"/>
+	</svg>

package/assets/icons/icon-positive.svg CHANGED Viewed

@@ -1,10 +1,3 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
-<g>
-	<circle fill="#238E00" cx="12" cy="12" r="10"/>
-</g>
-<polygon fill="#FFFFFF" points="18,10.3 15.9,8.2 11.5,12.6 8.8,10 6.7,12.1 9.4,14.7 11.5,16.8 13.6,14.7 "/>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 17" fill="none">
+	<path fill-rule="evenodd" clip-rule="evenodd" d="M16 8.5C16 12.9183 12.4183 16.5 8 16.5C3.58172 16.5 0 12.9183 0 8.5C0 4.08172 3.58172 0.5 8 0.5C12.4183 0.5 16 4.08172 16 8.5ZM11.5479 4.5L13.2001 6.11168L6.6273 12.5L2.80013 8.76667L4.44035 7.16667L6.6273 9.3L11.5479 4.5Z" fill="#238E00"/>
 </svg>

package/assets/icons/small/info.svg CHANGED Viewed

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24ZM10.9092 10.9091V18.5455H13.0911V10.9091H10.9092ZM12.0001 8.72726C11.0592 8.72726 10.3638 8.01135 10.3638 7.09089C10.3638 6.17044 11.0592 5.45453 12.0001 5.45453C12.941 5.45453 13.6365 6.17044 13.6365 7.09089C13.6365 8.01135 12.941 8.72726 12.0001 8.72726Z" fill="#003251"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24ZM10.9092 10.9091V18.5455H13.0911V10.9091H10.9092ZM12.0001 8.72726C11.0592 8.72726 10.3638 8.01135 10.3638 7.09089C10.3638 6.17044 11.0592 5.45453 12.0001 5.45453C12.941 5.45453 13.6365 6.17044 13.6365 7.09089C13.6365 8.01135 12.941 8.72726 12.0001 8.72726Z" fill="#15273F"/>
 </svg>

package/esm2022/lib/components/checkbox/checkbox.component.mjs CHANGED Viewed

@@ -94,11 +94,11 @@ export class CheckboxComponent extends NasComponentBase {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: CheckboxComponent, selector: "nas-checkbox", inputs: { inputId: "inputId", value: "value", error: "error", disabled: "disabled", block: "block", spaceless: "spaceless", inverted: "inverted", outlined: "outlined", ariaLabel: ["aria-label", "ariaLabel"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], name: "name", required: "required", tabIndex: "tabIndex", checked: "checked", nasFormControlName: "nasFormControlName", nasFormGroup: "nasFormGroup" }, outputs: { checkedChange: "checkedChange", focusOnPrevious: "focusOnPrevious" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "inputReactive", first: true, predicate: ["inputReactive"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!nasFormControlName; else reactiveForm\">\n  <label [nasClass]=\"mainClass\">\n    <input type=\"checkbox\"\n      #input\n      [id]=\"inputId\"\n      [checked]=\"exists(checked)\"\n      [disabled]=\"exists(disabled)\"\n      [required]=\"exists(required)\"\n      [tabIndex]=\"tabIndex\"\n      [attr.name]=\"name\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"ariaLabelledby\"\n      [attr.aria-describedby]=\"ariaLabelledby\"\n      [attr.value]=\"value\"\n      (change)=\"inputChanged($event)\"\n      (click)=\"inputClicked($event)\" />\n    <span [nasClass]=\"getClass('indicator')\"></span>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </label>\n</ng-container>\n\n<ng-template #reactiveForm>\n  <label [nasClass]=\"mainClass\"\n    #inputReactive\n    [formGroup]=\"nasFormGroup\">\n    <input type=\"checkbox\"\n      [formControlName]=\"nasFormControlName\"\n      [id]=\"inputId\"\n      [checked]=\"exists(checked)\"\n      [required]=\"exists(required)\"\n      [tabIndex]=\"tabIndex\"\n      [attr.name]=\"name\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"ariaLabelledby\"\n      [attr.aria-describedby]=\"ariaLabelledby\"\n      [attr.value]=\"value\"\n      (keydown)=\"onKeydown($event)\" />\n    <span [nasClass]=\"getClass('indicator')\"></span>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </label>\n</ng-template>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-checkbox{-webkit-user-select:none;-o-user-select:none;user-select:none;-webkit-user-drag:none;-moz-user-drag:none;user-drag:none;position:relative;display:inline-block;cursor:pointer;padding-left:27px;margin-bottom:24px;margin-right:24px;color:#002a3a}.nas-checkbox:hover .nas-checkbox__indicator:after{border-color:#909090}.nas-checkbox input{position:absolute;opacity:0;z-index:-1}.nas-checkbox input:checked+.nas-checkbox__indicator{border-color:#003251}.nas-checkbox input:checked+.nas-checkbox__indicator:before{transform:scale(1);opacity:1}.nas-checkbox input:checked+.nas-checkbox__indicator:after{border-color:#003251}.nas-checkbox input[disabled]+.nas-checkbox__indicator{background-color:#d8d8d8}.nas-checkbox input[disabled]+.nas-checkbox__indicator:after,.nas-checkbox input[disabled]+.nas-checkbox__indicator:hover:after,.nas-checkbox input[disabled]+.nas-checkbox__indicator:focus:after{border-color:#c3c3c3}.nas-checkbox input:focus+.nas-checkbox__indicator{box-shadow:0 0 1px 2px #e3e3e3,0 0 2px 3px #3b99fc}.nas-checkbox__indicator{position:absolute;display:block;-webkit-user-select:none;user-select:none;top:0;left:0;width:18px;height:18px;background-color:#fff}.nas-checkbox__indicator:before{content:\"\";display:inline-block;vertical-align:middle;position:absolute;top:55%;left:50%;width:14px;height:12px;margin-top:-6px;margin-left:-7px;transform-origin:40% 90%;opacity:0;transform:scale(0);transition:all .1s cubic-bezier(0,0,.1,1);background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 18.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg version%3D%221.1%22 id%3D%22Layer_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 width%3D%2214px%22 height%3D%2212px%22 viewBox%3D%220 0 14 12%22 enable-background%3D%22new 0 0 14 12%22 xml%3Aspace%3D%22preserve%22%3E%3Cpolygon fill%3D%22%23003D50%22 points%3D%2211.7%2C0 5.8%2C6.7 2.2%2C3.1 0%2C5.3 6%2C11.3 14%2C2 %22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat}.nas-checkbox__indicator:after{content:\"\";position:absolute;bottom:-6px;width:100%;border-bottom:3px solid #c3c3c3}.nas-checkbox--disabled{color:#6f6f6f;cursor:default}.nas-checkbox--disabled .nas-checkbox__indicator{background-color:#d8d8d8}.nas-checkbox--disabled:hover .nas-checkbox__indicator:after{border-color:#c3c3c3}.nas-checkbox--error input:checked+.nas-checkbox__indicator:after,.nas-checkbox--error input+.nas-checkbox__indicator:after{border-color:#e5212d}.nas-checkbox--inverted{color:#fff}.nas-checkbox--inverted input:checked+.nas-checkbox__indicator:after,.nas-checkbox--inverted input+.nas-checkbox__indicator:after{border-color:#fff}.nas-checkbox--inverted-error{color:#fff}.nas-checkbox--inverted-error input:checked+.nas-checkbox__indicator:after,.nas-checkbox--inverted-error input+.nas-checkbox__indicator:after{border-color:#e5212d}.nas-checkbox--outlined .nas-checkbox__indicator{width:22px;height:22px;border:2px solid #c3c3c3}.nas-checkbox--outlined .nas-checkbox__indicator:after{display:none}.nas-checkbox--outlined-error .nas-checkbox__indicator{width:22px;height:22px;border:2px solid #E5212D}.nas-checkbox--outlined-error .nas-checkbox__indicator:after{display:none}.nas-checkbox--spaceless{margin-bottom:6px}.nas-checkbox--block{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.CheckboxRequiredValidator, selector: "input[type=checkbox][required][formControlName],input[type=checkbox][required][formControl],input[type=checkbox][required][ngModel]" }, { kind: "directive", type: i3.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: CheckboxComponent, selector: "nas-checkbox", inputs: { inputId: "inputId", value: "value", error: "error", disabled: "disabled", block: "block", spaceless: "spaceless", inverted: "inverted", outlined: "outlined", ariaLabel: ["aria-label", "ariaLabel"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], name: "name", required: "required", tabIndex: "tabIndex", checked: "checked", nasFormControlName: "nasFormControlName", nasFormGroup: "nasFormGroup" }, outputs: { checkedChange: "checkedChange", focusOnPrevious: "focusOnPrevious" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "inputReactive", first: true, predicate: ["inputReactive"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!nasFormControlName; else reactiveForm\">\n  <label [nasClass]=\"mainClass\">\n    <input type=\"checkbox\"\n      #input\n      [id]=\"inputId\"\n      [checked]=\"exists(checked)\"\n      [disabled]=\"exists(disabled)\"\n      [required]=\"exists(required)\"\n      [tabIndex]=\"tabIndex\"\n      [attr.name]=\"name\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"ariaLabelledby\"\n      [attr.aria-describedby]=\"ariaLabelledby\"\n      [attr.value]=\"value\"\n      (change)=\"inputChanged($event)\"\n      (click)=\"inputClicked($event)\" />\n    <span [nasClass]=\"getClass('indicator')\"></span>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </label>\n</ng-container>\n\n<ng-template #reactiveForm>\n  <label [nasClass]=\"mainClass\"\n    #inputReactive\n    [formGroup]=\"nasFormGroup\">\n    <input type=\"checkbox\"\n      [formControlName]=\"nasFormControlName\"\n      [id]=\"inputId\"\n      [checked]=\"exists(checked)\"\n      [required]=\"exists(required)\"\n      [tabIndex]=\"tabIndex\"\n      [attr.name]=\"name\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"ariaLabelledby\"\n      [attr.aria-describedby]=\"ariaLabelledby\"\n      [attr.value]=\"value\"\n      (keydown)=\"onKeydown($event)\" />\n    <span [nasClass]=\"getClass('indicator')\"></span>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </label>\n</ng-template>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-checkbox{-webkit-user-select:none;-o-user-select:none;user-select:none;-webkit-user-drag:none;-moz-user-drag:none;user-drag:none;position:relative;display:inline-block;cursor:pointer;padding-left:27px;margin-bottom:24px;margin-right:24px;color:#002a3a}.nas-checkbox:hover .nas-checkbox__indicator:after{border-color:#909090}.nas-checkbox input{position:absolute;opacity:0;z-index:-1}.nas-checkbox input:checked+.nas-checkbox__indicator{border-color:#003251}.nas-checkbox input:checked+.nas-checkbox__indicator:before{transform:scale(1);opacity:1}.nas-checkbox input:checked+.nas-checkbox__indicator:after{border-color:#003251}.nas-checkbox input[disabled]+.nas-checkbox__indicator{background-color:#d8d8d8}.nas-checkbox input[disabled]+.nas-checkbox__indicator:after,.nas-checkbox input[disabled]+.nas-checkbox__indicator:hover:after,.nas-checkbox input[disabled]+.nas-checkbox__indicator:focus:after{border-color:#c3c3c3}.nas-checkbox input:focus+.nas-checkbox__indicator{box-shadow:0 0 1px 2px #e3e3e3,0 0 2px 3px #3b99fc}.nas-checkbox__indicator{position:absolute;display:block;-webkit-user-select:none;user-select:none;top:0;left:0;width:18px;height:18px;background-color:#fff}.nas-checkbox__indicator:before{content:\"\";display:inline-block;vertical-align:middle;position:absolute;top:55%;left:50%;width:14px;height:12px;margin-top:-6px;margin-left:-7px;transform-origin:40% 90%;opacity:0;transform:scale(0);transition:all .1s cubic-bezier(0,0,.1,1);background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 18.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg version%3D%221.1%22 id%3D%22Layer_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 width%3D%2214px%22 height%3D%2212px%22 viewBox%3D%220 0 14 12%22 enable-background%3D%22new 0 0 14 12%22 xml%3Aspace%3D%22preserve%22%3E%3Cpolygon fill%3D%22%2315273F%22 points%3D%2211.7%2C0 5.8%2C6.7 2.2%2C3.1 0%2C5.3 6%2C11.3 14%2C2 %22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat}.nas-checkbox__indicator:after{content:\"\";position:absolute;bottom:-6px;width:100%;border-bottom:3px solid #c3c3c3}.nas-checkbox--disabled{color:#6f6f6f;cursor:default}.nas-checkbox--disabled .nas-checkbox__indicator{background-color:#d8d8d8}.nas-checkbox--disabled:hover .nas-checkbox__indicator:after{border-color:#c3c3c3}.nas-checkbox--error input:checked+.nas-checkbox__indicator:after,.nas-checkbox--error input+.nas-checkbox__indicator:after{border-color:#e5212d}.nas-checkbox--inverted{color:#fff}.nas-checkbox--inverted input:checked+.nas-checkbox__indicator:after,.nas-checkbox--inverted input+.nas-checkbox__indicator:after{border-color:#fff}.nas-checkbox--inverted-error{color:#fff}.nas-checkbox--inverted-error input:checked+.nas-checkbox__indicator:after,.nas-checkbox--inverted-error input+.nas-checkbox__indicator:after{border-color:#e5212d}.nas-checkbox--outlined .nas-checkbox__indicator{width:22px;height:22px;border:2px solid #c3c3c3}.nas-checkbox--outlined .nas-checkbox__indicator:after{display:none}.nas-checkbox--outlined-error .nas-checkbox__indicator{width:22px;height:22px;border:2px solid #E5212D}.nas-checkbox--outlined-error .nas-checkbox__indicator:after{display:none}.nas-checkbox--spaceless{margin-bottom:6px}.nas-checkbox--block{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.CheckboxRequiredValidator, selector: "input[type=checkbox][required][formControlName],input[type=checkbox][required][formControl],input[type=checkbox][required][ngModel]" }, { kind: "directive", type: i3.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: CheckboxComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'nas-checkbox', encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"!nasFormControlName; else reactiveForm\">\n  <label [nasClass]=\"mainClass\">\n    <input type=\"checkbox\"\n      #input\n      [id]=\"inputId\"\n      [checked]=\"exists(checked)\"\n      [disabled]=\"exists(disabled)\"\n      [required]=\"exists(required)\"\n      [tabIndex]=\"tabIndex\"\n      [attr.name]=\"name\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"ariaLabelledby\"\n      [attr.aria-describedby]=\"ariaLabelledby\"\n      [attr.value]=\"value\"\n      (change)=\"inputChanged($event)\"\n      (click)=\"inputClicked($event)\" />\n    <span [nasClass]=\"getClass('indicator')\"></span>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </label>\n</ng-container>\n\n<ng-template #reactiveForm>\n  <label [nasClass]=\"mainClass\"\n    #inputReactive\n    [formGroup]=\"nasFormGroup\">\n    <input type=\"checkbox\"\n      [formControlName]=\"nasFormControlName\"\n      [id]=\"inputId\"\n      [checked]=\"exists(checked)\"\n      [required]=\"exists(required)\"\n      [tabIndex]=\"tabIndex\"\n      [attr.name]=\"name\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"ariaLabelledby\"\n      [attr.aria-describedby]=\"ariaLabelledby\"\n      [attr.value]=\"value\"\n      (keydown)=\"onKeydown($event)\" />\n    <span [nasClass]=\"getClass('indicator')\"></span>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </label>\n</ng-template>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-checkbox{-webkit-user-select:none;-o-user-select:none;user-select:none;-webkit-user-drag:none;-moz-user-drag:none;user-drag:none;position:relative;display:inline-block;cursor:pointer;padding-left:27px;margin-bottom:24px;margin-right:24px;color:#002a3a}.nas-checkbox:hover .nas-checkbox__indicator:after{border-color:#909090}.nas-checkbox input{position:absolute;opacity:0;z-index:-1}.nas-checkbox input:checked+.nas-checkbox__indicator{border-color:#003251}.nas-checkbox input:checked+.nas-checkbox__indicator:before{transform:scale(1);opacity:1}.nas-checkbox input:checked+.nas-checkbox__indicator:after{border-color:#003251}.nas-checkbox input[disabled]+.nas-checkbox__indicator{background-color:#d8d8d8}.nas-checkbox input[disabled]+.nas-checkbox__indicator:after,.nas-checkbox input[disabled]+.nas-checkbox__indicator:hover:after,.nas-checkbox input[disabled]+.nas-checkbox__indicator:focus:after{border-color:#c3c3c3}.nas-checkbox input:focus+.nas-checkbox__indicator{box-shadow:0 0 1px 2px #e3e3e3,0 0 2px 3px #3b99fc}.nas-checkbox__indicator{position:absolute;display:block;-webkit-user-select:none;user-select:none;top:0;left:0;width:18px;height:18px;background-color:#fff}.nas-checkbox__indicator:before{content:\"\";display:inline-block;vertical-align:middle;position:absolute;top:55%;left:50%;width:14px;height:12px;margin-top:-6px;margin-left:-7px;transform-origin:40% 90%;opacity:0;transform:scale(0);transition:all .1s cubic-bezier(0,0,.1,1);background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 18.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg version%3D%221.1%22 id%3D%22Layer_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 width%3D%2214px%22 height%3D%2212px%22 viewBox%3D%220 0 14 12%22 enable-background%3D%22new 0 0 14 12%22 xml%3Aspace%3D%22preserve%22%3E%3Cpolygon fill%3D%22%23003D50%22 points%3D%2211.7%2C0 5.8%2C6.7 2.2%2C3.1 0%2C5.3 6%2C11.3 14%2C2 %22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat}.nas-checkbox__indicator:after{content:\"\";position:absolute;bottom:-6px;width:100%;border-bottom:3px solid #c3c3c3}.nas-checkbox--disabled{color:#6f6f6f;cursor:default}.nas-checkbox--disabled .nas-checkbox__indicator{background-color:#d8d8d8}.nas-checkbox--disabled:hover .nas-checkbox__indicator:after{border-color:#c3c3c3}.nas-checkbox--error input:checked+.nas-checkbox__indicator:after,.nas-checkbox--error input+.nas-checkbox__indicator:after{border-color:#e5212d}.nas-checkbox--inverted{color:#fff}.nas-checkbox--inverted input:checked+.nas-checkbox__indicator:after,.nas-checkbox--inverted input+.nas-checkbox__indicator:after{border-color:#fff}.nas-checkbox--inverted-error{color:#fff}.nas-checkbox--inverted-error input:checked+.nas-checkbox__indicator:after,.nas-checkbox--inverted-error input+.nas-checkbox__indicator:after{border-color:#e5212d}.nas-checkbox--outlined .nas-checkbox__indicator{width:22px;height:22px;border:2px solid #c3c3c3}.nas-checkbox--outlined .nas-checkbox__indicator:after{display:none}.nas-checkbox--outlined-error .nas-checkbox__indicator{width:22px;height:22px;border:2px solid #E5212D}.nas-checkbox--outlined-error .nas-checkbox__indicator:after{display:none}.nas-checkbox--spaceless{margin-bottom:6px}.nas-checkbox--block{display:block}\n"] }]
+            args: [{ selector: 'nas-checkbox', encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"!nasFormControlName; else reactiveForm\">\n  <label [nasClass]=\"mainClass\">\n    <input type=\"checkbox\"\n      #input\n      [id]=\"inputId\"\n      [checked]=\"exists(checked)\"\n      [disabled]=\"exists(disabled)\"\n      [required]=\"exists(required)\"\n      [tabIndex]=\"tabIndex\"\n      [attr.name]=\"name\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"ariaLabelledby\"\n      [attr.aria-describedby]=\"ariaLabelledby\"\n      [attr.value]=\"value\"\n      (change)=\"inputChanged($event)\"\n      (click)=\"inputClicked($event)\" />\n    <span [nasClass]=\"getClass('indicator')\"></span>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </label>\n</ng-container>\n\n<ng-template #reactiveForm>\n  <label [nasClass]=\"mainClass\"\n    #inputReactive\n    [formGroup]=\"nasFormGroup\">\n    <input type=\"checkbox\"\n      [formControlName]=\"nasFormControlName\"\n      [id]=\"inputId\"\n      [checked]=\"exists(checked)\"\n      [required]=\"exists(required)\"\n      [tabIndex]=\"tabIndex\"\n      [attr.name]=\"name\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"ariaLabelledby\"\n      [attr.aria-describedby]=\"ariaLabelledby\"\n      [attr.value]=\"value\"\n      (keydown)=\"onKeydown($event)\" />\n    <span [nasClass]=\"getClass('indicator')\"></span>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </label>\n</ng-template>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-checkbox{-webkit-user-select:none;-o-user-select:none;user-select:none;-webkit-user-drag:none;-moz-user-drag:none;user-drag:none;position:relative;display:inline-block;cursor:pointer;padding-left:27px;margin-bottom:24px;margin-right:24px;color:#002a3a}.nas-checkbox:hover .nas-checkbox__indicator:after{border-color:#909090}.nas-checkbox input{position:absolute;opacity:0;z-index:-1}.nas-checkbox input:checked+.nas-checkbox__indicator{border-color:#003251}.nas-checkbox input:checked+.nas-checkbox__indicator:before{transform:scale(1);opacity:1}.nas-checkbox input:checked+.nas-checkbox__indicator:after{border-color:#003251}.nas-checkbox input[disabled]+.nas-checkbox__indicator{background-color:#d8d8d8}.nas-checkbox input[disabled]+.nas-checkbox__indicator:after,.nas-checkbox input[disabled]+.nas-checkbox__indicator:hover:after,.nas-checkbox input[disabled]+.nas-checkbox__indicator:focus:after{border-color:#c3c3c3}.nas-checkbox input:focus+.nas-checkbox__indicator{box-shadow:0 0 1px 2px #e3e3e3,0 0 2px 3px #3b99fc}.nas-checkbox__indicator{position:absolute;display:block;-webkit-user-select:none;user-select:none;top:0;left:0;width:18px;height:18px;background-color:#fff}.nas-checkbox__indicator:before{content:\"\";display:inline-block;vertical-align:middle;position:absolute;top:55%;left:50%;width:14px;height:12px;margin-top:-6px;margin-left:-7px;transform-origin:40% 90%;opacity:0;transform:scale(0);transition:all .1s cubic-bezier(0,0,.1,1);background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 18.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg version%3D%221.1%22 id%3D%22Layer_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 width%3D%2214px%22 height%3D%2212px%22 viewBox%3D%220 0 14 12%22 enable-background%3D%22new 0 0 14 12%22 xml%3Aspace%3D%22preserve%22%3E%3Cpolygon fill%3D%22%2315273F%22 points%3D%2211.7%2C0 5.8%2C6.7 2.2%2C3.1 0%2C5.3 6%2C11.3 14%2C2 %22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat}.nas-checkbox__indicator:after{content:\"\";position:absolute;bottom:-6px;width:100%;border-bottom:3px solid #c3c3c3}.nas-checkbox--disabled{color:#6f6f6f;cursor:default}.nas-checkbox--disabled .nas-checkbox__indicator{background-color:#d8d8d8}.nas-checkbox--disabled:hover .nas-checkbox__indicator:after{border-color:#c3c3c3}.nas-checkbox--error input:checked+.nas-checkbox__indicator:after,.nas-checkbox--error input+.nas-checkbox__indicator:after{border-color:#e5212d}.nas-checkbox--inverted{color:#fff}.nas-checkbox--inverted input:checked+.nas-checkbox__indicator:after,.nas-checkbox--inverted input+.nas-checkbox__indicator:after{border-color:#fff}.nas-checkbox--inverted-error{color:#fff}.nas-checkbox--inverted-error input:checked+.nas-checkbox__indicator:after,.nas-checkbox--inverted-error input+.nas-checkbox__indicator:after{border-color:#e5212d}.nas-checkbox--outlined .nas-checkbox__indicator{width:22px;height:22px;border:2px solid #c3c3c3}.nas-checkbox--outlined .nas-checkbox__indicator:after{display:none}.nas-checkbox--outlined-error .nas-checkbox__indicator{width:22px;height:22px;border:2px solid #E5212D}.nas-checkbox--outlined-error .nas-checkbox__indicator:after{display:none}.nas-checkbox--spaceless{margin-bottom:6px}.nas-checkbox--block{display:block}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { input: [{
                 type: ViewChild,
                 args: ['input']