1.0.94

package-lock.json

@@ -1,25 +1,26 @@
 {
   "name": "@designestate/dees-catalog",
-  "version": "1.0.86",
+  "version": "1.0.94",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@designestate/dees-catalog",
-      "version": "1.0.86",
+      "version": "1.0.94",
       "license": "MIT",
       "dependencies": {
         "@designestate/dees-domtools": "^2.0.22",
-        "@designestate/dees-element": "^2.0.15",
+        "@designestate/dees-element": "^2.0.16",
         "@designestate/dees-wcctools": "^1.0.74",
         "@fortawesome/fontawesome-svg-core": "^6.1.1",
         "@fortawesome/free-brands-svg-icons": "^6.1.1",
         "@fortawesome/free-regular-svg-icons": "^6.1.1",
-        "@fortawesome/free-solid-svg-icons": "^6.1.1"
+        "@fortawesome/free-solid-svg-icons": "^6.1.1",
+        "pdfjs-dist": "^2.14.305"
       },
       "devDependencies": {
-        "@gitzone/tsbuild": "^2.1.61",
-        "@gitzone/tsbundle": "^2.0.3",
+        "@gitzone/tsbuild": "^2.1.63",
+        "@gitzone/tsbundle": "^2.0.5",
         "@gitzone/tstest": "^1.0.71",
         "@gitzone/tswatch": "^2.0.1",
         "@pushrocks/projectinfo": "^5.0.1",
@@ -126,9 +127,9 @@
       }
     },
     "node_modules/@designestate/dees-element": {
-      "version": "2.0.15",
-      "resolved": "https://verdaccio.lossless.one/@designestate%2fdees-element/-/dees-element-2.0.15.tgz",
-      "integrity": "sha512-Gn/MQV9GUA+EMM4AAM+8l82uVJZ/u+MgSNqFUMJkVOnhi+uRQmLx3QbMMAqxOSMtjzFaQW3u3vlHg37Wf1ZLqQ==",
+      "version": "2.0.16",
+      "resolved": "https://verdaccio.lossless.one/@designestate%2fdees-element/-/dees-element-2.0.16.tgz",
+      "integrity": "sha512-3NOyet4KbvV5QyauUhNoUAvJ6f/SRGHOsCX+7mP6coBvGAa93jgvAkYrlV16fF5aaKAv3l8SpttZpLVAXNnGUw==",
       "license": "MIT",
       "dependencies": {
         "@designestate/dees-domtools": "^2.0.22",
@@ -213,33 +214,47 @@
       }
     },
     "node_modules/@gitzone/tsbuild": {
-      "version": "2.1.61",
-      "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsbuild/-/tsbuild-2.1.61.tgz",
-      "integrity": "sha512-wKMl3OK6YcXcPutQqOtuZvt2GhxpO+DrvLJ/75zyfEF5JVzOtBdfdfd4Nv3prDKBpViXaqgQVVf1BARKQVA7wA==",
+      "version": "2.1.63",
+      "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsbuild/-/tsbuild-2.1.63.tgz",
+      "integrity": "sha512-FgnFgb3WU0FdpJdhGC/bl518uZ7qPs0RiLlOXb5/yfS3LbOgwAqOTx+qvsqJ+G1WGw777COwJHe9Ut9E15vAEA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@pushrocks/early": "^3.0.6",
+        "@pushrocks/early": "^4.0.2",
         "@pushrocks/smartcli": "^3.0.14",
         "@pushrocks/smartdelay": "^2.0.13",
         "@pushrocks/smartfile": "^9.0.6",
         "@pushrocks/smartlog": "^2.0.44",
-        "@pushrocks/smartpath": "^5.0.4",
+        "@pushrocks/smartpath": "^5.0.5",
         "@pushrocks/smartpromise": "^3.1.7",
-        "typescript": "4.7.0"
+        "typescript": "^4.7.2"
       },
       "bin": {
         "tsbuild": "cli.js"
       }
     },
