azirid-react 0.9.3 → 0.9.4

package/README.md

@@ -689,7 +689,6 @@ Drop-in pricing grid with checkout flow integrated.
 
 ```tsx
 import { PricingTable } from 'azirid-react'
-
 ;<PricingTable
   successUrl={`${window.location.origin}/billing?success=true`}
   cancelUrl={`${window.location.origin}/billing`}
@@ -712,7 +711,6 @@ Flexible payment button with provider selection modal. Supports both plans and p
 
 ```tsx
 import { PayButton } from 'azirid-react'
-
 ;<PayButton
   planId="plan_123"
   successUrl="/billing?success=true"
@@ -725,14 +723,15 @@ import { PayButton } from 'azirid-react'
 
 | Prop         | Type              | Default | Description                                   |
 | ------------ | ----------------- | ------- | --------------------------------------------- |
-| `planId`     | `string`          | —       | Plan to purchase (use `planId` or `intentId`) |
-| `intentId`   | `string`          | —       | Payment intent ID (alternative to `planId`)   |
-| `successUrl` | `string`          | —       | **Required.** Redirect URL after success      |
-| `cancelUrl`  | `string`          | —       | **Required.** Redirect URL on cancel          |
-| `onSuccess`  | `(data) => void`  | —       | Called on successful checkout                 |
-| `onError`    | `(error) => void` | —       | Called on error                               |
-| `children`   | `ReactNode`       | —       | Button label                                  |
-| `disabled`   | `boolean`         | —       | Disable the button                            |
+| `planId`     | `string`          | —       | Plan to purchase (use `planId` or `intentId`)       |
+| `intentId`   | `string`          | —       | Payment intent ID (alternative to `planId`)         |
+| `successUrl` | `string`          | —       | **Required.** Redirect URL after success            |
+| `cancelUrl`  | `string`          | —       | **Required.** Redirect URL on cancel                |
+| `onSuccess`        | `(data) => void`              | —       | Called on successful checkout. For `MANUAL_TRANSFER` and `PAYPHONE`, deferred until the user closes the modal |
+| `onError`          | `(error) => void`             | —       | Called on error                               |
+| `onProviderSelect` | `(provider: string) => void`  | —       | Called when a provider is selected            |
+| `children`         | `ReactNode`                   | —       | Button label                                  |
+| `disabled`         | `boolean`                     | —       | Disable the button                            |
 
 #### `CheckoutButton`
 
@@ -740,7 +739,6 @@ Simple checkout button for a specific plan.
 
 ```tsx
 import { CheckoutButton } from 'azirid-react'
-
 ;<CheckoutButton planId="plan_123" successUrl="/billing?success=true" cancelUrl="/billing">
   Subscribe
 </CheckoutButton>
@@ -752,7 +750,6 @@ Color-coded badge showing the current subscription status.
 
 ```tsx
 import { SubscriptionBadge } from 'azirid-react'
-
 ;<SubscriptionBadge />
 // Renders: "Pro · Active" (green), "Free · Trialing" (blue), etc.
 ```
@@ -765,7 +762,6 @@ Table of invoices with status badges and download links.
 
 ```tsx
 import { InvoiceList } from 'azirid-react'
-
 ;<InvoiceList />
 ```
 
@@ -934,7 +930,6 @@ Card displaying the referral link with copy button and stats.
 
 ```tsx
 import { ReferralCard } from 'azirid-react'
-
 ;<ReferralCard
   title="Refer a Friend"
   description="Share your link and earn rewards for each signup."
@@ -953,7 +948,6 @@ Table showing referral history with status and reward badges.
 
 ```tsx
 import { ReferralStats } from 'azirid-react'
-
 ;<ReferralStats />
 ```
 
@@ -1424,7 +1418,6 @@ Tailwind class merge utility (powered by `clsx` + `tailwind-merge`).
 
 ```tsx
 import { cn } from 'azirid-react'
-
 ;<div className={cn('bg-white p-4', isActive && 'bg-blue-500')} />
 ```
 

