diff --git a/package-lock.json b/package-lock.json
index c74dc6a..9fcf46d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3,32 +3,20 @@
   "requires": true,
   "lockfileVersion": 1,
   "dependencies": {
-    "@angular-builders/jest": {
-      "version": "10.0.1",
-      "resolved": "https://registry.npmjs.org/@angular-builders/jest/-/jest-10.0.1.tgz",
-      "integrity": "sha512-kRMdksXZLiWqBQtIF6RbF0q6AQkn2LbsSF3V9dbsX11kOlwn9teOEND4LnT5KHmBnnejSoVwP9DuIKQV+qKVBQ==",
-      "dev": true,
-      "requires": {
-        "@angular-devkit/architect": ">=0.1000.0 < 0.1100.0",
-        "@angular-devkit/core": "^10.0.0",
-        "jest-preset-angular": "^8.2.1",
-        "lodash": "^4.17.15"
-      }
-    },
     "@angular-devkit/architect": {
-      "version": "0.1002.3",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1002.3.tgz",
-      "integrity": "sha512-7ainXRNO1njZ6bBbJXGpMzCh0OYrzuIRe/+zRj0ncV1YfEsJb2yWBuiza0+y2Ljco7hdd4wr+7eJm7cfn+NvAw==",
+      "version": "0.1102.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1102.3.tgz",
+      "integrity": "sha512-+skN/lDvWPxiQl0d2maVtfqgr/aRIx4cZdlTTp20FQ14J8BK9xFHuexnhQ17jdVYCIrgWoPDz2d9ZRw7e6pXvA==",
       "dev": true,
       "requires": {
-        "@angular-devkit/core": "10.2.3",
-        "rxjs": "6.6.2"
+        "@angular-devkit/core": "11.2.3",
+        "rxjs": "6.6.3"
       },
       "dependencies": {
         "rxjs": {
-          "version": "6.6.2",
-          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
-          "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+          "version": "6.6.3",
+          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.3.tgz",
+          "integrity": "sha512-trsQc+xYYXZ3urjOiJOuCOa5N3jAZ3eiSpQB5hIT8zGlL2QfnHLJ2r7GMkBGuIausdJN1OneaI6gQlsqNHHmZQ==",
           "dev": true,
           "requires": {
             "tslib": "^1.9.0"
@@ -43,33 +31,34 @@
       }
     },
     "@angular-devkit/build-angular": {
-      "version": "0.1101.4",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-0.1101.4.tgz",
-      "integrity": "sha512-iH4JMAmNazsWb7wF++3dIPIn1hJUqvidWPfBIHm6AyGLVvCQoAHVnK4Zp07NaCRnpu8ZVlrADJqmSQ3coYYVvg==",
+      "version": "0.1102.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-0.1102.3.tgz",
+      "integrity": "sha512-JY79mjBffrd43ltXxIEqff5AruRA4jFl4B/0fztePHl4ASTkXIDka8aeSOSrOkkcFFp4sT6O6dmtc2KhX8/87g==",
       "dev": true,
       "requires": {
-        "@angular-devkit/architect": "0.1101.4",
-        "@angular-devkit/build-optimizer": "0.1101.4",
-        "@angular-devkit/build-webpack": "0.1101.4",
-        "@angular-devkit/core": "11.1.4",
+        "@angular-devkit/architect": "0.1102.3",
+        "@angular-devkit/build-optimizer": "0.1102.3",
+        "@angular-devkit/build-webpack": "0.1102.3",
+        "@angular-devkit/core": "11.2.3",
         "@babel/core": "7.12.10",
         "@babel/generator": "7.12.11",
+        "@babel/plugin-transform-async-to-generator": "7.12.1",
         "@babel/plugin-transform-runtime": "7.12.10",
         "@babel/preset-env": "7.12.11",
         "@babel/runtime": "7.12.5",
         "@babel/template": "7.12.7",
         "@jsdevtools/coverage-istanbul-loader": "3.0.5",
-        "@ngtools/webpack": "11.1.4",
+        "@ngtools/webpack": "11.2.3",
         "ansi-colors": "4.1.1",
-        "autoprefixer": "10.2.1",
+        "autoprefixer": "10.2.4",
         "babel-loader": "8.2.2",
         "browserslist": "^4.9.1",
         "cacache": "15.0.5",
         "caniuse-lite": "^1.0.30001032",
         "circular-dependency-plugin": "5.2.2",
         "copy-webpack-plugin": "6.3.2",
-        "core-js": "3.8.2",
-        "critters": "0.0.6",
+        "core-js": "3.8.3",
+        "critters": "0.0.7",
         "css-loader": "5.0.1",
         "cssnano": "4.1.10",
         "file-loader": "6.2.0",
@@ -79,14 +68,14 @@
         "inquirer": "7.3.3",
         "jest-worker": "26.6.2",
         "karma-source-map-support": "1.4.0",
-        "less": "4.1.0",
+        "less": "4.1.1",
         "less-loader": "7.3.0",
         "license-webpack-plugin": "2.3.11",
         "loader-utils": "2.0.0",
-        "mini-css-extract-plugin": "1.3.3",
+        "mini-css-extract-plugin": "1.3.5",
         "minimatch": "3.0.4",
-        "open": "7.3.1",
-        "ora": "5.2.0",
+        "open": "7.4.0",
+        "ora": "5.3.0",
         "parse5-html-rewriting-stream": "6.0.1",
         "pnp-webpack-plugin": "1.6.4",
         "postcss": "8.2.4",
@@ -96,54 +85,31 @@
         "regenerator-runtime": "0.13.7",
         "resolve-url-loader": "3.1.2",
         "rimraf": "3.0.2",
-        "rollup": "2.36.1",
+        "rollup": "2.38.4",
         "rxjs": "6.6.3",
-        "sass": "1.32.4",
+        "sass": "1.32.6",
         "sass-loader": "10.1.1",
         "semver": "7.3.4",
         "source-map": "0.7.3",
         "source-map-loader": "1.1.3",
         "source-map-support": "0.5.19",
-        "speed-measure-webpack-plugin": "1.3.3",
+        "speed-measure-webpack-plugin": "1.4.2",
         "style-loader": "2.0.0",
         "stylus": "0.54.8",
-        "stylus-loader": "4.3.2",
+        "stylus-loader": "4.3.3",
         "terser": "5.5.1",
         "terser-webpack-plugin": "4.2.3",
         "text-table": "0.2.0",
         "tree-kill": "1.2.2",
         "webpack": "4.44.2",
         "webpack-dev-middleware": "3.7.2",
-        "webpack-dev-server": "3.11.1",
+        "webpack-dev-server": "3.11.2",
         "webpack-merge": "5.7.3",
         "webpack-sources": "2.2.0",
         "webpack-subresource-integrity": "1.5.2",
         "worker-plugin": "5.0.0"
       },
       "dependencies": {
-        "@angular-devkit/architect": {
-          "version": "0.1101.4",
-          "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1101.4.tgz",
-          "integrity": "sha512-yur0mX156ZX1aXE7d8Z1z6sYjDk771iCyijLCN8MCx35lHIPGwMZwsB/dkttTChVHS8wJ+9YZnIucEBoh9ij3g==",
-          "dev": true,
-          "requires": {
-            "@angular-devkit/core": "11.1.4",
-            "rxjs": "6.6.3"
-          }
-        },
-        "@angular-devkit/core": {
-          "version": "11.1.4",
-          "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-11.1.4.tgz",
-          "integrity": "sha512-xqjUIdMTDNjZ8jkzlDSQbhmTwF2tOLlT0iRI9mb7pN4VIS0LI/Xu0iTqDUrVs0Hqtb9609dz13LXu5zbQSb+cw==",
-          "dev": true,
-          "requires": {
-            "ajv": "6.12.6",
-            "fast-json-stable-stringify": "2.1.0",
-            "magic-string": "0.25.7",
-            "rxjs": "6.6.3",
-            "source-map": "0.7.3"
-          }
-        },
         "@babel/core": {
           "version": "7.12.10",
           "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.12.10.tgz",
@@ -181,16 +147,67 @@
             }
           }
         },
-        "ajv": {
-          "version": "6.12.6",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
-          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+        "less": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/less/-/less-4.1.1.tgz",
+          "integrity": "sha512-w09o8tZFPThBscl5d0Ggp3RcrKIouBoQscnOMgFH3n5V3kN/CXGHNfCkRPtxJk6nKryDXaV9aHLK55RXuH4sAw==",
           "dev": true,
           "requires": {
-            "fast-deep-equal": "^3.1.1",
-            "fast-json-stable-stringify": "^2.0.0",
-            "json-schema-traverse": "^0.4.1",
-            "uri-js": "^4.2.2"
+            "copy-anything": "^2.0.1",
+            "errno": "^0.1.1",
+            "graceful-fs": "^4.1.2",
+            "image-size": "~0.5.0",
+            "make-dir": "^2.1.0",
+            "mime": "^1.4.1",
+            "needle": "^2.5.2",
+            "parse-node-version": "^1.0.1",
+            "source-map": "~0.6.0",
+            "tslib": "^1.10.0"
+          },
+          "dependencies": {
+            "source-map": {
+              "version": "0.6.1",
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+              "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+              "dev": true,
+              "optional": true
+            }
+          }
+        },
+        "make-dir": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
+          "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "pify": "^4.0.1",
+            "semver": "^5.6.0"
+          },
+          "dependencies": {
+            "semver": {
+              "version": "5.7.1",
+              "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+              "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+              "dev": true,
+              "optional": true
+            }
+          }
+        },
+        "ora": {
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/ora/-/ora-5.3.0.tgz",
+          "integrity": "sha512-zAKMgGXUim0Jyd6CXK9lraBnD3H5yPGBPPOkC23a2BG6hsm4Zu6OQSjQuEtV0BHDf4aKHcUFvJiGRrFuW3MG8g==",
+          "dev": true,
+          "requires": {
+            "bl": "^4.0.3",
+            "chalk": "^4.1.0",
+            "cli-cursor": "^3.1.0",
+            "cli-spinners": "^2.5.0",
+            "is-interactive": "^1.0.0",
+            "log-symbols": "^4.0.0",
+            "strip-ansi": "^6.0.0",
+            "wcwidth": "^1.0.1"
           }
         },
         "rxjs": {
@@ -211,72 +228,37 @@
       }
     },
     "@angular-devkit/build-optimizer": {
-      "version": "0.1101.4",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-optimizer/-/build-optimizer-0.1101.4.tgz",
-      "integrity": "sha512-2IdpwftE4ERcfc4TynWVuZkSu5L7BHDgBVktNYjINheqo0zU0fw01Y6rn9R9lKzsn3ka4GWP2hwnA1T1WWGl9A==",
+      "version": "0.1102.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/build-optimizer/-/build-optimizer-0.1102.3.tgz",
+      "integrity": "sha512-MisroE3Zwgp3rFMZstJxFGfLkYJ2Et78HAycYmD4FYvu5KPUbUJqOB9CcVO3R+WKMzb+/dH+da7eaJ3uJhIbBg==",
       "dev": true,
       "requires": {
         "loader-utils": "2.0.0",
         "source-map": "0.7.3",
         "tslib": "2.1.0",
-        "typescript": "4.1.3",
+        "typescript": "4.1.5",
         "webpack-sources": "2.2.0"
       },
       "dependencies": {
         "typescript": {
-          "version": "4.1.3",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.1.3.tgz",
-          "integrity": "sha512-B3ZIOf1IKeH2ixgHhj6la6xdwR9QrLC5d1VKeCSY4tvkqhF2eqd9O7txNlS0PO3GrBAFIdr3L1ndNwteUbZLYg==",
+          "version": "4.1.5",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.1.5.tgz",
+          "integrity": "sha512-6OSu9PTIzmn9TCDiovULTnET6BgXtDYL4Gg4szY+cGsc3JP1dQL8qvE8kShTRx1NIw4Q9IBHlwODjkjWEtMUyA==",
           "dev": true
         }
       }
     },
     "@angular-devkit/build-webpack": {
-      "version": "0.1101.4",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1101.4.tgz",
-      "integrity": "sha512-wc8Nw9ZNUBK5XwFFmtkKdPvRRMInOYe4pyk8b+OcLEGOQgJlAaP2/rXdceI7V227DLaKpqzYL0Tx10cfsq9Iqw==",
+      "version": "0.1102.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1102.3.tgz",
+      "integrity": "sha512-591fjIcIq00R/wCvLs9AzrpTu8p4ojrE18fKsIBHVEw1q7Of5mpWrGV5oO7/JMx1rG1RzUm8+/Y5ntfLUEeKrg==",
       "dev": true,
       "requires": {
-        "@angular-devkit/architect": "0.1101.4",
-        "@angular-devkit/core": "11.1.4",
+        "@angular-devkit/architect": "0.1102.3",
+        "@angular-devkit/core": "11.2.3",
         "rxjs": "6.6.3"
       },
       "dependencies": {
-        "@angular-devkit/architect": {
-          "version": "0.1101.4",
-          "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1101.4.tgz",
-          "integrity": "sha512-yur0mX156ZX1aXE7d8Z1z6sYjDk771iCyijLCN8MCx35lHIPGwMZwsB/dkttTChVHS8wJ+9YZnIucEBoh9ij3g==",
-          "dev": true,
-          "requires": {
-            "@angular-devkit/core": "11.1.4",
-            "rxjs": "6.6.3"
-          }
-        },
-        "@angular-devkit/core": {
-          "version": "11.1.4",
-          "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-11.1.4.tgz",
-          "integrity": "sha512-xqjUIdMTDNjZ8jkzlDSQbhmTwF2tOLlT0iRI9mb7pN4VIS0LI/Xu0iTqDUrVs0Hqtb9609dz13LXu5zbQSb+cw==",
-          "dev": true,
-          "requires": {
-            "ajv": "6.12.6",
-            "fast-json-stable-stringify": "2.1.0",
-            "magic-string": "0.25.7",
-            "rxjs": "6.6.3",
-            "source-map": "0.7.3"
-          }
-        },
-        "ajv": {
-          "version": "6.12.6",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
-          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
-          "dev": true,
-          "requires": {
-            "fast-deep-equal": "^3.1.1",
-            "fast-json-stable-stringify": "^2.0.0",
-            "json-schema-traverse": "^0.4.1",
-            "uri-js": "^4.2.2"
-          }
-        },
         "rxjs": {
           "version": "6.6.3",
           "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.3.tgz",
@@ -295,22 +277,34 @@
       }
     },
     "@angular-devkit/core": {
-      "version": "10.2.3",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-10.2.3.tgz",
-      "integrity": "sha512-pMM1v9Xjqx6YLOQxQYs0D+03H6XPDZLS8cyEtoQX2iYdh8qlKHZVbJa2WsfzwMoIPtgcXfQAXn113VEgrQPLFA==",
+      "version": "11.2.3",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-11.2.3.tgz",
+      "integrity": "sha512-2JEGXzFqjTqVls2uIZEE0sk4VY9a/alxBAq8BFYIVbvzKsL9gAY71Ztf21zrhQrZop9qeuLJtOAbp00QyYUaQA==",
       "dev": true,
       "requires": {
-        "ajv": "6.12.4",
+        "ajv": "6.12.6",
         "fast-json-stable-stringify": "2.1.0",
         "magic-string": "0.25.7",
-        "rxjs": "6.6.2",
+        "rxjs": "6.6.3",
         "source-map": "0.7.3"
       },
       "dependencies": {
+        "ajv": {
+          "version": "6.12.6",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+          "dev": true,
+          "requires": {
+            "fast-deep-equal": "^3.1.1",
+            "fast-json-stable-stringify": "^2.0.0",
+            "json-schema-traverse": "^0.4.1",
+            "uri-js": "^4.2.2"
+          }
+        },
         "rxjs": {
-          "version": "6.6.2",
-          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.2.tgz",
-          "integrity": "sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg==",
+          "version": "6.6.3",
+          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.3.tgz",
+          "integrity": "sha512-trsQc+xYYXZ3urjOiJOuCOa5N3jAZ3eiSpQB5hIT8zGlL2QfnHLJ2r7GMkBGuIausdJN1OneaI6gQlsqNHHmZQ==",
           "dev": true,
           "requires": {
             "tslib": "^1.9.0"
@@ -1375,14 +1369,14 @@
       }
     },
     "@babel/plugin-transform-async-to-generator": {
-      "version": "7.13.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.13.0.tgz",
-      "integrity": "sha512-3j6E004Dx0K3eGmhxVJxwwI89CTJrce7lg3UrtFuDAVQ/2+SJ/h/aSFOeE6/n0WB1GsOffsJp6MnPQNQ8nmwhg==",
+      "version": "7.12.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.12.1.tgz",
+      "integrity": "sha512-SDtqoEcarK1DFlRJ1hHRY5HvJUj5kX4qmtpMAm2QnhOlyuMC4TMdCRgW6WXpv93rZeYNeLP22y8Aq2dbcDRM1A==",
       "dev": true,
       "requires": {
-        "@babel/helper-module-imports": "^7.12.13",
-        "@babel/helper-plugin-utils": "^7.13.0",
-        "@babel/helper-remap-async-to-generator": "^7.13.0"
+        "@babel/helper-module-imports": "^7.12.1",
+        "@babel/helper-plugin-utils": "^7.10.4",
+        "@babel/helper-remap-async-to-generator": "^7.12.1"
       }
     },
     "@babel/plugin-transform-block-scoped-functions": {
@@ -2159,56 +2153,14 @@
       }
     },
     "@ngtools/webpack": {
-      "version": "11.1.4",
-      "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-11.1.4.tgz",
-      "integrity": "sha512-fM17s/mGY/DV9/a/d3lsFiZdL8PfKRY0VGPHCujBIWv9KQg1gUUNkbTepFaNPCBK/bWDH/fIXuNRIHhy1NUeIA==",
+      "version": "11.2.3",
+      "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-11.2.3.tgz",
+      "integrity": "sha512-a211iIvZHRaOCekBSt15nI7ZnQTeVeICC7Hb+anS10oJDS1wEPefOpmt4O1eTVOL9AcLTL1unIJ4ill9WilOjw==",
       "dev": true,
       "requires": {
-        "@angular-devkit/core": "11.1.4",
-        "enhanced-resolve": "5.6.0",
+        "@angular-devkit/core": "11.2.3",
+        "enhanced-resolve": "5.7.0",
         "webpack-sources": "2.2.0"
-      },
-      "dependencies": {
-        "@angular-devkit/core": {
-          "version": "11.1.4",
-          "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-11.1.4.tgz",
-          "integrity": "sha512-xqjUIdMTDNjZ8jkzlDSQbhmTwF2tOLlT0iRI9mb7pN4VIS0LI/Xu0iTqDUrVs0Hqtb9609dz13LXu5zbQSb+cw==",
-          "dev": true,
-          "requires": {
-            "ajv": "6.12.6",
-            "fast-json-stable-stringify": "2.1.0",
-            "magic-string": "0.25.7",
-            "rxjs": "6.6.3",
-            "source-map": "0.7.3"
-          }
-        },
-        "ajv": {
-          "version": "6.12.6",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
-          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
-          "dev": true,
-          "requires": {
-            "fast-deep-equal": "^3.1.1",
-            "fast-json-stable-stringify": "^2.0.0",
-            "json-schema-traverse": "^0.4.1",
-            "uri-js": "^4.2.2"
-          }
-        },
-        "rxjs": {
-          "version": "6.6.3",
-          "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.3.tgz",
-          "integrity": "sha512-trsQc+xYYXZ3urjOiJOuCOa5N3jAZ3eiSpQB5hIT8zGlL2QfnHLJ2r7GMkBGuIausdJN1OneaI6gQlsqNHHmZQ==",
-          "dev": true,
-          "requires": {
-            "tslib": "^1.9.0"
-          }
-        },
-        "tslib": {
-          "version": "1.14.1",
-          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
-          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
-          "dev": true
-        }
       }
     },
     "@nodelib/fs.scandir": {
@@ -2665,9 +2617,9 @@
       "dev": true
     },
     "@types/prettier": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.2.1.tgz",
-      "integrity": "sha512-DxZZbyMAM9GWEzXL+BMZROWz9oo6A9EilwwOMET2UVu2uZTqMWS5S69KVtuVKaRjCUpcrOXRalet86/OpG4kqw==",
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.2.2.tgz",
+      "integrity": "sha512-i99hy7Ki19EqVOl77WplDrvgNugHnsSjECVR/wUrzw2TJXz1zlUfT2ngGckR6xN7yFYaijsMAqPkOLx9HgUqHg==",
       "dev": true
     },
     "@types/q": {
@@ -3321,13 +3273,13 @@
       "dev": true
     },
     "autoprefixer": {
-      "version": "10.2.1",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.2.1.tgz",
-      "integrity": "sha512-dwP0UjyYvROUvtU+boBx8ff5pPWami1NGTrJs9YUsS/oZVbRAcdNHOOuXSA1fc46tgKqe072cVaKD69rvCc3QQ==",
+      "version": "10.2.4",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.2.4.tgz",
+      "integrity": "sha512-DCCdUQiMD+P/as8m3XkeTUkUKuuRqLGcwD0nll7wevhqoJfMRpJlkFd1+MQh1pvupjiQuip42lc/VFvfUTMSKw==",
       "dev": true,
       "requires": {
         "browserslist": "^4.16.1",
-        "caniuse-lite": "^1.0.30001173",
+        "caniuse-lite": "^1.0.30001181",
         "colorette": "^1.2.1",
         "fraction.js": "^4.0.13",
         "normalize-range": "^0.1.2",
@@ -4694,9 +4646,9 @@
       }
     },
     "core-js": {
-      "version": "3.8.2",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.8.2.tgz",
-      "integrity": "sha512-FfApuSRgrR6G5s58casCBd9M2k+4ikuu4wbW6pJyYU7bd9zvFc9qf7vr5xmrZOhT9nn+8uwlH1oRR9jTnFoA3A==",
+      "version": "3.8.3",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.8.3.tgz",
+      "integrity": "sha512-KPYXeVZYemC2TkNEkX/01I+7yd+nX3KddKwZ1Ww7SKWdI2wQprSgLmrTddT8nw92AjEklTsPBoSdQBhbI1bQ6Q==",
       "dev": true
     },
     "core-js-compat": {
@@ -4781,9 +4733,9 @@
       }
     },
     "critters": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/critters/-/critters-0.0.6.tgz",
