@ewc-lib/ewc-footer-links - npm Package Compare versions

Comparing version 1.0.4-alpha to 1.0.5-alpha

package.json

 {
   "name": "@ewc-lib/ewc-footer-links",
-  "version": "1.0.4-alpha",
+  "version": "1.0.5-alpha",
   "description": "",
@@ -5,0 +5,0 @@ "main": "src/main.js",

readme.md

@@ -12,3 +12,3 @@ # Screenshot
 
-Note: changing these attributes during runtime has no effect.
+Note: changing these attributes during runtime will update the href and change the link.
 
@@ -15,0 +15,0 @@ The distance to the left and the right viewport borders default to "5%" and can be set via CSS. For example:

src/html.js

 // all HTML as JS string
 
-export default function get(email, subject) {
+export default function get() {
   return getTemplateTag(`
@@ -9,10 +9,6 @@
   <div class="ewc-footer-link__email">
-    ${email ? `
-      <div class="ewc-footer-link__icon">
+    <div class="ewc-footer-link__icon">
         <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M502.3 190.8c3.9-3.1 9.7-.2 9.7 4.7V400c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V195.6c0-5 5.7-7.8 9.7-4.7 22.4 17.4 52.1 39.5 154.1 113.6 21.1 15.4 56.7 47.8 92.2 47.6 35.7.3 72-32.8 92.3-47.6 102-74.1 131.6-96.3 154-113.7zM256 320c23.2.4 56.6-29.2 73.4-41.4 132.7-96.3 142.8-104.7 173.4-128.7 5.8-4.5 9.2-11.5 9.2-18.9v-19c0-26.5-21.5-48-48-48H48C21.5 64 0 85.5 0 112v19c0 7.4 3.4 14.3 9.2 18.9 30.6 23.9 40.7 32.4 173.4 128.7 16.8 12.2 50.2 41.8 73.4 41.4z"></path></svg>
-      </div>
-      <a class="ewc-footer-links__link" href="mailto:${email}?subject=${encodeURIComponent(subject)}" target="_blank">Feedback</a>
-      `
-      : ""
-    }
+    </div>
+    <a class="ewc-footer-links__link" href="" target="_blank">Feedback</a>
   </div>
@@ -19,0 +15,0 @@

src/main.js

@@ -7,2 +7,4 @@ import HTML from  "./html.js"		// keep this file html free
 	#isInitialized
+	#email
+	#subject
 
@@ -15,12 +17,35 @@ constructor() {
 		if(!this.#isInitialized) {
-			this.appendChild(HTML(
-				this.getAttribute("email"),
-				this.getAttribute("subject")
-			))
+			this.appendChild(HTML())
 			this.#isInitialized = true
 		}
+		this.#update()
 	}
+	
+	static get observedAttributes() { return ["email", "subject"] }
 
+	attributeChangedCallback(name, oldVal, newVal) {
+		if(name==="email") {
+			this.#email = newVal
+		}
+		if(name==="subject") {
+			this.#subject = newVal
+		}
+		this.#update()
+	}
+
+	#update() {
+		// empty if no email
+		if(!this.#email) {
+			if(this.querySelector(".ewc-footer-links__email")) {
+				this.querySelector(".ewc-footer-links__email").innerHTML = ""
+			}
+		} else {
+			if(this.querySelector(".ewc-footer-links__link")) {
+				this.querySelector(".ewc-footer-links__link").href = `mailto:${this.#email}?subject=${encodeURIComponent(this.#subject)}`
+			}
+		}
+	}
+
 }
 
 window.customElements.define('ewc-footer-links', Element)

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

11562

increased by6.12%

Lines of code

68

increased by36%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes