@revenuecat/purchases-ui-js 3.9.2 → 3.9.3

package/dist/components/button/ButtonNode.svelte

@@ -23,8 +23,11 @@
   // Reactive store for input satisfaction (defaults to true if no validation context)
   const inputSatisfied = validationContext?.isSatisfied ?? readable(true);
 
-  // Button is disabled when it's a workflow (continue) action and inputs aren't satisfied
-  const isDisabled = $derived(action.type === "workflow" && !$inputSatisfied);
+  // Button is disabled when it's a workflow (continue) or complete_workflow action and inputs aren't satisfied
+  const isDisabled = $derived(
+    (action.type === "workflow" || action.type === "complete_workflow") &&
+      !$inputSatisfied,
+  );
 
   const onclick = () => {
     if (isDisabled) return;
@@ -36,6 +39,8 @@
     switch (action.type) {
       case "workflow":
         return true;
+      case "complete_workflow":
+        return true;
       case "restore_purchases":
         return false;
       case "navigate_back":

package/dist/components/paywall/Paywall.svelte

@@ -14,7 +14,10 @@
     type VariablesStore,
   } from "../../stores/variables";
   import type { ColorMode } from "../../types";
-  import type { Action } from "../../types/components/button";
+  import type {
+    Action,
+    CompleteWorkflowNavigateArgs,
+  } from "../../types/components/button";
   import type { SheetProps } from "../../types/components/sheet";
   import type { PaywallData } from "../../types/paywall";
   import type { UIConfig } from "../../types/ui-config";
@@ -61,6 +64,13 @@
     onVisitCustomerCenterClicked?: () => void;
     onRestorePurchasesClicked?: () => void;
     onNavigateToUrlClicked?: (url: string) => void;
+    /**
+     * Called when a complete_workflow button is pressed. The URL is localized;
+     * the host merges `url_query_params` (e.g. `app_user_id`) if needed.
+     */
+    onCompleteWorkflowNavigate?: (
+      args: CompleteWorkflowNavigateArgs,
+    ) => void | Promise<void>;
     onActionTriggered?: (actionId: string) => void;
     onError?: (error: unknown) => void;
     hideBackButtons?: boolean;
@@ -96,6 +106,7 @@
     onVisitCustomerCenterClicked,
     onRestorePurchasesClicked,
     onNavigateToUrlClicked,
+    onCompleteWorkflowNavigate,
     onActionTriggered,
     onError,
     uiConfig,
@@ -140,6 +151,18 @@
           onActionTriggered?.(actionId);
         }
         return;
+      case "complete_workflow": {
+        const baseUrl = getLocalizedString(action.url.url_lid);
+        if (!baseUrl) {
+          return;
+        }
+        void onCompleteWorkflowNavigate?.({
+          url: baseUrl,
+          method: action.url.method,
+          url_query_params: action.url_query_params,
+        });
+        return;
+      }
       case "navigate_back":
         onBackClicked?.();
         return;

package/dist/components/paywall/Paywall.svelte.d.ts

@@ -1,5 +1,6 @@
 import { type InitialInputSelections } from "../../stores/inputValidation";
 import type { ColorMode } from "../../types";
+import type { CompleteWorkflowNavigateArgs } from "../../types/components/button";
 import type { PaywallData } from "../../types/paywall";
 import type { UIConfig } from "../../types/ui-config";
 import { type CustomVariables, type PackageInfo, type VariableDictionary } from "../../types/variables";
@@ -27,6 +28,11 @@ interface Props {
     onVisitCustomerCenterClicked?: () => void;
     onRestorePurchasesClicked?: () => void;
     onNavigateToUrlClicked?: (url: string) => void;
+    /**
+     * Called when a complete_workflow button is pressed. The URL is localized;
+     * the host merges `url_query_params` (e.g. `app_user_id`) if needed.
+     */
+    onCompleteWorkflowNavigate?: (args: CompleteWorkflowNavigateArgs) => void | Promise<void>;
     onActionTriggered?: (actionId: string) => void;
     onError?: (error: unknown) => void;
     hideBackButtons?: boolean;

package/dist/components/text/TextNode.svelte

@@ -14,6 +14,7 @@
   import {
     getActiveStateProps,
     getIntroOfferStateProps,
+    getPromoOfferStateProps,
     evaluateVisibilityConditions,
   } from "../../utils/style-utils";
   import { replaceVariables } from "../../utils/variable-utils";
@@ -32,6 +33,10 @@
         !!$packageInfo?.hasIntroOffer || !!$packageInfo?.hasTrial,
         props.overrides,
       ),
+      ...getPromoOfferStateProps(
+        !!$packageInfo?.hasPromoOffer,
+        props.overrides,
+      ),
     };
   });
 

package/dist/components/workflows/Screen.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
   import Paywall from "../paywall/Paywall.svelte";
+  import type { CompleteWorkflowNavigateArgs } from "../../types/components/button";
   import type { InitialInputSelections } from "../../stores/inputValidation";
   import type { WorkflowScreen } from "../../types/workflow";
   import type { VariableDictionary } from "../../types/variables";
   import type { WalletButtonRender } from "../../types/wallet";
   import type { UIConfig } from "../../types/ui-config";
-
   interface Props {
     paywallComponents: WorkflowScreen | null | undefined;
     selectedLocale?: string;
@@ -22,9 +22,11 @@
     variablesPerPackage?: Record<string, VariableDictionary>;
     initialInputSelections?: InitialInputSelections;
     onInputChanged?: (fieldId: string, value: string) => void;
+    onCompleteWorkflowNavigate?: (
+      args: CompleteWorkflowNavigateArgs,
+    ) => void | Promise<void>;
     walletButtonRender?: WalletButtonRender;
   }