-      "integrity": "sha512-NUB3Om7tkf+XWi9+2kJ2A3l4/tHORDI1UT+nHxUqay2B/tJvMpiXcklDDLBH3fPn9Pe23uu0we/08Ukjy4cLCQ==",
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/critters/-/critters-0.0.7.tgz",
+      "integrity": "sha512-qUF2SaAWFYjNPdCcPpu68p2DnHiosia84yx5mPTlUMQjkjChR+n6sO1/I7yn2U2qNDgSPTd2SoaTIDQcUL+EwQ==",
       "dev": true,
       "requires": {
         "chalk": "^4.1.0",
@@ -6029,9 +5981,9 @@
       }
     },
     "enhanced-resolve": {
-      "version": "5.6.0",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.6.0.tgz",
-      "integrity": "sha512-C3GGDfFZmqUa21o10YRKbZN60DPl0HyXKXxoEnQMWso9u7KMU23L7CBHfr/rVxORddY/8YQZaU2MZ1ewTS8Pcw==",
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.7.0.tgz",
+      "integrity": "sha512-6njwt/NsZFUKhM6j9U8hzVyD4E4r0x7NQzhTCbcWOJ0IQjNSAoalWmb0AE51Wn+fwan5qVESWi7t2ToBxs9vrw==",
       "dev": true,
       "requires": {
         "graceful-fs": "^4.2.4",
@@ -6930,9 +6882,9 @@
       "dev": true
     },
     "fsevents": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz",
-      "integrity": "sha512-Auw9a4AxqWpa9GUfj370BMPzzyncfBABW8Mab7BGWBYDj4Isgq+cDKtx0i6u9jcX9pQDnswsaaOTgTmA5pEjuQ==",
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+      "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
       "dev": true,
       "optional": true
     },