+    "node_modules/@gitzone/tsbuild/node_modules/typescript": {
+      "version": "4.7.4",
+      "resolved": "https://verdaccio.lossless.one/typescript/-/typescript-4.7.4.tgz",
+      "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=4.2.0"
+      }
+    },
     "node_modules/@gitzone/tsbundle": {
-      "version": "2.0.3",
-      "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsbundle/-/tsbundle-2.0.3.tgz",
-      "integrity": "sha512-XNQgVUu5/h/l30kYWpxB6DQOyEGQ5ZPU2kGdkHAPbFLtZQKpciZgWSkbClg3eKZZn1ArwPIPwJ2MBDWm41H02Q==",
+      "version": "2.0.5",
+      "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsbundle/-/tsbundle-2.0.5.tgz",
+      "integrity": "sha512-nFxxRSZrG6UKRrju1O7t3Bg1bzjBCBG5QgrxZqsFBjAiuAZmmhcqHm5RbpC2/UE4EwCGg45BhZWDhP/oG2f0KA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@pushrocks/early": "^3.0.6",
+        "@pushrocks/early": "^4.0.3",
         "@pushrocks/smartcli": "^3.0.14",
         "@pushrocks/smartfile": "^9.0.6",
         "@pushrocks/smartlog": "^2.0.44",
@@ -248,15 +263,29 @@
         "@pushrocks/smartpromise": "^3.1.7",
         "@pushrocks/smartspawn": "^2.0.9",
         "@types/html-minifier": "^4.0.2",
-        "@types/node": "^17.0.21",
+        "@types/node": "^17.0.38",
         "esbuild": "0.14.27",
         "html-minifier": "^4.0.0",
-        "typescript": "4.7.0"
+        "typescript": "^4.7.2"
       },
       "bin": {
         "tsbundle": "cli.js"
       }
     },
+    "node_modules/@gitzone/tsbundle/node_modules/typescript": {
+      "version": "4.7.4",
+      "resolved": "https://verdaccio.lossless.one/typescript/-/typescript-4.7.4.tgz",
+      "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=4.2.0"
+      }
+    },
     "node_modules/@gitzone/tsrun": {
       "version": "1.2.32",
       "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsrun/-/tsrun-1.2.32.tgz",
@@ -321,18 +350,6 @@
         "tswatch": "cli.js"
       }
     },
-    "node_modules/@gitzone/tswatch/node_modules/@pushrocks/early": {
-      "version": "4.0.2",
-      "resolved": "https://verdaccio.lossless.one/@pushrocks%2fearly/-/early-4.0.2.tgz",
-      "integrity": "sha512-aCFDD3JEtjjjap1oO/gUG39TgIW2QacqU4DgY/Dt7VdR8ZPN6CHB2RYhjrGjQV3PIkw7w04kMIAvTBoY0uLu/w==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@gitzone/tsbuild": "^2.1.60",
-        "@pushrocks/consolecolor": "^2.0.1",
-        "@pushrocks/smartpromise": "^3.1.7"
-      }
-    },
     "node_modules/@leichtgewicht/ip-codec": {
       "version": "2.0.4",
       "resolved": "https://verdaccio.lossless.one/@leichtgewicht%2fip-codec/-/ip-codec-2.0.4.tgz",
@@ -387,15 +404,14 @@
       }
     },
     "node_modules/@pushrocks/early": {
-      "version": "3.0.6",
-      "resolved": "https://verdaccio.lossless.one/@pushrocks%2fearly/-/early-3.0.6.tgz",
-      "integrity": "sha512-ifUU0bbR/p3Vpe+nMg3LYHCPvM9QmRpL83pEYBvZ8KjbkrCxeXTJuNkeO3T8NGfeEL/q+SS8a9oEnpzoT/SGvw==",
+      "version": "4.0.3",
+      "resolved": "https://verdaccio.lossless.one/@pushrocks%2fearly/-/early-4.0.3.tgz",
+      "integrity": "sha512-Xov1TsboU2d399MqByKIDoYWTWCNvBHNwC9u99HuVFx/lN38qdm5bkrLx73msiZ+uKxgpUe6zRR+jTVuoGxjlQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@gitzone/tsbuild": "^2.1.24",
         "@pushrocks/consolecolor": "^2.0.1",
-        "@pushrocks/smartpromise": "^3.0.6"
+        "@pushrocks/smartpromise": "^3.1.7"
       }
     },
     "node_modules/@pushrocks/isohash": {
@@ -1417,9 +1433,9 @@
       "license": "MIT"
     },
     "node_modules/@types/node": {
-      "version": "17.0.35",
-      "resolved": "https://verdaccio.lossless.one/@types%2fnode/-/node-17.0.35.tgz",
-      "integrity": "sha512-vu1SrqBjbbZ3J6vwY17jBs8Sr/BKA+/a/WtjRG+whKg1iuLFOosq872EXS0eXWILdO36DHQQeku/ZcL6hz2fpg==",
+      "version": "17.0.45",
+      "resolved": "https://verdaccio.lossless.one/@types%2fnode/-/node-17.0.45.tgz",
+      "integrity": "sha512-w+tIMs3rq2afQdsPJlODhoUEKzFP1ayaoyl1CcnwtIlsVe7K7bA1NGm4s3PraqTLlXnbIN84zuBlxBWo1u9BLw==",
       "license": "MIT"
     },
     "node_modules/@types/qs": {
@@ -2479,6 +2495,12 @@
         "node": ">=6"
       }
     },