-
   const {
     paywallComponents,
     selectedLocale = "en_US",
@@ -38,6 +40,7 @@
     variablesPerPackage,
     initialInputSelections = {},
     onInputChanged,
+    onCompleteWorkflowNavigate,
     walletButtonRender,
   }: Props = $props();
 </script>
@@ -55,6 +58,7 @@
       onNavigateToUrlClicked={(url: string) => {
         window.open(url, "_blank");
       }}
+      {onCompleteWorkflowNavigate}
       onVisitCustomerCenterClicked={() => {}}
       {onBackClicked}
       onRestorePurchasesClicked={() => {}}

package/dist/components/workflows/Screen.svelte.d.ts

@@ -1,3 +1,4 @@
+import type { CompleteWorkflowNavigateArgs } from "../../types/components/button";
 import type { InitialInputSelections } from "../../stores/inputValidation";
 import type { WorkflowScreen } from "../../types/workflow";
 import type { VariableDictionary } from "../../types/variables";
@@ -16,6 +17,7 @@ interface Props {
     variablesPerPackage?: Record<string, VariableDictionary>;
     initialInputSelections?: InitialInputSelections;
     onInputChanged?: (fieldId: string, value: string) => void;
+    onCompleteWorkflowNavigate?: (args: CompleteWorkflowNavigateArgs) => void | Promise<void>;
     walletButtonRender?: WalletButtonRender;
 }
 declare const Screen: import("svelte").Component<Props, {}, "">;

package/dist/index.d.ts

@@ -19,5 +19,6 @@ export { type InitialInputSelections } from "./stores/inputValidation";
 export { type UIConfig } from "./types/ui-config";
 export { type WalletButtonRender } from "./types/wallet";
 export { type CustomVariables, CustomVariableValue, type VariableDictionary, type PackageInfo, } from "./types/variables";
+export type { CompleteWorkflowNavigateArgs, CompleteWorkflowUrlQueryParams, } from "./types/components/button";
 export * from "./ui/globals";
 export { default as Button } from "./ui/molecules/button.svelte";

package/dist/types/components/button.d.ts

@@ -34,7 +34,26 @@ interface NavigateToUrlAction {
         method: "deep_link" | "external_browser" | "in_app_browser";
     };
 }
-export type Action = WorkflowAction | RestorePurchasesAction | NavigateBackAction | NavigateToAction | NavigateToSheetAction | NavigateToWebPurchase | NavigateToUrlAction;
+/** Optional query params for complete_workflow URLs (host merges values). */
+export type CompleteWorkflowUrlQueryParams = {
+    app_user_id?: boolean;
+};
+/** Args passed to `onCompleteWorkflowNavigate` (host builds final URL if needed). */
+export type CompleteWorkflowNavigateArgs = {
+    url: string;
+    method: "deep_link" | "external_browser" | "in_app_browser";
+    url_query_params?: CompleteWorkflowUrlQueryParams;
+};
+/** End the workflow and open a URL (optional query params, e.g. app user ID). */
+interface CompleteWorkflowAction {
+    type: "complete_workflow";
+    url: {
+        url_lid: string;
+        method: "deep_link" | "external_browser" | "in_app_browser";
+    };
+    url_query_params?: CompleteWorkflowUrlQueryParams;
+}
+export type Action = WorkflowAction | RestorePurchasesAction | NavigateBackAction | NavigateToAction | NavigateToSheetAction | NavigateToWebPurchase | NavigateToUrlAction | CompleteWorkflowAction;
 export interface ButtonProps extends BaseComponent {
     type: "button";
     action: Action;

package/dist/utils/style-utils.d.ts

@@ -11,6 +11,7 @@ export declare function findSelectedPackageId({ stack, sticky_footer, }: RootPay
 export declare const getActiveStateProps: <T extends Component>(selectedState: boolean, overrides?: Overrides<T>) => Partial<T>;
 export declare const getHoverStateProps: <T extends Component>(hoverState: boolean, overrides?: Overrides<T>) => Partial<T>;
 export declare const getIntroOfferStateProps: <T extends Component>(hasIntroOffer: boolean, overrides?: Overrides<T>) => Partial<T>;
+export declare const getPromoOfferStateProps: <T extends Component>(hasPromoOffer: boolean, overrides?: Overrides<T>) => Partial<T>;
 export type VisibilityContext = {
     selectedPackageId: string | undefined;
     packageInfo: PackageInfo | undefined;

package/dist/utils/style-utils.js

@@ -58,6 +58,13 @@ export const getIntroOfferStateProps = (hasIntroOffer, overrides) => {
     const override = overrides?.find((override) => override.conditions.find((condition) => condition.type === "intro_offer"));
     return override?.properties ?? {};
 };
+export const getPromoOfferStateProps = (hasPromoOffer, overrides) => {
+    if (!hasPromoOffer) {
+        return {};
+    }
+    const override = overrides?.find((override) => override.conditions.find((condition) => condition.type === "promo_offer"));
+    return override?.properties ?? {};
+};
 const CONDITION_ORDER = [
     RuleKey.IntroOfferCondition,
     RuleKey.PromoOfferCondition,

package/package.json

@@ -2,7 +2,7 @@
   "name": "@revenuecat/purchases-ui-js",
   "description": "Web components for Paywalls. Powered by RevenueCat",
   "private": false,
-  "version": "3.9.2",
+  "version": "3.9.3",
   "author": {
     "name": "RevenueCat, Inc."
   },