@@ -8875,9 +8827,9 @@
       "dev": true
     },
     "jest-preset-angular": {
-      "version": "8.3.2",
-      "resolved": "https://registry.npmjs.org/jest-preset-angular/-/jest-preset-angular-8.3.2.tgz",
-      "integrity": "sha512-mdETK9E5tkCJPnPzB7NLXDB7CULbUEwcrA7eKU7WdR0u7ZIJqP0pvQxK5Cc70KBsOEaiwJK6LSGJm7aeqjSYYA==",
+      "version": "8.4.0",
+      "resolved": "https://registry.npmjs.org/jest-preset-angular/-/jest-preset-angular-8.4.0.tgz",
+      "integrity": "sha512-lngQRVVMy2qdzhSzUVTkKFsWC+Z2uMFlJf8J5ZeapNZFsRYW2tjlVqdm+sJOTnVmMVnN7CtDqvRDwlyFTIYD+A==",
       "dev": true,
       "requires": {
         "pretty-format": "26.x",
@@ -9207,9 +9159,9 @@
           }
         },
         "ws": {
-          "version": "7.4.3",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.3.tgz",
-          "integrity": "sha512-hr6vCR76GsossIRsr8OLR9acVVm1jyfEWvhbNjtgPOrfvAlKzvyeg/P6r8RuDjRyrcQoPQT7K0DGEPc7Ae6jzA==",
+          "version": "7.4.4",
+          "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.4.tgz",
+          "integrity": "sha512-Qm8k8ojNQIMx7S+Zp8u/uHOx7Qazv3Yv4q68MiWWWOJhiwG5W3x7iqmRtJo8xxrciZUY4vRxUTJCKuRnF28ZZw==",
           "dev": true
         }
       }