+    "node_modules/dommatrix": {
+      "version": "1.0.3",
+      "resolved": "https://verdaccio.lossless.one/dommatrix/-/dommatrix-1.0.3.tgz",
+      "integrity": "sha512-l32Xp/TLgWb8ReqbVJAFIvXmY7go4nTxxlWiAFyhoQw9RKEOHBZNnyGvJWqDVSPmq3Y9HlM4npqF/T6VMOXhww==",
+      "license": "MIT"
+    },
     "node_modules/duplexer3": {
       "version": "0.1.4",
       "resolved": "https://verdaccio.lossless.one/duplexer3/-/duplexer3-0.1.4.tgz",
@@ -4710,6 +4732,24 @@
         "node": ">=7"
       }
     },
+    "node_modules/pdfjs-dist": {
+      "version": "2.14.305",
+      "resolved": "https://verdaccio.lossless.one/pdfjs-dist/-/pdfjs-dist-2.14.305.tgz",
+      "integrity": "sha512-5f7i25J1dKIBczhgfxEgNxfYNIxXEdxqo6Qb4ehY7Ja+p6AI4uUmk/OcVGXfRGm2ys5iaJJhJUwBFwv6Jl/Qww==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "dommatrix": "^1.0.1",
+        "web-streams-polyfill": "^3.2.1"
+      },
+      "peerDependencies": {
+        "worker-loader": "^3.0.8"
+      },
+      "peerDependenciesMeta": {
+        "worker-loader": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/pdfjs/node_modules/uuid": {
       "version": "8.3.2",
       "resolved": "https://verdaccio.lossless.one/uuid/-/uuid-8.3.2.tgz",
@@ -6137,9 +6177,9 @@
       }
     },
     "@designestate/dees-element": {
-      "version": "2.0.15",
-      "resolved": "https://verdaccio.lossless.one/@designestate%2fdees-element/-/dees-element-2.0.15.tgz",
-      "integrity": "sha512-Gn/MQV9GUA+EMM4AAM+8l82uVJZ/u+MgSNqFUMJkVOnhi+uRQmLx3QbMMAqxOSMtjzFaQW3u3vlHg37Wf1ZLqQ==",
+      "version": "2.0.16",
+      "resolved": "https://verdaccio.lossless.one/@designestate%2fdees-element/-/dees-element-2.0.16.tgz",
+      "integrity": "sha512-3NOyet4KbvV5QyauUhNoUAvJ6f/SRGHOsCX+7mP6coBvGAa93jgvAkYrlV16fF5aaKAv3l8SpttZpLVAXNnGUw==",
       "requires": {
         "@designestate/dees-domtools": "^2.0.22",
         "@pushrocks/isounique": "^1.0.5",
@@ -6197,28 +6237,36 @@
       }
     },
     "@gitzone/tsbuild": {
-      "version": "2.1.61",
-      "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsbuild/-/tsbuild-2.1.61.tgz",
-      "integrity": "sha512-wKMl3OK6YcXcPutQqOtuZvt2GhxpO+DrvLJ/75zyfEF5JVzOtBdfdfd4Nv3prDKBpViXaqgQVVf1BARKQVA7wA==",
+      "version": "2.1.63",
+      "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsbuild/-/tsbuild-2.1.63.tgz",
+      "integrity": "sha512-FgnFgb3WU0FdpJdhGC/bl518uZ7qPs0RiLlOXb5/yfS3LbOgwAqOTx+qvsqJ+G1WGw777COwJHe9Ut9E15vAEA==",
       "dev": true,
       "requires": {
-        "@pushrocks/early": "^3.0.6",
+        "@pushrocks/early": "^4.0.2",
         "@pushrocks/smartcli": "^3.0.14",
         "@pushrocks/smartdelay": "^2.0.13",
         "@pushrocks/smartfile": "^9.0.6",
         "@pushrocks/smartlog": "^2.0.44",
-        "@pushrocks/smartpath": "^5.0.4",
+        "@pushrocks/smartpath": "^5.0.5",
         "@pushrocks/smartpromise": "^3.1.7",
-        "typescript": "4.7.0"
+        "typescript": "^4.7.2"
+      },
+      "dependencies": {
+        "typescript": {
+          "version": "4.7.4",
+          "resolved": "https://verdaccio.lossless.one/typescript/-/typescript-4.7.4.tgz",
+          "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==",
+          "dev": true
+        }
       }
     },
     "@gitzone/tsbundle": {
-      "version": "2.0.3",
-      "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsbundle/-/tsbundle-2.0.3.tgz",
-      "integrity": "sha512-XNQgVUu5/h/l30kYWpxB6DQOyEGQ5ZPU2kGdkHAPbFLtZQKpciZgWSkbClg3eKZZn1ArwPIPwJ2MBDWm41H02Q==",
+      "version": "2.0.5",
+      "resolved": "https://verdaccio.lossless.one/@gitzone%2ftsbundle/-/tsbundle-2.0.5.tgz",
+      "integrity": "sha512-nFxxRSZrG6UKRrju1O7t3Bg1bzjBCBG5QgrxZqsFBjAiuAZmmhcqHm5RbpC2/UE4EwCGg45BhZWDhP/oG2f0KA==",
       "dev": true,
       "requires": {
-        "@pushrocks/early": "^3.0.6",
+        "@pushrocks/early": "^4.0.3",
         "@pushrocks/smartcli": "^3.0.14",
         "@pushrocks/smartfile": "^9.0.6",
         "@pushrocks/smartlog": "^2.0.44",
@@ -6227,10 +6275,18 @@
         "@pushrocks/smartpromise": "^3.1.7",
         "@pushrocks/smartspawn": "^2.0.9",
         "@types/html-minifier": "^4.0.2",
-        "@types/node": "^17.0.21",
+        "@types/node": "^17.0.38",
         "esbuild": "0.14.27",
         "html-minifier": "^4.0.0",
-        "typescript": "4.7.0"
+        "typescript": "^4.7.2"
+      },
+      "dependencies": {
+        "typescript": {
+          "version": "4.7.4",
+          "resolved": "https://verdaccio.lossless.one/typescript/-/typescript-4.7.4.tgz",
+          "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==",
+          "dev": true
+        }
       }
     },
     "@gitzone/tsrun": {
@@ -6283,19 +6339,6 @@
         "@pushrocks/smartserve": "^2.0.27",
         "@pushrocks/smartshell": "^2.0.30",
         "@pushrocks/taskbuffer": "^3.0.1"
-      },
-      "dependencies": {
-        "@pushrocks/early": {
-          "version": "4.0.2",
-          "resolved": "https://verdaccio.lossless.one/@pushrocks%2fearly/-/early-4.0.2.tgz",
-          "integrity": "sha512-aCFDD3JEtjjjap1oO/gUG39TgIW2QacqU4DgY/Dt7VdR8ZPN6CHB2RYhjrGjQV3PIkw7w04kMIAvTBoY0uLu/w==",
-          "dev": true,
-          "requires": {
-            "@gitzone/tsbuild": "^2.1.60",
-            "@pushrocks/consolecolor": "^2.0.1",
-            "@pushrocks/smartpromise": "^3.1.7"
-          }
-        }
       }
     },
     "@leichtgewicht/ip-codec": {
@@ -6346,14 +6389,13 @@
       }
     },
     "@pushrocks/early": {
-      "version": "3.0.6",
-      "resolved": "https://verdaccio.lossless.one/@pushrocks%2fearly/-/early-3.0.6.tgz",
-      "integrity": "sha512-ifUU0bbR/p3Vpe+nMg3LYHCPvM9QmRpL83pEYBvZ8KjbkrCxeXTJuNkeO3T8NGfeEL/q+SS8a9oEnpzoT/SGvw==",
+      "version": "4.0.3",
+      "resolved": "https://verdaccio.lossless.one/@pushrocks%2fearly/-/early-4.0.3.tgz",
+      "integrity": "sha512-Xov1TsboU2d399MqByKIDoYWTWCNvBHNwC9u99HuVFx/lN38qdm5bkrLx73msiZ+uKxgpUe6zRR+jTVuoGxjlQ==",
       "dev": true,
       "requires": {
-        "@gitzone/tsbuild": "^2.1.24",
         "@pushrocks/consolecolor": "^2.0.1",
-        "@pushrocks/smartpromise": "^3.0.6"
+        "@pushrocks/smartpromise": "^3.1.7"
       }
     },
     "@pushrocks/isohash": {
@@ -7282,9 +7324,9 @@
       "integrity": "sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ=="
     },
     "@types/node": {
-      "version": "17.0.35",
-      "resolved": "https://verdaccio.lossless.one/@types%2fnode/-/node-17.0.35.tgz",
-      "integrity": "sha512-vu1SrqBjbbZ3J6vwY17jBs8Sr/BKA+/a/WtjRG+whKg1iuLFOosq872EXS0eXWILdO36DHQQeku/ZcL6hz2fpg=="
+      "version": "17.0.45",
+      "resolved": "https://verdaccio.lossless.one/@types%2fnode/-/node-17.0.45.tgz",
+      "integrity": "sha512-w+tIMs3rq2afQdsPJlODhoUEKzFP1ayaoyl1CcnwtIlsVe7K7bA1NGm4s3PraqTLlXnbIN84zuBlxBWo1u9BLw=="
     },
     "@types/qs": {
       "version": "6.9.7",
@@ -8017,6 +8059,11 @@
         "dns-packet": "^5.2.4"
       }
     },
