@crediball/elements 0.5.0 → 0.7.0

package/dist/{chunk-6CNCZGCF.js → chunk-KRSZ3FQQ.js}

@@ -185,7 +185,7 @@ var CrediballLowCreditWarningElement = class extends CrediballElement {
 };
 
 // src/paywall.ts
-import { formatMoney } from "@crediball/core";
+import { formatMoney, fetchReferral } from "@crediball/core";
 var CURRENCY_SYMBOLS = { EUR: "\u20AC", USD: "$", GBP: "\xA3" };
 function currencySymbolFor(currency) {
   return CURRENCY_SYMBOLS[currency.toUpperCase()] ?? currency;
@@ -283,15 +283,81 @@ var STYLE = `
     padding: 11px 22px;
     border-radius: var(--crediball-radius, 9999px);
   }
+  .autotopup { margin-top: 16px; }
+  .autotopup-toggle {
+    appearance: none; border: none; cursor: pointer; background: transparent; padding: 0;
+    font: inherit; font-size: 12px; color: var(--crediball-ink-muted, #7a7a7a); text-decoration: underline;
+  }
+  .autotopup-status { margin: 0; font-size: 12px; color: var(--crediball-ink-muted, #7a7a7a); }
+  .autotopup-warning { margin: 0; font-size: 12px; color: var(--crediball-accent, #0066cc); }
+  .autotopup-row { display: flex; gap: 8px; align-items: center; }
+  .autotopup-row select, .autotopup-row input {
+    font: inherit; font-size: 13px; padding: 6px 10px;
+    border-radius: var(--crediball-radius, 9999px); border: 1px solid var(--crediball-hairline, #e0e0e0);
+    background: var(--crediball-canvas, #ffffff); color: var(--crediball-ink, #1d1d1f);
+  }
+  .autotopup-row select { flex: 1; min-width: 0; }
+  .autotopup-row input { width: 72px; }
+  button.autotopup-submit {
+    appearance: none; border: none; cursor: pointer; flex: none;
+    background: var(--crediball-accent, #0066cc); color: var(--crediball-on-accent, #ffffff);
+    font: inherit; font-size: 13px; padding: 6px 14px; border-radius: var(--crediball-radius, 9999px);
+  }
+  .autotopup-hint { margin: 6px 0 0; font-size: 11px; color: var(--crediball-ink-muted, #7a7a7a); }
+  .referral { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--crediball-hairline, #e0e0e0); }
+  .referral-label { margin-bottom: 8px; font-size: 12px; font-weight: 600; color: var(--crediball-ink-muted, #7a7a7a); }
+  .referral-row { display: flex; gap: 8px; align-items: center; }
+  .referral-row .link {
+    flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
+    font-size: 13px; color: var(--crediball-ink, #1d1d1f);
+    border: 1px solid var(--crediball-hairline, #e0e0e0);
+    border-radius: var(--crediball-radius, 9999px); padding: 8px 14px;
+  }
+  button.referral-copy {
+    flex: none; appearance: none; cursor: pointer; background: transparent;
+    color: var(--crediball-ink, #1d1d1f); border: 1px solid var(--crediball-hairline, #e0e0e0);
+    font: inherit; font-size: 14px; padding: 8px 16px; border-radius: var(--crediball-radius, 9999px);
+    white-space: nowrap;
+  }
 `;
 var CrediballPaywallElement = class extends CrediballElement {
-  static get observedAttributes() {
-    return [...CrediballElement.observedAttributes, "open", "title", "description", "amounts"];
-  }
   constructor() {
     super();
+    this.referral = null;
+    this.referralCopied = false;
+    this.autoTopupOpen = false;
     this.shadow = this.attachShadow({ mode: "open" });
   }
+  static get observedAttributes() {
+    return [...CrediballElement.observedAttributes, "open", "title", "description", "amounts"];
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    void this.loadReferral();
+  }
+  attributeChangedCallback(name) {
+    super.attributeChangedCallback(name);
+    if (this.isConnected && (name === "publishable-key" || name === "user-id" || name === "api-url")) {
+      void this.loadReferral();
+    }
+  }
+  /** Fetch the user's invite link for the "Refer a friend" row (best-effort). */
+  async loadReferral() {
+    const publishableKey = this.getAttribute("publishable-key");
+    const userId = this.getAttribute("user-id");
+    const apiUrl = this.getAttribute("api-url") ?? void 0;
+    if (!publishableKey || !userId) {
+      this.referral = null;
+      return;
+    }
+    try {
+      const data = await fetchReferral({ publishableKey, userId, apiUrl });
+      this.referral = data.enabled ? data : null;
+    } catch {
+      this.referral = null;
+    }
+    if (this.hasAttribute("open")) this.render();
+  }
   open() {
     this.setAttribute("open", "");
   }
@@ -356,8 +422,21 @@ var CrediballPaywallElement = class extends CrediballElement {
                    <input class="custom-input" inputmode="decimal" placeholder="${custom?.minEur ?? ""}" aria-label="Custom amount" />
                    <button class="custom-add" type="button">${escapeHtml(addButtonText)}</button>
                  </div>` : ""}
+          ${this.renderAutoTopup(packages, pkgs?.autoTopup, currency)}
           <p class="error" hidden></p>
           <button class="close" part="close" type="button">Not now</button>
+          ${this.referral?.link ? `<div class="referral">
+                   <div class="referral-label">${escapeHtml(
+      (this.getAttribute("referral-label") ?? "Refer a friend \xB7 earn {credits} credits").replace(
+        "{credits}",
+        formatCredits(this.referral.rewardCredits ?? 0)
+      )
+    )}</div>
+                   <div class="referral-row">
+                     <div class="link" title="${escapeHtml(this.referral.link)}">${escapeHtml(this.referral.link)}</div>
+                     <button class="referral-copy" type="button">${this.referralCopied ? "Copied!" : "Copy"}</button>
+                   </div>
+                 </div>` : ""}
         </div>
       </div>
     `;
@@ -365,6 +444,7 @@ var CrediballPaywallElement = class extends CrediballElement {
       if (e.target === e.currentTarget) this.close();
     });
     this.shadow.querySelector(".close")?.addEventListener("click", () => this.close());
+    this.shadow.querySelector(".referral-copy")?.addEventListener("click", () => void this.copyReferral());
     this.shadow.querySelectorAll("button.option").forEach((el) => {
       const btn = el;
       btn.addEventListener("click", () => {
@@ -413,6 +493,78 @@ var CrediballPaywallElement = class extends CrediballElement {
         if (e.key === "Enter") submit();
       });
     }
+    this.shadow.querySelector("[data-open-autotopup]")?.addEventListener("click", () => {
+      this.autoTopupOpen = true;
+      this.render();
+    });
+    this.shadow.querySelector(".autotopup-submit")?.addEventListener("click", () => {
+      const packageId = this.shadow.querySelector(".autotopup-package")?.value;
+      const thresholdCredits = Number(
+        this.shadow.querySelector(".autotopup-threshold")?.value
+      );
+      if (!packageId || !Number.isFinite(thresholdCredits) || thresholdCredits < 0) return;
+      if (this.emit("crediball-enable-autotopup", { packageId, thresholdCredits })) {
+        void this.startAutoTopupCheckout(packageId, thresholdCredits);
+      }
+    });
+    const fixBtn = this.shadow.querySelector("[data-fix-package]");
+    fixBtn?.addEventListener("click", () => {
+      const packageId = fixBtn.dataset.fixPackage;
+      const thresholdCredits = Number(fixBtn.dataset.fixThreshold);
+      if (!packageId || !Number.isFinite(thresholdCredits)) return;
+      if (this.emit("crediball-enable-autotopup", { packageId, thresholdCredits })) {
+        void this.startAutoTopupCheckout(packageId, thresholdCredits);
+      }
+    });
+  }
+  /** HTML for the auto-topup opt-in row / status line / needs_auth-fix prompt. */
+  renderAutoTopup(packages, autoTopup, currency) {
+    if (!packages.length) return "";
+    if (autoTopup?.enabled && autoTopup.status === "active") {
+      const pkg = packages.find((p) => p.id === autoTopup.packageId);
+      return `<div class="autotopup"><p class="autotopup-status">Auto top-up is on \u2014 buying ${escapeHtml(
+        pkg?.name ?? "your package"
+      )} whenever your balance drops below ${formatCredits(autoTopup.thresholdCredits)} credits.</p></div>`;
+    }
+    if (autoTopup?.enabled && (autoTopup.status === "needs_auth" || autoTopup.status === "failed")) {
+      const message = autoTopup.status === "needs_auth" ? "Auto top-up needs you to re-confirm your payment method." : "Auto top-up's last charge failed.";
+      return `<div class="autotopup">
+        <p class="autotopup-warning">${escapeHtml(message)}</p>
+        <button class="autotopup-toggle" type="button" data-fix-package="${escapeHtml(
+        autoTopup.packageId
+      )}" data-fix-threshold="${autoTopup.thresholdCredits}">Fix auto top-up</button>
+      </div>`;
+    }
+    if (this.autoTopupOpen) {
+      const cheapest = packages.reduce((min, p) => p.price < min.price ? p : min, packages[0]);
+      return `<div class="autotopup">
+        <div class="autotopup-row">
+          <select class="autotopup-package" aria-label="Package">
+            ${packages.map(
+        (p) => `<option value="${escapeHtml(p.id)}">${escapeHtml(p.name)} \xB7 ${formatMoney(p.price, currency)}</option>`
+      ).join("")}
+          </select>
+          <input class="autotopup-threshold" inputmode="numeric" aria-label="Threshold credits" value="${cheapest.credits}" />
+          <button class="autotopup-submit" type="button">Turn on</button>
+        </div>
+        <p class="autotopup-hint">Buy that package automatically whenever your balance drops below the credit amount above.</p>
+      </div>`;
+    }
+    return `<div class="autotopup">
+      <button class="autotopup-toggle" type="button" data-open-autotopup>Keep me topped up automatically</button>
+    </div>`;
+  }
+  /** Copy the invite link to the clipboard, with a 2s "Copied!" confirmation. */
+  async copyReferral() {
+    const link = this.referral?.link;
+    if (!link || typeof navigator === "undefined" || !navigator.clipboard) return;
+    await navigator.clipboard.writeText(link);
+    this.referralCopied = true;
+    this.render();
+    setTimeout(() => {
+      this.referralCopied = false;
+      if (this.hasAttribute("open")) this.render();
+    }, 2e3);
   }
   /** Dispatch a cancelable option event; returns true when the host did NOT preventDefault. */
   emit(name, detail) {
@@ -435,6 +587,17 @@ var CrediballPaywallElement = class extends CrediballElement {
       this.client.createSubscriptionCheckout({ planId, returnPath: this.returnPath() })
     );
   }
+  /**
+   * Start the built-in auto-topup setup Checkout and redirect. No money changes
+   * hands here — it only saves a payment method Crediball charges later,
+   * off-session, whenever the balance drops below `thresholdCredits`.
+   */
+  startAutoTopupCheckout(packageId, thresholdCredits) {
+    if (!this.client) return Promise.resolve();
+    return this.redirect(
+      this.client.createAutoTopupCheckout({ packageId, thresholdCredits, returnPath: this.returnPath() })
+    );
+  }
   async redirect(session) {
     try {
       const { url } = await session;
@@ -458,7 +621,7 @@ function showError(el, message) {
 
 // src/referral-card.ts
 import {
-  fetchReferral,
+  fetchReferral as fetchReferral2,
   captureReferral,
   completeStoredReferral
 } from "@crediball/core";
@@ -563,7 +726,7 @@ var CrediballReferralCardElement = class extends CrediballElement {
       return;
     }
     try {
-      this.data = await fetchReferral({ publishableKey, userId, apiUrl });
+      this.data = await fetchReferral2({ publishableKey, userId, apiUrl });
     } catch {
       this.data = null;
     }

package/dist/crediball-elements.iife.js

@@ -133,6 +133,9 @@ var Crediball = (() => {
       this.createSubscriptionCheckout = (input) => {
         return this.postCheckout("/public/subscriptions/checkout", input);
       };
+      this.createAutoTopupCheckout = (input) => {
+        return this.postCheckout("/public/autotopup/setup", input);
+      };
       this.refresh = async () => {
         const { publishableKey, userId } = this.config;
         const headers = { Authorization: `Bearer ${publishableKey}` };
@@ -694,15 +697,81 @@ var Crediball = (() => {
     padding: 11px 22px;
     border-radius: var(--crediball-radius, 9999px);
   }
+  .autotopup { margin-top: 16px; }
+  .autotopup-toggle {
+    appearance: none; border: none; cursor: pointer; background: transparent; padding: 0;
+    font: inherit; font-size: 12px; color: var(--crediball-ink-muted, #7a7a7a); text-decoration: underline;
+  }
+  .autotopup-status { margin: 0; font-size: 12px; color: var(--crediball-ink-muted, #7a7a7a); }
+  .autotopup-warning { margin: 0; font-size: 12px; color: var(--crediball-accent, #0066cc); }
+  .autotopup-row { display: flex; gap: 8px; align-items: center; }
+  .autotopup-row select, .autotopup-row input {
+    font: inherit; font-size: 13px; padding: 6px 10px;
+    border-radius: var(--crediball-radius, 9999px); border: 1px solid var(--crediball-hairline, #e0e0e0);
+    background: var(--crediball-canvas, #ffffff); color: var(--crediball-ink, #1d1d1f);
+  }
+  .autotopup-row select { flex: 1; min-width: 0; }
+  .autotopup-row input { width: 72px; }
+  button.autotopup-submit {
+    appearance: none; border: none; cursor: pointer; flex: none;
+    background: var(--crediball-accent, #0066cc); color: var(--crediball-on-accent, #ffffff);
+    font: inherit; font-size: 13px; padding: 6px 14px; border-radius: var(--crediball-radius, 9999px);
+  }
+  .autotopup-hint { margin: 6px 0 0; font-size: 11px; color: var(--crediball-ink-muted, #7a7a7a); }
+  .referral { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--crediball-hairline, #e0e0e0); }
+  .referral-label { margin-bottom: 8px; font-size: 12px; font-weight: 600; color: var(--crediball-ink-muted, #7a7a7a); }
+  .referral-row { display: flex; gap: 8px; align-items: center; }
+  .referral-row .link {
+    flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
+    font-size: 13px; color: var(--crediball-ink, #1d1d1f);
+    border: 1px solid var(--crediball-hairline, #e0e0e0);
+    border-radius: var(--crediball-radius, 9999px); padding: 8px 14px;
+  }
+  button.referral-copy {
+    flex: none; appearance: none; cursor: pointer; background: transparent;
+    color: var(--crediball-ink, #1d1d1f); border: 1px solid var(--crediball-hairline, #e0e0e0);
+    font: inherit; font-size: 14px; padding: 8px 16px; border-radius: var(--crediball-radius, 9999px);
+    white-space: nowrap;
+  }
 `;
   var CrediballPaywallElement = class extends CrediballElement {
-    static get observedAttributes() {
-      return [...CrediballElement.observedAttributes, "open", "title", "description", "amounts"];
-    }
     constructor() {
       super();
+      this.referral = null;
+      this.referralCopied = false;
+      this.autoTopupOpen = false;
       this.shadow = this.attachShadow({ mode: "open" });
     }
+    static get observedAttributes() {
+      return [...CrediballElement.observedAttributes, "open", "title", "description", "amounts"];
+    }
+    connectedCallback() {
+      super.connectedCallback();
+      void this.loadReferral();
+    }
+    attributeChangedCallback(name) {
+      super.attributeChangedCallback(name);
+      if (this.isConnected && (name === "publishable-key" || name === "user-id" || name === "api-url")) {
+        void this.loadReferral();
+      }
+    }
+    /** Fetch the user's invite link for the "Refer a friend" row (best-effort). */
+    async loadReferral() {
+      const publishableKey = this.getAttribute("publishable-key");
+      const userId = this.getAttribute("user-id");
+      const apiUrl = this.getAttribute("api-url") ?? void 0;
+      if (!publishableKey || !userId) {
+        this.referral = null;
+        return;
+      }
+      try {
+        const data = await fetchReferral({ publishableKey, userId, apiUrl });
+        this.referral = data.enabled ? data : null;
+      } catch {
+        this.referral = null;
+      }
+      if (this.hasAttribute("open")) this.render();
+    }
     open() {
       this.setAttribute("open", "");
     }
@@ -767,8 +836,21 @@ var Crediball = (() => {
                    <input class="custom-input" inputmode="decimal" placeholder="${custom?.minEur ?? ""}" aria-label="Custom amount" />
                    <button class="custom-add" type="button">${escapeHtml(addButtonText)}</button>
                  </div>` : ""}
+          ${this.renderAutoTopup(packages, pkgs?.autoTopup, currency)}
           <p class="error" hidden></p>
           <button class="close" part="close" type="button">Not now</button>
+          ${this.referral?.link ? `<div class="referral">
+                   <div class="referral-label">${escapeHtml(
+        (this.getAttribute("referral-label") ?? "Refer a friend \xB7 earn {credits} credits").replace(
+          "{credits}",
+          formatCredits(this.referral.rewardCredits ?? 0)
+        )
+      )}</div>
+                   <div class="referral-row">
+                     <div class="link" title="${escapeHtml(this.referral.link)}">${escapeHtml(this.referral.link)}</div>
+                     <button class="referral-copy" type="button">${this.referralCopied ? "Copied!" : "Copy"}</button>
+                   </div>
+                 </div>` : ""}
         </div>
       </div>
     `;
@@ -776,6 +858,7 @@ var Crediball = (() => {
         if (e.target === e.currentTarget) this.close();
       });
       this.shadow.querySelector(".close")?.addEventListener("click", () => this.close());
+      this.shadow.querySelector(".referral-copy")?.addEventListener("click", () => void this.copyReferral());
       this.shadow.querySelectorAll("button.option").forEach((el) => {
         const btn = el;
         btn.addEventListener("click", () => {
@@ -824,6 +907,78 @@ var Crediball = (() => {
           if (e.key === "Enter") submit();
         });
       }
+      this.shadow.querySelector("[data-open-autotopup]")?.addEventListener("click", () => {
+        this.autoTopupOpen = true;
+        this.render();
+      });
+      this.shadow.querySelector(".autotopup-submit")?.addEventListener("click", () => {
+        const packageId = this.shadow.querySelector(".autotopup-package")?.value;
+        const thresholdCredits = Number(
+          this.shadow.querySelector(".autotopup-threshold")?.value
+        );
+        if (!packageId || !Number.isFinite(thresholdCredits) || thresholdCredits < 0) return;
+        if (this.emit("crediball-enable-autotopup", { packageId, thresholdCredits })) {
+          void this.startAutoTopupCheckout(packageId, thresholdCredits);
+        }
+      });
+      const fixBtn = this.shadow.querySelector("[data-fix-package]");
+      fixBtn?.addEventListener("click", () => {
+        const packageId = fixBtn.dataset.fixPackage;
+        const thresholdCredits = Number(fixBtn.dataset.fixThreshold);
+        if (!packageId || !Number.isFinite(thresholdCredits)) return;
+        if (this.emit("crediball-enable-autotopup", { packageId, thresholdCredits })) {
+          void this.startAutoTopupCheckout(packageId, thresholdCredits);
+        }
+      });
+    }
+    /** HTML for the auto-topup opt-in row / status line / needs_auth-fix prompt. */
+    renderAutoTopup(packages, autoTopup, currency) {
+      if (!packages.length) return "";
+      if (autoTopup?.enabled && autoTopup.status === "active") {
+        const pkg = packages.find((p) => p.id === autoTopup.packageId);
+        return `<div class="autotopup"><p class="autotopup-status">Auto top-up is on \u2014 buying ${escapeHtml(
+          pkg?.name ?? "your package"
+        )} whenever your balance drops below ${formatCredits(autoTopup.thresholdCredits)} credits.</p></div>`;
+      }
+      if (autoTopup?.enabled && (autoTopup.status === "needs_auth" || autoTopup.status === "failed")) {
+        const message = autoTopup.status === "needs_auth" ? "Auto top-up needs you to re-confirm your payment method." : "Auto top-up's last charge failed.";
+        return `<div class="autotopup">
+        <p class="autotopup-warning">${escapeHtml(message)}</p>
+        <button class="autotopup-toggle" type="button" data-fix-package="${escapeHtml(
+          autoTopup.packageId
+        )}" data-fix-threshold="${autoTopup.thresholdCredits}">Fix auto top-up</button>
+      </div>`;
+      }
+      if (this.autoTopupOpen) {
+        const cheapest = packages.reduce((min, p) => p.price < min.price ? p : min, packages[0]);
+        return `<div class="autotopup">
+        <div class="autotopup-row">
+          <select class="autotopup-package" aria-label="Package">
+            ${packages.map(
+          (p) => `<option value="${escapeHtml(p.id)}">${escapeHtml(p.name)} \xB7 ${formatMoney(p.price, currency)}</option>`
+        ).join("")}
+          </select>
+          <input class="autotopup-threshold" inputmode="numeric" aria-label="Threshold credits" value="${cheapest.credits}" />
+          <button class="autotopup-submit" type="button">Turn on</button>
+        </div>
+        <p class="autotopup-hint">Buy that package automatically whenever your balance drops below the credit amount above.</p>
+      </div>`;
+      }
+      return `<div class="autotopup">
+      <button class="autotopup-toggle" type="button" data-open-autotopup>Keep me topped up automatically</button>
+    </div>`;
+    }
+    /** Copy the invite link to the clipboard, with a 2s "Copied!" confirmation. */
+    async copyReferral() {
+      const link = this.referral?.link;
+      if (!link || typeof navigator === "undefined" || !navigator.clipboard) return;
+      await navigator.clipboard.writeText(link);
+      this.referralCopied = true;
+      this.render();
+      setTimeout(() => {
+        this.referralCopied = false;
+        if (this.hasAttribute("open")) this.render();
+      }, 2e3);
     }
     /** Dispatch a cancelable option event; returns true when the host did NOT preventDefault. */
     emit(name, detail) {
@@ -846,6 +1001,17 @@ var Crediball = (() => {
         this.client.createSubscriptionCheckout({ planId, returnPath: this.returnPath() })
       );
     }
+    /**
+     * Start the built-in auto-topup setup Checkout and redirect. No money changes
+     * hands here — it only saves a payment method Crediball charges later,
+     * off-session, whenever the balance drops below `thresholdCredits`.
+     */
+    startAutoTopupCheckout(packageId, thresholdCredits) {
+      if (!this.client) return Promise.resolve();
+      return this.redirect(
+        this.client.createAutoTopupCheckout({ packageId, thresholdCredits, returnPath: this.returnPath() })
+      );
+    }
     async redirect(session) {
       try {
         const { url } = await session;

package/dist/index.d.ts

@@ -110,11 +110,22 @@ declare class CrediballLowCreditWarningElement extends CrediballElement {
  */
 declare class CrediballPaywallElement extends CrediballElement {
     private shadow;
+    private referral;
+    private referralCopied;
+    private autoTopupOpen;
     static get observedAttributes(): string[];
     constructor();
+    connectedCallback(): void;
+    attributeChangedCallback(name: string): void;
+    /** Fetch the user's invite link for the "Refer a friend" row (best-effort). */
+    private loadReferral;
     open(): void;
     close(): void;
     protected render(): void;
+    /** HTML for the auto-topup opt-in row / status line / needs_auth-fix prompt. */
+    private renderAutoTopup;
+    /** Copy the invite link to the clipboard, with a 2s "Copied!" confirmation. */
+    private copyReferral;
     /** Dispatch a cancelable option event; returns true when the host did NOT preventDefault. */
     private emit;
     private returnPath;
@@ -122,6 +133,12 @@ declare class CrediballPaywallElement extends CrediballElement {
     private startCheckout;
     /** Start the built-in recurring subscription Checkout and redirect. */
     private startSubscriptionCheckout;
+    /**
+     * Start the built-in auto-topup setup Checkout and redirect. No money changes
+     * hands here — it only saves a payment method Crediball charges later,
+     * off-session, whenever the balance drops below `thresholdCredits`.
+     */
+    private startAutoTopupCheckout;
     private redirect;
 }
 

package/dist/index.js

@@ -6,7 +6,7 @@ import {
   CrediballReferralCardElement,
   CrediballTopUpButtonElement,
   CrediballUsageElement
-} from "./chunk-6CNCZGCF.js";
+} from "./chunk-KRSZ3FQQ.js";
 export {
   CrediballBalanceElement,
   CrediballElement,

package/dist/register.js

@@ -5,7 +5,7 @@ import {
   CrediballReferralCardElement,
   CrediballTopUpButtonElement,
   CrediballUsageElement
-} from "./chunk-6CNCZGCF.js";
+} from "./chunk-KRSZ3FQQ.js";
 
 // src/register.ts
 function define(name, ctor) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crediball/elements",
-  "version": "0.5.0",
+  "version": "0.7.0",
   "description": "Framework-agnostic web components for showing Crediball credits inside your AI app.",
   "license": "MIT",
   "author": "Filippo Rezzadore <filipporezzadore@gmail.com>",
@@ -56,7 +56,7 @@
     "prepublishOnly": "npm run build"
   },
   "dependencies": {
-    "@crediball/core": "^0.4.0"
+    "@crediball/core": "^0.6.0"
   },
   "devDependencies": {
     "tsup": "^8.3.5",