@@ -9789,9 +9741,9 @@
       "dev": true
     },
     "mini-css-extract-plugin": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.3.tgz",
-      "integrity": "sha512-7lvliDSMiuZc81kI+5/qxvn47SCM7BehXex3f2c6l/pR3Goj58IQxZh9nuPQ3AkGQgoETyXuIqLDaO5Oa0TyBw==",
+      "version": "1.3.5",
+      "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.5.tgz",
+      "integrity": "sha512-tvmzcwqJJXau4OQE5vT72pRT18o2zF+tQJp8CWchqvfQnTlflkzS+dANYcRdyPRWUWRkfmeNTKltx0NZI/b5dQ==",
       "dev": true,
       "requires": {
         "loader-utils": "^2.0.0",
@@ -10733,9 +10685,9 @@
       }
     },
     "open": {
-      "version": "7.3.1",
-      "resolved": "https://registry.npmjs.org/open/-/open-7.3.1.tgz",
-      "integrity": "sha512-f2wt9DCBKKjlFbjzGb8MOAW8LH8F0mrs1zc7KTjAJ9PZNQbfenzWbNP1VZJvw6ICMG9r14Ah6yfwPn7T7i646A==",
+      "version": "7.4.0",
+      "resolved": "https://registry.npmjs.org/open/-/open-7.4.0.tgz",
+      "integrity": "sha512-PGoBCX/lclIWlpS/R2PQuIR4NJoXh6X5AwVzE7WXnWRGvHg7+4TBCgsujUgiPpm0K1y4qvQeWnCWVTpTKZBtvA==",
       "dev": true,
       "requires": {
         "is-docker": "^2.0.0",
@@ -14836,12 +14788,21 @@
       }
     },
     "rollup": {
-      "version": "2.36.1",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.36.1.tgz",
-      "integrity": "sha512-eAfqho8dyzuVvrGqpR0ITgEdq0zG2QJeWYh+HeuTbpcaXk8vNFc48B7bJa1xYosTCKx0CuW+447oQOW8HgBIZQ==",
+      "version": "2.38.4",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.38.4.tgz",
+      "integrity": "sha512-B0LcJhjiwKkTl79aGVF/u5KdzsH8IylVfV56Ut6c9ouWLJcUK17T83aZBetNYSnZtXf2OHD4+2PbmRW+Fp5ulg==",
       "dev": true,
       "requires": {
-        "fsevents": "~2.1.2"
+        "fsevents": "~2.3.1"
+      },
+      "dependencies": {
+        "fsevents": {
+          "version": "2.3.2",
+          "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+          "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+          "dev": true,
+          "optional": true
+        }
       }
     },
     "rollup-plugin-sourcemaps": {
@@ -15062,9 +15023,9 @@
       }
     },
     "sass": {
-      "version": "1.32.4",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.32.4.tgz",
-      "integrity": "sha512-N0BT0PI/t3+gD8jKa83zJJUb7ssfQnRRfqN+GIErokW6U4guBpfYl8qYB+OFLEho+QvnV5ZH1R9qhUC/Z2Ch9w==",
+      "version": "1.32.6",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.32.6.tgz",
+      "integrity": "sha512-1bcDHDcSqeFtMr0JXI3xc/CXX6c4p0wHHivJdru8W7waM7a1WjKMm4m/Z5sY7CbVw4Whi2Chpcw6DFfSWwGLzQ==",
       "dev": true,
       "requires": {
         "chokidar": ">=2.0.0 <4.0.0"
@@ -15814,64 +15775,12 @@
       }
     },
     "speed-measure-webpack-plugin": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/speed-measure-webpack-plugin/-/speed-measure-webpack-plugin-1.3.3.tgz",