package/dist/index.cjs

@@ -679,10 +679,7 @@ function AziridProviderInner({
     () => resolveMessages(props.locale ?? "es", props.messages),
     [props.locale, props.messages]
   );
-  const brandingValue = react.useMemo(
-    () => ({ branding, messages }),
-    [branding, messages]
-  );
+  const brandingValue = react.useMemo(() => ({ branding, messages }), [branding, messages]);
   const isProxyMode = !props.apiUrl;
   const syncUrl = react.useMemo(() => {
     if (props.sessionSyncUrl === false) return null;
@@ -807,13 +804,7 @@ function AziridProviderInner({
     (data) => data.at ?? data.accessToken,
     []
   );
-  const {
-    loginMutation,
-    signupMutation,
-    logoutMutation,
-    refreshFn,
-    switchTenantFn
-  } = useAuthMutations({
+  const { loginMutation, signupMutation, logoutMutation, refreshFn, switchTenantFn } = useAuthMutations({
     client,
     props,
     setUser,
@@ -1874,10 +1865,7 @@ function useReferral() {
     }
     return false;
   }, [query.data?.referralUrl]);
-  return react.useMemo(
-    () => ({ ...query, copyToClipboard }),
-    [query, copyToClipboard]
-  );
+  return react.useMemo(() => ({ ...query, copyToClipboard }), [query, copyToClipboard]);
 }
 var styles = {
   card: {
@@ -2664,16 +2652,12 @@ var intervalLabels2 = {
   YEARLY: "/yr",
   ONE_TIME: ""
 };
-function TransferModal({
-  data,
-  onClose
-}) {
+function TransferModal({ data, onClose }) {
   const bankDetails = data.bankDetails;
   return /* @__PURE__ */ jsxRuntime.jsx("div", { style: styles5.overlay, onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: styles5.modal, onClick: (e) => e.stopPropagation(), children: [
     /* @__PURE__ */ jsxRuntime.jsx("h2", { style: styles5.modalTitle, children: "Manual Transfer" }),
     /* @__PURE__ */ jsxRuntime.jsxs("p", { style: styles5.modalSubtitle, children: [
-      "Transfer the amount below to subscribe to",
-      " ",
+      "Transfer the amount below to subscribe to ",
       /* @__PURE__ */ jsxRuntime.jsx("strong", { children: data.plan?.name })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2736,9 +2720,7 @@ function PricingTable({
   const { data: plans, isLoading: plansLoading } = usePlans();
   const { data: subscription } = useSubscription();
   const { data: providers } = usePaymentProviders();
-  const [transferData, setTransferData] = react.useState(
-    null
-  );
+  const [transferData, setTransferData] = react.useState(null);
   const [payphoneData, setPayphoneData] = react.useState(null);
   const [pendingPlan, setPendingPlan] = react.useState(null);
   const [showProviderModal, setShowProviderModal] = react.useState(false);
@@ -2758,8 +2740,7 @@ function PricingTable({
     checkout({ planId, provider, successUrl, cancelUrl });
   };
   const handleSelect = (plan) => {
-    if (subscription?.planId === plan.id && subscription.status === "ACTIVE")
-      return;
+    if (subscription?.planId === plan.id && subscription.status === "ACTIVE") return;
     if (onPlanSelect) {
       onPlanSelect(plan);
       return;
@@ -2831,26 +2812,19 @@ function PricingTable({
   }
   const sortedPlans = plans ? [...plans].sort((a, b) => a.sortOrder - b.sortOrder) : [];
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className,
-        style: { ...styles5.grid(columns), ...style },
-        children: sortedPlans.map((plan) => {
-          const isCurrentPlan = subscription?.planId === plan.id && subscription.status === "ACTIVE";
-          return /* @__PURE__ */ jsxRuntime.jsx(
-            PricingCard,
-            {
-              plan,
-              isCurrentPlan,
-              isCheckoutPending: checkoutPending,
-              onSelect: handleSelect
-            },
-            plan.id
-          );
-        })
-      }
-    ),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className, style: { ...styles5.grid(columns), ...style }, children: sortedPlans.map((plan) => {
+      const isCurrentPlan = subscription?.planId === plan.id && subscription.status === "ACTIVE";
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        PricingCard,
+        {
+          plan,
+          isCurrentPlan,
+          isCheckoutPending: checkoutPending,
+          onSelect: handleSelect
+        },
+        plan.id
+      );
+    }) }),
     showProviderModal && pendingPlan && providers && providers.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(
       ProviderSelectModal,
       {
@@ -2863,13 +2837,7 @@ function PricingTable({
         }
       }
     ),
-    transferData && /* @__PURE__ */ jsxRuntime.jsx(
-      TransferModal,
-      {
-        data: transferData,
-        onClose: () => setTransferData(null)
-      }
-    ),
+    transferData && /* @__PURE__ */ jsxRuntime.jsx(TransferModal, { data: transferData, onClose: () => setTransferData(null) }),
     payphoneData?.widgetConfig && /* @__PURE__ */ jsxRuntime.jsx(
       PayphoneModal,
       {
@@ -3018,11 +2986,7 @@ function ProviderModal({
     /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", style: modalStyles.cancelButton, onClick: onClose, children: labels?.cancel ?? "Cancel" })
   ] }) });
 }
-function TransferModal2({
-  data,
-  onClose,
-  labels
-}) {
+function TransferModal2({ data, onClose, labels }) {
   const bankDetails = data.bankDetails;
   const plan = data.plan;
   const intent = data.intent;
@@ -3133,9 +3097,12 @@ function PayButton({
         setTransferData(data);
         setShowTransferModal(true);
         setShowProviderModal(false);
-      } else if (data.provider === "PAYPHONE" && data.widgetConfig) {
+        return;
+      }
+      if (data.provider === "PAYPHONE" && data.widgetConfig) {
         setPayphoneData(data);
         setShowProviderModal(false);
+        return;
       }
       onSuccess?.(data);
     },
@@ -3180,7 +3147,7 @@ function PayButton({
         },
         onClick: handleClick,
         disabled: isDisabled,
-        children: isPending ? billing?.processing ?? "Processing..." : children ?? (billing?.pay ?? "Pay")
+        children: isPending ? billing?.processing ?? "Processing..." : children ?? billing?.pay ?? "Pay"
       }
     ),
     showProviderModal && providers && providers.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(
@@ -3199,6 +3166,7 @@ function PayButton({
         data: transferData,
         onClose: () => {
           setShowTransferModal(false);
+          onSuccess?.(transferData);
           setTransferData(null);
         },
         labels: billing
@@ -3209,7 +3177,10 @@ function PayButton({
       {
         config: payphoneData.widgetConfig,
         successUrl,
-        onClose: () => setPayphoneData(null)
+        onClose: () => {
+          onSuccess?.(payphoneData);
+          setPayphoneData(null);
+        }
       }
     )
   ] });
@@ -3222,12 +3193,7 @@ function usePayphoneConfirm(options) {
     onError: options?.onError
   });
 }
-function PayphoneCallback({
-  onSuccess,
-  onError,
-  className,
-  style
-}) {
+function PayphoneCallback({ onSuccess, onError, className, style }) {
   const { mutate, isPending, isSuccess, isError, error, data } = usePayphoneConfirm({
     onSuccess,
     onError
@@ -3824,7 +3790,7 @@ function usePasswordToggle() {
 }
 
 // src/index.ts
-var SDK_VERSION = "0.9.3";
+var SDK_VERSION = "0.9.4";
 
 exports.AuthForm = AuthForm;
 exports.AziridProvider = AziridProvider;