+    "dommatrix": {
+      "version": "1.0.3",
+      "resolved": "https://verdaccio.lossless.one/dommatrix/-/dommatrix-1.0.3.tgz",
+      "integrity": "sha512-l32Xp/TLgWb8ReqbVJAFIvXmY7go4nTxxlWiAFyhoQw9RKEOHBZNnyGvJWqDVSPmq3Y9HlM4npqF/T6VMOXhww=="
+    },
     "duplexer3": {
       "version": "0.1.4",
       "resolved": "https://verdaccio.lossless.one/duplexer3/-/duplexer3-0.1.4.tgz",
@@ -9451,6 +9498,15 @@
         }
       }
     },
+    "pdfjs-dist": {
+      "version": "2.14.305",
+      "resolved": "https://verdaccio.lossless.one/pdfjs-dist/-/pdfjs-dist-2.14.305.tgz",
+      "integrity": "sha512-5f7i25J1dKIBczhgfxEgNxfYNIxXEdxqo6Qb4ehY7Ja+p6AI4uUmk/OcVGXfRGm2ys5iaJJhJUwBFwv6Jl/Qww==",
+      "requires": {
+        "dommatrix": "^1.0.1",
+        "web-streams-polyfill": "^3.2.1"
+      }
+    },
     "pend": {
       "version": "1.2.0",
       "resolved": "https://verdaccio.lossless.one/pend/-/pend-1.2.0.tgz",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-catalog",
-  "version": "1.0.86",
+  "version": "1.0.94",
   "private": false,
   "description": "website for lossless.com",
   "main": "dist_ts_web/index.js",
@@ -15,16 +15,17 @@
   "license": "MIT",
   "dependencies": {
     "@designestate/dees-domtools": "^2.0.22",
-    "@designestate/dees-element": "^2.0.15",
+    "@designestate/dees-element": "^2.0.16",
     "@designestate/dees-wcctools": "^1.0.74",
     "@fortawesome/fontawesome-svg-core": "^6.1.1",
     "@fortawesome/free-brands-svg-icons": "^6.1.1",
     "@fortawesome/free-regular-svg-icons": "^6.1.1",
-    "@fortawesome/free-solid-svg-icons": "^6.1.1"
+    "@fortawesome/free-solid-svg-icons": "^6.1.1",
+    "pdfjs-dist": "^2.14.305"
   },
   "devDependencies": {
-    "@gitzone/tsbuild": "^2.1.61",
-    "@gitzone/tsbundle": "^2.0.3",
+    "@gitzone/tsbuild": "^2.1.63",
+    "@gitzone/tsbundle": "^2.0.5",
     "@gitzone/tstest": "^1.0.71",
     "@gitzone/tswatch": "^2.0.1",
     "@pushrocks/projectinfo": "^5.0.1",

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@designestate/dees-catalog',
-  version: '1.0.86',
+  version: '1.0.94',
   description: 'website for lossless.com'
 }

ts_web/elements/dees-button-exit.ts

@@ -0,0 +1,53 @@
+import {
+  cssManager,
+  customElement,
+  DeesElement,
+  html,
+  TemplateResult,
+  css,
+  state,
+  property
+} from '@designestate/dees-element';
+
+@customElement('dees-button-exit')
+export class DeesButtonExit extends DeesElement {
+  // DEMO
+  public static demo = () => html`
+    <dees-button-exit></dees-button-exit>
+  `;
+
+  // INSTANCE
+  @property({
+    type: Number
+  })
+  public size: number = 20;
+
+  public styles = [
+    cssManager.defaultStyles,
+    css`
+
+    `
+  ]
+
+  public render (): TemplateResult {
+    return html`
+      <style>
+        .maincontainer {
+          position: relative;
+          width: ${this.size}px;
+          height: ${this.size}px;
+        }
+        .firstLine {
+          position: absolute;
+        }
+        .secondLine {
+          position: absolute;
+        }
+      </style>
+      <div class="maincontainer">
+        <div class="firstLine"></div>
+        <div class="secondLine"></div>
+      </div>
+    `;
+  }
+}

ts_web/elements/dees-button.ts

@@ -86,7 +86,7 @@ export class DeesButton extends DeesElement {
         border-top: ${cssManager.bdTheme('1px solid #eee', '1px solid #444')};
         border-radius: 2px;
         line-height: 40px;
-        padding: 0px 10px;
+        padding: 0px 8px;
         min-width: 100px;
         user-select: none;
         color: ${cssManager.bdTheme('#333', ' #ccc')};
@@ -143,7 +143,7 @@ export class DeesButton extends DeesElement {
         line-height: 48px;
         font-size: 16px;
         padding: 0px 48px;
-        margin-top: 36px;
+        margin-top: 32px;
       }
 
       .button.pending {

ts_web/elements/dees-chips.ts

@@ -65,9 +65,9 @@ export class DeesChips extends DeesElement {
         padding: 8px 12px;
         font-size: 14px;
         color: #fff;
-        border-radius: 30px;
-        margin-right: 3px;
-        margin-bottom: 7px;
+        border-radius: 40px;
+        margin-right: 4px;
+        margin-bottom: 8px;
       }
 
       .chip:hover {

ts_web/elements/dees-icon.ts

@@ -10,6 +10,9 @@ import {
   faMedium,
   faSlackHash,
   faTwitter,
+  faInstagram,
+  faTiktok,
+
 } from '@fortawesome/free-brands-svg-icons';
 
 import {} from '@fortawesome/free-regular-svg-icons';
@@ -22,10 +25,12 @@ type TFontAwesomeIcon =
   // brands
   | 'facebook'
   | 'google'
-  | 'twitter'
   | 'linkedin'
+  | 'instagram'
   | 'medium'
   | 'slack'
+  | 'tiktok'
+  | 'twitter'
   | 'users';
 const faIcons: { [key: string]: IconDefinition } = {
   // normal
@@ -34,9 +39,11 @@ const faIcons: { [key: string]: IconDefinition } = {
   // brands
   facebook: faFacebook,
   google: faGoogle,
+  instagram: faInstagram,
   linkedin: faLinkedin,
   medium: faMedium,
   slack: faSlackHash,
+  tiktok: faTiktok,
   twitter: faTwitter,
   users: faUsers,
 };

ts_web/elements/dees-input-text.ts

@@ -77,6 +77,7 @@ export class DeesInputText extends DeesElement {
           transition: all 0.2s;
           outline: none;
           font-size: 16px;
+          font-family: "Roboto";
           color: ${this.goBright ? '#333' : '#ccc'};
         }
 

ts_web/elements/dees-pdf.ts

@@ -0,0 +1,120 @@
+import { DeesElement, property, html, customElement, domtools } from '@designestate/dees-element';
+import { TemplateResult } from 'lit-html';
+
+import { Deferred } from '@pushrocks/smartpromise';
+
+import type pdfjsTypes from 'pdfjs-dist';
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'dees-pdf': DeesPdf;
+  }
+}
+
+@customElement('dees-pdf')
+export class DeesPdf extends DeesElement {
+  // DEMO
+  public static demo = () => html` <dees-pdf></dees-pdf> `;
+
+  // INSTANCE
+
+  @property()
+  public pdfUrl: string =
+    'https://raw.githubusercontent.com/mozilla/pdf.js/ba2edeae/examples/learning/helloworld.pdf';
+
+  constructor() {
+    super();
+
+    // you have access to all kinds of things through this.
+    // this.setAttribute('gotIt','true');
+  }
+
+  public render(): TemplateResult {
+    return html`
+      <style>
+        :host {
+          font-family: 'Roboto', sans-serif;
+          display: block;
+          box-sizing: border-box;
+          max-width: 800px;
+        }
+        :host([hidden]) {
+          display: none;
+        }
+
+        #pdfcanvas {
+          box-shadow: 0px 0px 5px #ccc;
+          width: 100%;
+        }
+      </style>
+      <canvas id="pdfcanvas" .height=${0} .width=${0}></canvas>
+    `;
+  }
+
+  public static pdfJsReady: Promise<any>;
+  public static pdfjsLib: typeof pdfjsTypes;
+  public async connectedCallback() {
+    super.connectedCallback();
+    if (!DeesPdf.pdfJsReady) {
+      const pdfJsReadyDeferred = domtools.plugins.smartpromise.defer();
+      DeesPdf.pdfJsReady = pdfJsReadyDeferred.promise;
+      const loadDeferred = domtools.plugins.smartpromise.defer();
+      const script = document.createElement('script');
+      script.addEventListener('load', () => {
+        console.log('pdf.js loaded!');
+        loadDeferred.resolve();
+      });
+      script.src = 'https:////mozilla.github.io/pdf.js/build/pdf.js';
+      document.getElementsByTagName('head')[0].appendChild(script);
+      // The workerSrc property shall be specified.
+      await loadDeferred.promise;
+      DeesPdf.pdfjsLib = window['pdfjs-dist/build/pdf'];
+      DeesPdf.pdfjsLib.GlobalWorkerOptions.workerSrc = '//mozilla.github.io/pdf.js/build/pdf.worker.js';
+      pdfJsReadyDeferred.resolve();
+    }
+    await DeesPdf.pdfJsReady;
+    this.displayContent();
+  }
+
+  public async displayContent() {
+    await DeesPdf.pdfJsReady;
+
+    // Asynchronous download of PDF
+    const loadingTask = DeesPdf.pdfjsLib.getDocument(this.pdfUrl);
+    loadingTask.promise.then(
+      (pdf) => {
+        console.log('PDF loaded');
+
+        // Fetch the first page
+        const pageNumber = 1;
+        pdf.getPage(pageNumber).then((page) => {
+          console.log('Page loaded');
+
+          const scale = 10;
+          const viewport = page.getViewport({ scale: scale });
+
+          // Prepare canvas using PDF page dimensions
+          const canvas: any = this.shadowRoot.querySelector('#pdfcanvas');
+          const context = canvas.getContext('2d');
+          canvas.height = viewport.height;
+          canvas.width = viewport.width;
+
+          // Render PDF page into canvas context
+          const renderContext = {
+            canvasContext: context,
+            viewport: viewport,
+          };
+
+          const renderTask = page.render(renderContext);
+          renderTask.promise.then(function () {
+            console.log('Page rendered');
+          });
+        });
+      },
+      (reason) => {
+        // PDF loading error
+        console.error(reason);
+      }
+    );
+  }
+}

ts_web/elements/dees-speechbubble.ts

@@ -59,13 +59,16 @@ export class DeesSpeechbubble extends DeesElement {
       }
 
       .maincontainer {
+        will-change: transform;
+        transition: transform 0.2s;
+        transform: translateX(0px);
         position: relative;
         transition: all 0.2s;
         margin-left: 0px;
       }
 
       .maincontainer:hover {
-        margin-left: 3px;
+        transform: translateX(3px);
       }
 
       .arrow {

ts_web/elements/dees-table.ts

@@ -104,24 +104,27 @@ export class DeesTable<T> extends DeesElement {
     cssManager.defaultStyles,
     css`
       .mainbox {
-        color: #fff;
+        color: ${cssManager.bdTheme('#333', '#fff')};
         font-family: Roboto Mono;
-        padding: 20px;
+        font-size: 16px;
+        padding: 16px;
         display: block;
         width: 100%;
         min-height: 50px;
-        background: #393939;
+        background: ${cssManager.bdTheme('#fafafa', '#333333')};
         border-radius: 3px;
+        border-top: 1px solid ${cssManager.bdTheme('#fff', '#444')};
+        box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
       }
       .headingSeparation {
         margin-top: 7px;
-        border-bottom: 1px solid #bcbcbc;
+        border-bottom: 1px solid ${cssManager.bdTheme('#bcbcbc', '#bcbcbc')};
       }
 
       table,
       .noDataSet {
-        margin-top: 20px;
-        color: #fff;
+        margin-top: 16px;
+        color: ${cssManager.bdTheme('#333', '#fff')};
         border-collapse: collapse;
         width: 100%;
       }
@@ -129,7 +132,7 @@ export class DeesTable<T> extends DeesElement {
         text-align: center;
       }
       tr {
-        border-bottom: 1px dashed #808080;
+        border-bottom: 1px dashed ${cssManager.bdTheme('#999', '#808080')};
         text-align: left;
       }
       tr:last-child {
@@ -140,7 +143,7 @@ export class DeesTable<T> extends DeesElement {
         cursor: pointer;
       }
       tr:hover .innerCellContainer {
-        background: #ffffff10;
+        background: ${cssManager.bdTheme('#22222210', '#ffffff20')};
       }
       tr:first-child:hover {
         cursor: auto;
@@ -149,7 +152,7 @@ export class DeesTable<T> extends DeesElement {
         background: none;
       }
       tr.selected .innerCellContainer {
-        background: #ffffff20
+        background: ${cssManager.bdTheme('#22222220', '#ffffff20')};
       }
       th {
         text-transform: uppercase;
@@ -157,10 +160,10 @@ export class DeesTable<T> extends DeesElement {
       th,
       td {
         padding: 3px 0px;
-        border-right: 1px dashed #808080;
+        border-right: 1px dashed ${cssManager.bdTheme('#999', '#808080')};
       }
       .innerCellContainer {
-        padding: 7px 10px;
+        padding: 6px 8px;
       }
       th:first-child .innerCellContainer,
       td:first-child .innerCellContainer {
@@ -176,11 +179,13 @@ export class DeesTable<T> extends DeesElement {
       }
 
       .tableStatistics {
-        padding: 5px 20px;
-        font-size: 14px;
-        color: #ffffff90;
-        background: #00000050;
-        margin: 20px -20px -20px -20px;
+        padding: 4px 16px;
+        font-size: 12px;
+        color: ${cssManager.bdTheme('#111', '#ffffff90')};
+        background: ${cssManager.bdTheme('#eeeeeb', '#00000050')};
+        margin: 16px -16px -16px -16px;
+        border-bottom-left-radius: 3px;
+        border-bottom-right-radius: 3px;
       }
     `,
   ];

ts_web/elements/index.ts

@@ -1,3 +1,4 @@
+export * from './dees-button-exit.js';
 export * from './dees-button.js';
 export * from './dees-chips.js';
 export * from './dees-form.js';
@@ -9,6 +10,7 @@ export * from './dees-input-fileupload.js';
 export * from './dees-input-quantityselector.js';
 export * from './dees-input-radio.js';
 export * from './dees-input-text.js';
+export * from './dees-pdf.js';
 export * from './dees-speechbubble.js';
 export * from './dees-spinner.js';
 export * from './dees-stepper.js';

ts_web/tsconfig.json

@@ -1,16 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es2017",
-    "module": "es2015",
-    "moduleResolution": "node",
-    "lib": ["es2017", "dom"],
-    "declaration": true,
-    "inlineSources": true,
-    "inlineSourceMap": true,
-    "noUnusedLocals": true,
-    "noFallthroughCasesInSwitch": true,
-    "outDir": "dist/",
-    "skipLibCheck": true,
-    "experimentalDecorators": true
-  }
-}

tsconfig.json

@@ -1,8 +1,10 @@
 {
   "compilerOptions": {
     "experimentalDecorators": true,
-    "target": "ES2020",
-    "module": "ES2020",
-    "moduleResolution": "Node12"
+    "useDefineForClassFields": false,
+    "target": "ES2022",
+    "module": "ES2022",
+    "moduleResolution": "nodenext",
+    "esModuleInterop": true
   }
 }

tslint.json

@@ -1,17 +0,0 @@
-{
-  "extends": ["tslint:latest", "tslint-config-prettier"],
-  "rules": {
-    "semicolon": [true, "always"],
-    "no-console": false,
-    "ordered-imports": false,
-    "object-literal-sort-keys": false,
-    "member-ordering": {
-      "options":{
-        "order": [
-          "static-method"
-        ]
-      }
-    }
-  },
-  "defaultSeverity": "warning"
-}