-      "integrity": "sha512-2ljD4Ch/rz2zG3HsLsnPfp23osuPBS0qPuz9sGpkNXTN1Ic4M+W9xB8l8rS8ob2cO4b1L+WTJw/0AJwWYVgcxQ==",
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/speed-measure-webpack-plugin/-/speed-measure-webpack-plugin-1.4.2.tgz",
+      "integrity": "sha512-AtVzD0bnIy2/B0fWqJpJgmhcrfWFhBlduzSo0uwplr/QvB33ZNZj2NEth3NONgdnZJqicK0W0mSxnLSbsVCDbw==",
       "dev": true,
       "requires": {
-        "chalk": "^2.0.1"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
-          "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-          "dev": true,
-          "requires": {
-            "color-convert": "^1.9.0"
-          }
-        },
-        "chalk": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^3.2.1",
-            "escape-string-regexp": "^1.0.5",
-            "supports-color": "^5.3.0"
-          }
-        },
-        "color-convert": {
-          "version": "1.9.3",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
-          "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-          "dev": true,
-          "requires": {
-            "color-name": "1.1.3"
-          }
-        },
-        "color-name": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-          "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
-          "dev": true
-        },
-        "has-flag": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-          "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
-          "dev": true
-        },
-        "supports-color": {
-          "version": "5.5.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-          "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^3.0.0"
-          }
-        }
+        "chalk": "^4.1.0"
       }
     },
     "split-string": {
@@ -16324,9 +16233,9 @@
       }
     },
     "stylus-loader": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/stylus-loader/-/stylus-loader-4.3.2.tgz",
-      "integrity": "sha512-xXVKHY+J7GBlOmqjCL1VvQfc+pFkBdWGtcpJSvBGE49nWWHaukox7KCjRdLTEzjrmHODm4+rLpqkYWzfJteMXQ==",
+      "version": "4.3.3",
+      "resolved": "https://registry.npmjs.org/stylus-loader/-/stylus-loader-4.3.3.tgz",
+      "integrity": "sha512-PpWB5PnCXUzW4WMYhCvNzAHJBjIBPMXwsdfkkKuA9W7k8OQFMl/19/AQvaWsxz2IptxUlCseyJ6TY/eEKJ4+UQ==",
       "dev": true,
       "requires": {
         "fast-glob": "^3.2.4",
@@ -16777,12 +16686,11 @@
       "dev": true
     },
     "ts-jest": {
-      "version": "26.5.2",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-26.5.2.tgz",
-      "integrity": "sha512-bwyJ2zJieSugf7RB+o8fgkMeoMVMM2KPDE0UklRLuACxjwJsOrZNo6chrcScmK33YavPSwhARffy8dZx5LJdUQ==",
+      "version": "26.5.3",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-26.5.3.tgz",
+      "integrity": "sha512-nBiiFGNvtujdLryU7MiMQh1iPmnZ/QvOskBbD2kURiI1MwqvxlxNnaAB/z9TbslMqCsSbu5BXvSSQPc5tvHGeA==",
       "dev": true,
       "requires": {
-        "@types/jest": "26.x",
         "bs-logger": "0.x",
         "buffer-from": "1.x",
         "fast-json-stable-stringify": "2.x",
@@ -18102,9 +18010,9 @@
       }
     },
     "webpack-dev-server": {
-      "version": "3.11.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.11.1.tgz",
-      "integrity": "sha512-u4R3mRzZkbxQVa+MBWi2uVpB5W59H3ekZAJsQlKUTdl7Elcah2EhygTPLmeFXybQkf9i2+L0kn7ik9SnXa6ihQ==",
+      "version": "3.11.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.11.2.tgz",
+      "integrity": "sha512-A80BkuHRQfCiNtGBS1EMf2ChTUs0x+B3wGDFmOeT4rmJOHhHTCH2naNxIHhmkr0/UillP4U3yeIyv1pNp+QDLQ==",
       "dev": true,
       "requires": {
         "ansi-html": "0.0.7",
diff --git a/package.json b/package.json
index 41e438e..dc90eae 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
     "ng": "ng",
     "start": "ng serve",
     "build": "ng build",
-    "test": "npx jest",
+    "test": "npx jest --detectOpenHandles",
     "lint": "ng lint",
     "prettier": "npx prettier --write .",
     "prettier-check": "npx prettier --check .",
@@ -19,22 +19,17 @@
     }
   },
   "jest": {
+    "preset": "jest-preset-angular",
+    "setupFilesAfterEnv": [
+      "<rootDir>/projects/ngx-loadable/setup-jest.ts"
+    ],
     "roots": [
       "<rootDir>/projects/ngx-loadable/src"
     ],
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js"
-    ],
     "collectCoverage": true,
     "collectCoverageFrom": [
       "<rootDir>/projects/ngx-loadable/src/**/*.{ts,js}"
     ],
