@jamwidgets/astro 0.6.4 → 0.6.7

package/README.md

@@ -234,6 +234,7 @@ import Subscribe from "@jamwidgets/astro/Subscribe";
 - `endpoint` - Base URL (default: `https://jamwidgets.com`)
 - `buttonText` - Submit button text (default: `'Subscribe'`)
 - `placeholder` - Email input placeholder
+- `label` - Accessible name for the email input (default: `'Email address'`)
 - `successMessage` - Custom success message
 - `theme` - `'light'` | `'dark'` | `'auto'` (default: `'light'`)
 - `class` - Additional CSS class
@@ -256,6 +257,10 @@ import SubscribeForm from "@jamwidgets/astro/SubscribeForm";
 </SubscribeForm>
 ```
 
+### Missing content
+
+`Poll`, `Embed` polls, `Gallery` and `RandomPhoto` render nothing when their slug doesn't exist or isn't published, and log a `console.warn` naming it. Create or publish the content in the Jamwidgets dashboard and it appears on the next page load. Other failures still show a short error.
+
 ## JavaScript API
 
 For advanced use cases, use the JavaScript API directly:
@@ -317,6 +322,10 @@ Set semantic CSS custom properties on a wrapper or the widget itself to match yo
 
 Status colors can be customized with `--jamwidgets-color-success`, `--jamwidgets-color-error`, and `--jamwidgets-color-notice`. Components adapt to their container width, so subscribe, waitlist, comments, and feedback controls stack when embedded in a narrow column.
 
+### Cascade layers and Tailwind
+
+Widget styles live in a `jamwidgets` cascade layer. Every component declares the order `@layer theme, base, components, utilities, jamwidgets;` before its rules, so the widgets rank above Tailwind v4's layers (including Preflight in `base`) whichever stylesheet the browser sees first. Your unlayered CSS still overrides the widgets. If your site declares its own layer order, keep `jamwidgets` after `base` or Preflight will reset the widgets' padding, borders and buttons.
+
 ## License
 
 MIT

package/dist/index.d.ts

@@ -6,7 +6,7 @@
  */
 export { DEFAULT_ENDPOINT, API_PATH, VISITOR_STORAGE_KEY, type JamwidgetsConfig, type SeriphConfig, // deprecated alias
 type Comment, type ReactionCounts, type FormSubmitResponse, type SubscribeResponse, type JamwidgetsPost, type JamwidgetsGallery, type GalleryPhoto, type GallerySummary, type SeriphPost, // deprecated alias
-type Announcement, type AnnouncementType, type Poll, type PollOption, type PollSettings, type PollWithResults, type ShowResultsMode, type FeedbackType, buildUrl, getSiteKey, getVisitorId, setVisitorId, type SubmitFormOptions, submitForm, type FetchCommentsOptions, fetchComments, type PostCommentOptions, postComment, type FetchReactionsOptions, type FetchReactionsResponse, fetchReactions, type AddReactionOptions, addReaction, type RemoveReactionOptions, removeReaction, type SubscribeOptions, subscribe, type JoinWaitlistOptions, type JoinWaitlistResponse, joinWaitlist, type ViewCountsOptions, type ViewCounts, type RecordViewResponse, getViewCounts, recordView, type SubmitFeedbackOptions, type SubmitFeedbackResponse, submitFeedback, type FetchPollOptions, fetchPoll, type VotePollOptions, type VotePollResponse, votePoll, type FetchAnnouncementsOptions, fetchAnnouncements, type DismissAnnouncementOptions, dismissAnnouncement, type FetchPostsOptions, fetchPosts, type FetchPostOptions, fetchPost, type FetchGalleriesOptions, fetchGalleries, type FetchGalleryOptions, fetchGallery, type FetchRandomPhotoOptions, fetchRandomPhoto, type SiteConfig, fetchSiteConfig, POWERED_BY_URL, POWERED_BY_LABEL, type ControllerStatus, type ControllerListener, type SubscribeState, type FormState, type ReactionsState, type CommentsState, type WaitlistState, type ViewCountsState, type FeedbackState, type PollState, type AnnouncementsState, SubscribeController, WaitlistController, FormController, ReactionsController, CommentsController, ViewCountsController, FeedbackController, PollController, AnnouncementsController, } from "@jamwidgets/core";
+type Announcement, type AnnouncementType, type Poll, type PollOption, type PollSettings, type PollWithResults, type ShowResultsMode, type FeedbackType, buildUrl, getSiteKey, getVisitorId, setVisitorId, type SubmitFormOptions, submitForm, type FetchCommentsOptions, fetchComments, type PostCommentOptions, postComment, type FetchReactionsOptions, type FetchReactionsResponse, fetchReactions, type AddReactionOptions, addReaction, type RemoveReactionOptions, removeReaction, type SubscribeOptions, subscribe, type JoinWaitlistOptions, type JoinWaitlistResponse, joinWaitlist, type ViewCountsOptions, type ViewCounts, type RecordViewResponse, getViewCounts, recordView, type SubmitFeedbackOptions, type SubmitFeedbackResponse, submitFeedback, type FetchPollOptions, fetchPoll, type VotePollOptions, type VotePollResponse, votePoll, type FetchAnnouncementsOptions, fetchAnnouncements, type DismissAnnouncementOptions, dismissAnnouncement, type FetchPostsOptions, fetchPosts, type FetchPostOptions, fetchPost, type FetchGalleriesOptions, fetchGalleries, type FetchGalleryOptions, fetchGallery, type FetchRandomPhotoOptions, fetchRandomPhoto, JamwidgetsApiError, apiError, isNotFound, type SiteConfig, fetchSiteConfig, POWERED_BY_URL, POWERED_BY_LABEL, type ControllerStatus, type ControllerListener, type SubscribeState, type FormState, type ReactionsState, type CommentsState, type WaitlistState, type ViewCountsState, type FeedbackState, type PollState, type AnnouncementsState, SubscribeController, WaitlistController, FormController, ReactionsController, CommentsController, ViewCountsController, FeedbackController, PollController, AnnouncementsController, } from "@jamwidgets/core";
 export { jamwidgetsPostsLoader, seriphPostsLoader, // deprecated alias
 type JamwidgetsPostsLoaderOptions, type SeriphPostsLoaderOptions, // deprecated alias
 jamwidgetsGalleriesLoader, type JamwidgetsGalleriesLoaderOptions, } from "./loader.js";

package/dist/index.js

@@ -9,7 +9,9 @@ export {
 // Constants
 DEFAULT_ENDPOINT, API_PATH, VISITOR_STORAGE_KEY, 
 // Helpers
-buildUrl, getSiteKey, getVisitorId, setVisitorId, submitForm, fetchComments, postComment, fetchReactions, addReaction, removeReaction, subscribe, joinWaitlist, getViewCounts, recordView, submitFeedback, fetchPoll, votePoll, fetchAnnouncements, dismissAnnouncement, fetchPosts, fetchPost, fetchGalleries, fetchGallery, fetchRandomPhoto, fetchSiteConfig, POWERED_BY_URL, POWERED_BY_LABEL, SubscribeController, WaitlistController, FormController, ReactionsController, CommentsController, ViewCountsController, FeedbackController, PollController, AnnouncementsController, } from "@jamwidgets/core";
+buildUrl, getSiteKey, getVisitorId, setVisitorId, submitForm, fetchComments, postComment, fetchReactions, addReaction, removeReaction, subscribe, joinWaitlist, getViewCounts, recordView, submitFeedback, fetchPoll, votePoll, fetchAnnouncements, dismissAnnouncement, fetchPosts, fetchPost, fetchGalleries, fetchGallery, fetchRandomPhoto, 
+// Errors
+JamwidgetsApiError, apiError, isNotFound, fetchSiteConfig, POWERED_BY_URL, POWERED_BY_LABEL, SubscribeController, WaitlistController, FormController, ReactionsController, CommentsController, ViewCountsController, FeedbackController, PollController, AnnouncementsController, } from "@jamwidgets/core";
 // Re-export loader (Astro-specific)
 export { jamwidgetsPostsLoader, seriphPostsLoader, // deprecated alias
 jamwidgetsGalleriesLoader, } from "./loader.js";

package/package.json

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

package/src/Announcements.astro

@@ -151,6 +151,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
     .jamwidgets-announcements {
       display: flex;

package/src/Comments.astro

@@ -262,6 +262,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
   .jamwidgets-comments {
     color: var(--jamwidgets-text-color);

package/src/Embed.astro

@@ -64,7 +64,7 @@ import Theme from "./Theme.astro";
     userVotes?: string[];
   }
 
-  import { getVisitorId } from "@jamwidgets/core";
+  import { apiError, getVisitorId, warnMissingContent } from "@jamwidgets/core";
 
   class JamwidgetsEmbed extends HTMLElement {
     connectedCallback() {
@@ -134,8 +134,14 @@ import Theme from "./Theme.astro";
 
       async function loadPoll() {
         try {
-          const response = await fetch(`${config.endpoint}/polls/${config.slug}`, { headers });
-          if (!response.ok) throw new Error("Failed to load poll");
+          const response = await fetch(`${config.endpoint}/polls/${encodeURIComponent(config.slug)}`, { headers });
+          if (response.status === 404) {
+            // Missing or unpublished poll: show readers nothing.
+            container.style.display = "none";
+            warnMissingContent("Embedded poll", config.slug);
+            return;
+          }
+          if (!response.ok) throw await apiError(response, "Failed to load poll");
           const data = await response.json();
           poll = data.poll_with_results;
           renderPoll();
@@ -271,8 +277,7 @@ import Theme from "./Theme.astro";
           });
 
           if (!response.ok) {
-            const error = await response.json();
-            throw new Error(error.message || "Failed to vote");
+            throw await apiError(response, "Failed to vote");
           }
 
           const data = await response.json();
@@ -312,6 +317,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
     .jamwidgets-poll {
       font-family: inherit;

package/src/Feedback.astro

@@ -3,7 +3,7 @@
  * Jamwidgets Feedback Component
  *
  * Displays a feedback form for collecting user suggestions.
- * Supports different feedback types (bug, feature, improvement, other).
+ * Supports the API's feedback types: feature, bug and general.
  *
  * @example
  * <Feedback siteKey={import.meta.env.JAMWIDGETS_SITE_KEY} />
@@ -62,11 +62,7 @@ import Theme from "./Theme.astro";
           <span>Bug</span>
         </label>
         <label class="jamwidgets-feedback-type">
-          <input type="radio" name="feedbackType" value="improvement" />
-          <span>Improvement</span>
-        </label>
-        <label class="jamwidgets-feedback-type">
-          <input type="radio" name="feedbackType" value="other" />
+          <input type="radio" name="feedbackType" value="general" />
           <span>Other</span>
         </label>
       </div>
@@ -90,7 +86,7 @@ import Theme from "./Theme.astro";
 </div>
 
 <script>
-  import { getVisitorId } from "@jamwidgets/core";
+  import { apiError, getVisitorId } from "@jamwidgets/core";
 
   document.querySelectorAll("[data-jamwidgets-feedback]").forEach((container) => {
     const endpoint = (container as HTMLElement).dataset.endpoint;
@@ -117,7 +113,7 @@ import Theme from "./Theme.astro";
       if (!content) return;
 
       const typeInput = form.querySelector('input[name="feedbackType"]:checked') as HTMLInputElement | null;
-      const feedbackType = typeInput?.value || "other";
+      const feedbackType = typeInput?.value || "general";
 
       submitBtn.disabled = true;
       submitBtn.textContent = "Sending...";
@@ -132,8 +128,7 @@ import Theme from "./Theme.astro";
         });
 
         if (!response.ok) {
-          const error = await response.json();
-          throw new Error(error.message || "Failed to submit feedback");
+          throw await apiError(response, "Failed to submit feedback");
         }
 
         textarea.value = "";
@@ -163,6 +158,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
   .jamwidgets-feedback {
     font-family: inherit;

package/src/Form.astro

@@ -67,7 +67,7 @@ import Theme from "./Theme.astro";
 </form>
 
 <script>
-  import { generateUUID, getAttributionHeaders, getVisitorId } from "@jamwidgets/core";
+  import { apiError, generateUUID, getAttributionHeaders, getVisitorId } from "@jamwidgets/core";
 
   interface FormSubmitResponse {
     success: boolean;
@@ -145,8 +145,7 @@ import Theme from "./Theme.astro";
         });
 
         if (!response.ok) {
-          const errorText = await response.text();
-          throw new Error(errorText || "Submission failed");
+          throw await apiError(response, "Submission failed");
         }
 
         const result: FormSubmitResponse = await response.json();
@@ -193,6 +192,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
     .jamwidgets-form-message {
       margin-top: 1rem;

package/src/Poll.astro

@@ -89,7 +89,7 @@ import Theme from "./Theme.astro";
     userVotes?: string[];
   }
 
-  import { getVisitorId } from "@jamwidgets/core";
+  import { apiError, getVisitorId, warnMissingContent } from "@jamwidgets/core";
 
   document.querySelectorAll("[data-jamwidgets-poll]").forEach((container) => {
     const endpoint = (container as HTMLElement).dataset.endpoint;
@@ -118,8 +118,14 @@ import Theme from "./Theme.astro";
 
     async function loadPoll() {
       try {
-        const response = await fetch(`${endpoint}/polls/${pollSlug}`, { headers });
-        if (!response.ok) throw new Error("Failed to load poll");
+        const response = await fetch(`${endpoint}/polls/${encodeURIComponent(pollSlug!)}`, { headers });
+        if (response.status === 404) {
+          // Missing or unpublished poll: show visitors nothing.
+          (container as HTMLElement).style.display = "none";
+          warnMissingContent("Poll", pollSlug!);
+          return;
+        }
+        if (!response.ok) throw await apiError(response, "Failed to load poll");
         const data = await response.json();
         poll = data.poll_with_results;
         renderPoll();
@@ -255,8 +261,7 @@ import Theme from "./Theme.astro";
         });
 
         if (!response.ok) {
-          const error = await response.json();
-          throw new Error(error.message || "Failed to vote");
+          throw await apiError(response, "Failed to vote");
         }
 
         const data = await response.json();
@@ -293,6 +298,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
   .jamwidgets-poll {
     font-family: inherit;

package/src/Reactions.astro

@@ -221,6 +221,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
   .jamwidgets-reactions {
     display: flex;

package/src/Subscribe.astro

@@ -26,6 +26,8 @@ interface Props {
   buttonText?: string;
   /** Email input placeholder (default: 'your@email.com') */
   placeholder?: string;
+  /** Accessible name for the email input (default: 'Email address') */
+  label?: string;
   /** Success message override (default: uses server response) */
   successMessage?: string;
   /** Theme preset. Defaults to inheriting the host page. */
@@ -42,6 +44,7 @@ const {
   endpoint = DEFAULT_ENDPOINT,
   buttonText = "Subscribe",
   placeholder = "your@email.com",
+  label = "Email address",
   successMessage,
   theme = "inherit",
   class: className = "",
@@ -68,6 +71,7 @@ import Theme from "./Theme.astro";
       name="email"
       required
       placeholder={placeholder}
+      aria-label={label}
       class="jamwidgets-subscribe-input"
       autocomplete="email"
     />
@@ -93,7 +97,7 @@ import Theme from "./Theme.astro";
     message: string;
   }
 
-  import { getVisitorId } from "@jamwidgets/core";
+  import { apiError, getVisitorId } from "@jamwidgets/core";
 
   document.querySelectorAll("[data-jamwidgets-subscribe]").forEach((form) => {
     form.addEventListener("submit", async (e) => {
@@ -141,8 +145,7 @@ import Theme from "./Theme.astro";
         });
 
         if (!response.ok) {
-          const errorText = await response.text();
-          throw new Error(errorText || "Subscription failed");
+          throw await apiError(response, "Subscription failed");
         }
 
         const result: SubscribeResponse = await response.json();
@@ -190,6 +193,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
   .jamwidgets-subscribe {
     position: relative;

package/src/SubscribeForm.astro

@@ -71,7 +71,7 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
 </form>
 
 <script>
-  import { getAttributionHeaders, getVisitorId } from "@jamwidgets/core";
+  import { apiError, getAttributionHeaders, getVisitorId } from "@jamwidgets/core";
 
   interface SubscribeResponse {
     success: boolean;
@@ -114,8 +114,7 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
         });
 
         if (!response.ok) {
-          const errorText = await response.text();
-          throw new Error(errorText || "Subscription failed");
+          throw await apiError(response, "Subscription failed");
         }
 
         const result: SubscribeResponse = await response.json();

package/src/Theme.astro

@@ -1,4 +1,11 @@
 <style is:global>
+  /* Whichever stylesheet names a layer first fixes its order. If these widget
+     styles load before a Tailwind site's CSS, `jamwidgets` would otherwise
+     become the lowest layer and Tailwind's base reset would strip widget
+     input borders. Naming Tailwind's layers first, and `jamwidgets` last,
+     gives the same order whichever CSS loads first. Every widget repeats
+     this statement; unlayered site CSS still wins. */
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
     :where(
       .jamwidgets-announcements,

package/src/Views.astro

@@ -149,6 +149,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
     .jamwidgets-views {
       display: inline-flex;

package/src/Waitlist.astro

@@ -17,6 +17,8 @@ interface Props {
   theme?: "inherit" | "light" | "dark" | "auto";
   /** Placeholder text for the email input (default: 'Enter your email') */
   placeholder?: string;
+  /** Accessible name for the email input (default: 'Email address') */
+  label?: string;
   /** Button text (default: 'Join Waitlist') */
   buttonText?: string;
   /** Success message (default: "You're on the list!") */
@@ -33,6 +35,7 @@ const {
   endpoint = DEFAULT_ENDPOINT,
   theme = "inherit",
   placeholder = "Enter your email",
+  label = "Email address",
   buttonText = "Join Waitlist",
   successMessage = "You're on the list!",
   class: className = "",
@@ -59,6 +62,8 @@ import Theme from "./Theme.astro";
       name="email"
       class="jamwidgets-waitlist-input"
       placeholder={placeholder}
+      aria-label={label}
+      autocomplete="email"
       required
     />
     <button type="submit" class="jamwidgets-waitlist-submit">
@@ -71,7 +76,7 @@ import Theme from "./Theme.astro";
 </div>
 
 <script>
-  import { getVisitorId } from "@jamwidgets/core";
+  import { apiError, getVisitorId } from "@jamwidgets/core";
 
   document.querySelectorAll("[data-jamwidgets-waitlist]").forEach((container) => {
     const endpoint = (container as HTMLElement).dataset.endpoint;
@@ -111,8 +116,7 @@ import Theme from "./Theme.astro";
         });
 
         if (!response.ok) {
-          const error = await response.json();
-          throw new Error(error.message || "Failed to join waitlist");
+          throw await apiError(response, "Failed to join waitlist");
         }
 
         // Hide form and show success
@@ -143,6 +147,7 @@ import Theme from "./Theme.astro";
 </script>
 
 <style is:global>
+  @layer theme, base, components, utilities, jamwidgets;
   @layer jamwidgets {
   .jamwidgets-waitlist {
     font-family: inherit;

package/src/index.ts

@@ -104,6 +104,11 @@ export {
   type FetchRandomPhotoOptions,
   fetchRandomPhoto,
 
+  // Errors
+  JamwidgetsApiError,
+  apiError,
+  isNotFound,
+
   // Site config + powered-by attribution
   type SiteConfig,
   fetchSiteConfig,