@jamwidgets/astro 0.6.1 → 0.6.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jamwidgets/astro",
-  "version": "0.6.1",
+  "version": "0.6.3",
   "description": "Astro components and content loaders for Jamwidgets",
   "repository": {
     "type": "git",
@@ -60,7 +60,7 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "@jamwidgets/core": "^0.5.1"
+    "@jamwidgets/core": "^0.5.2"
   },
   "peerDependencies": {
     "astro": "^5.9.0 || ^6.0.0 || ^7.0.0"

package/src/Announcements.astro

@@ -89,6 +89,16 @@ import Theme from "./Theme.astro";
       }
     }
 
+    function safeLinkUrl(value?: string): string | null {
+      if (!value) return null;
+      try {
+        const url = new URL(value, window.location.href);
+        return url.protocol === "http:" || url.protocol === "https:" ? url.href : null;
+      } catch {
+        return null;
+      }
+    }
+
     function renderAnnouncements(announcements: Announcement[]) {
       container.innerHTML = "";
 
@@ -97,25 +107,31 @@ import Theme from "./Theme.astro";
         el.className = `jamwidgets-announcement jamwidgets-announcement-${announcement.announcementType}`;
         el.dataset.announcementId = announcement.id;
 
-        let content = `<span class="jamwidgets-announcement-content">${announcement.content}</span>`;
-
-        if (announcement.linkUrl) {
-          content += ` <a href="${announcement.linkUrl}" class="jamwidgets-announcement-link">${announcement.linkText || "Learn more"}</a>`;
+        const contentEl = document.createElement("span");
+        contentEl.className = "jamwidgets-announcement-content";
+        contentEl.textContent = announcement.content;
+        el.append(contentEl);
+
+        const linkUrl = safeLinkUrl(announcement.linkUrl);
+        if (linkUrl) {
+          const link = document.createElement("a");
+          link.className = "jamwidgets-announcement-link";
+          link.href = linkUrl;
+          link.textContent = announcement.linkText || "Learn more";
+          el.append(" ", link);
         }
 
         if (announcement.isDismissible) {
-          content += `
+          el.insertAdjacentHTML("beforeend", `
             <button type="button" class="jamwidgets-announcement-dismiss" aria-label="Dismiss">
               <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                 <line x1="18" y1="6" x2="6" y2="18"></line>
                 <line x1="6" y1="6" x2="18" y2="18"></line>
               </svg>
             </button>
-          `;
+          `);
         }
 
-        el.innerHTML = content;
-
         // Handle dismiss
         const dismissBtn = el.querySelector(".jamwidgets-announcement-dismiss");
         dismissBtn?.addEventListener("click", async () => {

package/src/Embed.astro

@@ -188,11 +188,13 @@ import Theme from "./Theme.astro";
             const inputType = poll!.settings.multiSelect ? "checkbox" : "radio";
             optionEl.innerHTML = `
               <label class="jamwidgets-poll-label ${isSelected ? "jamwidgets-selected" : ""}">
-                <input type="${inputType}" name="poll-${poll!.id}" value="${option.id}" ${isSelected ? "checked" : ""} />
-                <span class="jamwidgets-poll-text">${option.text}</span>
+                <input type="${inputType}" ${isSelected ? "checked" : ""} />
+                <span class="jamwidgets-poll-text"></span>
               </label>
             `;
             const input = optionEl.querySelector("input")!;
+            input.name = `poll-${poll!.id}`;
+            input.value = option.id;
             input.addEventListener("change", () => {
               if (poll!.settings.multiSelect) {
                 if (input.checked) {
@@ -215,7 +217,7 @@ import Theme from "./Theme.astro";
             optionEl.innerHTML = `
               <div class="jamwidgets-poll-result ${isSelected ? "jamwidgets-voted" : ""}">
                 <div class="jamwidgets-poll-bar" style="width: ${percent}%"></div>
-                <span class="jamwidgets-poll-text">${option.text}</span>
+                <span class="jamwidgets-poll-text"></span>
                 <span class="jamwidgets-poll-percent">${percent}%</span>
               </div>
             `;
@@ -223,10 +225,11 @@ import Theme from "./Theme.astro";
             // Show without results (voted but results hidden)
             optionEl.innerHTML = `
               <div class="jamwidgets-poll-result jamwidgets-no-results ${isSelected ? "jamwidgets-voted" : ""}">
-                <span class="jamwidgets-poll-text">${option.text}</span>
+                <span class="jamwidgets-poll-text"></span>
               </div>
             `;
           }
+          optionEl.querySelector(".jamwidgets-poll-text")!.textContent = option.text;
           optionsEl.appendChild(optionEl);
         });
 

package/src/Poll.astro

@@ -172,11 +172,13 @@ import Theme from "./Theme.astro";
           const inputType = poll!.settings.multiSelect ? "checkbox" : "radio";
           optionEl.innerHTML = `
             <label class="jamwidgets-poll-label ${isSelected ? "jamwidgets-selected" : ""}">
-              <input type="${inputType}" name="poll-${poll!.id}" value="${option.id}" ${isSelected ? "checked" : ""} />
-              <span class="jamwidgets-poll-text">${option.text}</span>
+              <input type="${inputType}" ${isSelected ? "checked" : ""} />
+              <span class="jamwidgets-poll-text"></span>
             </label>
           `;
           const input = optionEl.querySelector("input")!;
+          input.name = `poll-${poll!.id}`;
+          input.value = option.id;
           input.addEventListener("change", () => {
             if (poll!.settings.multiSelect) {
               if (input.checked) {
@@ -199,7 +201,7 @@ import Theme from "./Theme.astro";
           optionEl.innerHTML = `
             <div class="jamwidgets-poll-result ${isSelected ? "jamwidgets-voted" : ""}">
               <div class="jamwidgets-poll-bar" style="width: ${percent}%"></div>
-              <span class="jamwidgets-poll-text">${option.text}</span>
+              <span class="jamwidgets-poll-text"></span>
               <span class="jamwidgets-poll-percent">${percent}%</span>
             </div>
           `;
@@ -207,10 +209,11 @@ import Theme from "./Theme.astro";
           // Show without results (voted but results hidden)
           optionEl.innerHTML = `
             <div class="jamwidgets-poll-result jamwidgets-no-results ${isSelected ? "jamwidgets-voted" : ""}">
-              <span class="jamwidgets-poll-text">${option.text}</span>
+              <span class="jamwidgets-poll-text"></span>
             </div>
           `;
         }
+        optionEl.querySelector(".jamwidgets-poll-text")!.textContent = option.text;
         optionsEl.appendChild(optionEl);
       });