-    "transform": {
-      ".(ts|tsx)": "ts-jest"
-    },
-    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
     "clearMocks": true,
     "coverageThreshold": {
       "global": {
@@ -43,6 +38,11 @@
         "lines": 10,
         "statements": 10
       }
+    },
+    "globals": {
+      "ts-jest": {
+        "tsconfig": "<rootDir>/projects/ngx-loadable/tsconfig.spec.json"
+      }
     }
   },
   "dependencies": {
@@ -57,11 +57,10 @@
     "@ngrx/store": "^11.0.1",
     "rxjs": "~6.6.0",
     "tslib": "^2.0.0",
-    "zone.js": "~0.11.0"
+    "zone.js": "~0.11.4"
   },
   "devDependencies": {
-    "@angular-builders/jest": "^10.0.1",
-    "@angular-devkit/build-angular": "~0.1101.1",
+    "@angular-devkit/build-angular": "~0.1102.3",
     "@angular/cli": "~11.2.0",
     "@angular/compiler-cli": "~11.2.0",
     "@babel/core": "^7.12.3",
@@ -71,10 +70,11 @@
     "husky": "^4.3.0",
     "jest": "^26.6.3",
     "jest-marbles": "^2.5.1",
+    "jest-preset-angular": "^8.4.0",
     "ng-mocks": "^11.9.0",
     "ng-packagr": "^11.2.0",
     "prettier": "^2.1.2",
-    "ts-jest": "^26.4.4",
+    "ts-jest": "^26.5.3",
     "ts-node": "~8.3.0",
     "tslint": "~6.1.0",
     "typescript": "~4.0.2"
diff --git a/projects/ngx-loadable/setup-jest.ts b/projects/ngx-loadable/setup-jest.ts
new file mode 100644
index 0000000..1100b3e
--- /dev/null
+++ b/projects/ngx-loadable/setup-jest.ts
@@ -0,0 +1 @@
+import 'jest-preset-angular/setup-jest';
diff --git a/projects/ngx-loadable/src/lib/angular/loadable.module.ts b/projects/ngx-loadable/src/lib/angular/loadable.module.ts
index 655b103..38f0aae 100644
--- a/projects/ngx-loadable/src/lib/angular/loadable.module.ts
+++ b/projects/ngx-loadable/src/lib/angular/loadable.module.ts
@@ -27,6 +27,7 @@ import { LoadedValuePipe } from './loaded-value.pipe';
     LoadableErrorComponent,
     LoadableLoadingComponent,
   ],
+  entryComponents: [LoadableLoadingComponent, LoadableErrorComponent],
 })
 export class LoadableModule {
   public static forRoot(
diff --git a/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.spec.ts b/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.spec.ts
new file mode 100644
index 0000000..ec6a907
--- /dev/null
+++ b/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.spec.ts
@@ -0,0 +1,104 @@
+import { Component } from '@angular/core';
+import { fakeAsync, TestBed, tick } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { errored, idle, loaded, loading } from '../../loadable.constructors';
+import { LoadableModule } from '../loadable.module';
+
+@Component({
+  selector: 'ld-test-loaded',
+  template: `
+    <ld-loadable [loadable]="loadable">
+      <p>{{ loadable | loadedValue }}</p>
+    </ld-loadable>
+  `,
+})
+class TestLoadedComponent {
+  loadable = loaded('42');
+}
+
+it('renders the loaded value', () => {
+  TestBed.configureTestingModule({
+    declarations: [TestLoadedComponent],
+    imports: [LoadableModule],
+  });
+  const fixture = TestBed.createComponent(TestLoadedComponent);
+  fixture.detectChanges();
+  expect(
+    fixture.debugElement.query(By.css('p')).nativeElement.textContent
+  ).toEqual('42');
+});
+
+@Component({
+  selector: 'ld-test-loading',
+  template: `
+    <ld-loadable [loadable]="loadable">
+      <p>{{ loadable | loadedValue }}</p>
+    </ld-loadable>
+  `,
+})
+class TestLoadingComponent {
+  loadable = loading;
+}
+
+it('renders the default loading state if loading', fakeAsync(() => {
+  TestBed.configureTestingModule({
+    declarations: [TestLoadingComponent],
+    imports: [LoadableModule],
+  });
+  const fixture = TestBed.createComponent(TestLoadingComponent);
+  fixture.detectChanges();
+  tick(1);
+  expect(
+    fixture.debugElement.query(By.css('ld-loadable-loading'))
+  ).toBeTruthy();
+  expect(fixture.debugElement.query(By.css('p'))).toBeFalsy();
+}));
+
+@Component({
+  selector: 'ld-test-error',
+  template: `
+    <ld-loadable [loadable]="loadable">
+      <p>{{ loadable | loadedValue }}</p>
+    </ld-loadable>
+  `,
+})
+class TestErrorComponent {
+  loadable = errored('error');
+}
+
+it('renders the default error component if errored', fakeAsync(() => {
+  TestBed.configureTestingModule({
+    declarations: [TestErrorComponent],
+    imports: [LoadableModule],
+  });
+  const fixture = TestBed.createComponent(TestErrorComponent);
+  fixture.detectChanges();
+  tick(1);
+  expect(fixture.debugElement.query(By.css('ld-loadable-error'))).toBeTruthy();
+  expect(fixture.debugElement.query(By.css('p'))).toBeFalsy();
+}));
+
+@Component({
+  selector: 'ld-test-idle',
+  template: `
+    <ld-loadable [loadable]="loadable">
+      <p>{{ loadable | loadedValue }}</p>
+    </ld-loadable>
+  `,
+})
+class TestIdleComponent {
+  loadable = idle;
+}
+
+it('renders nothing if idle', () => {
+  TestBed.configureTestingModule({
+    declarations: [TestIdleComponent],
+    imports: [LoadableModule],
+  });
+  const fixture = TestBed.createComponent(TestIdleComponent);
+  fixture.detectChanges();
+  expect(
+    fixture.debugElement.query(By.css('ld-loadable')).nativeElement.children
+      .length
+  ).toEqual(0);
+});
diff --git a/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.ts b/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.ts
index 81d70ce..a20f664 100644
--- a/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.ts
+++ b/projects/ngx-loadable/src/lib/angular/loadable/loadable.component.ts
@@ -86,7 +86,6 @@ export class LoadableComponent implements OnChanges, AfterViewInit {
   }
 
   ngOnChanges(changes: SimpleChanges): void {
-    console.log('ngOnChanges', this.loadable, this.templates);
     if ('loadable' in changes) {
       this.showNgContent = isLoaded(this.loadable);
       this.templateContext = {
@@ -104,6 +103,6 @@ export class LoadableComponent implements OnChanges, AfterViewInit {
   }
 
   ngAfterViewInit(): void {
-    this.updateContent();
+    setTimeout(() => this.updateContent());
   }
 }