@clerk/clerk-react/dist/experimental.mjs

Clerk React library

import {
  assertSingleChild,
  normalizeWithDefaultValue,
  safeExecute
} from "./chunk-5DPFCWRO.mjs";
import {
  useAuth,
  withClerk
} from "./chunk-U7L7TR5J.mjs";
import "./chunk-OANWQR3B.mjs";

// src/components/CheckoutButton.tsx
import React from "react";
var CheckoutButton = withClerk(
  ({ clerk, children, ...props }) => {
    const {
      planId,
      planPeriod,
      for: _for,
      onSubscriptionComplete,
      newSubscriptionRedirectUrl,
      checkoutProps,
      ...rest
    } = props;
    const { userId, orgId } = useAuth();
    if (userId === null) {
      throw new Error("Ensure that `<CheckoutButton />` is rendered inside a `<SignedIn />` component.");
    }
    if (orgId === null && _for === "organization") {
      throw new Error('Wrap `<CheckoutButton for="organization" />` with a check for an active organization.');
    }
    children = normalizeWithDefaultValue(children, "Checkout");
    const child = assertSingleChild(children)("CheckoutButton");
    const clickHandler = () => {
      if (!clerk) {
        return;
      }
      return clerk.__internal_openCheckout({
        planId,
        planPeriod,
        for: _for,
        onSubscriptionComplete,
        newSubscriptionRedirectUrl,
        ...checkoutProps
      });
    };
    const wrappedChildClickHandler = async (e) => {
      if (child && typeof child === "object" && "props" in child) {
        await safeExecute(child.props.onClick)(e);
      }
      return clickHandler();
    };
    const childProps = { ...rest, onClick: wrappedChildClickHandler };
    return React.cloneElement(child, childProps);
  },
  { component: "CheckoutButton", renderWhileLoading: true }
);

// src/components/PlanDetailsButton.tsx
import React2 from "react";
var PlanDetailsButton = withClerk(
  ({ clerk, children, ...props }) => {
    const { plan, planId, initialPlanPeriod, planDetailsProps, ...rest } = props;
    children = normalizeWithDefaultValue(children, "Plan details");
    const child = assertSingleChild(children)("PlanDetailsButton");
    const clickHandler = () => {
      if (!clerk) {
        return;
      }
      return clerk.__internal_openPlanDetails({
        plan,
        planId,
        initialPlanPeriod,
        ...planDetailsProps
      });
    };
    const wrappedChildClickHandler = async (e) => {
      if (child && typeof child === "object" && "props" in child) {
        await safeExecute(child.props.onClick)(e);
      }
      return clickHandler();
    };
    const childProps = { ...rest, onClick: wrappedChildClickHandler };
    return React2.cloneElement(child, childProps);
  },
  { component: "PlanDetailsButton", renderWhileLoading: true }
);

// src/components/SubscriptionDetailsButton.tsx
import React3 from "react";
var SubscriptionDetailsButton = withClerk(
  ({
    clerk,
    children,
    ...props
  }) => {
    const { for: _for, subscriptionDetailsProps, onSubscriptionCancel, ...rest } = props;
    children = normalizeWithDefaultValue(children, "Subscription details");
    const child = assertSingleChild(children)("SubscriptionDetailsButton");
    const { userId, orgId } = useAuth();
    if (userId === null) {
      throw new Error("Ensure that `<SubscriptionDetailsButton />` is rendered inside a `<SignedIn />` component.");
    }
    if (orgId === null && _for === "organization") {
      throw new Error(
        'Wrap `<SubscriptionDetailsButton for="organization" />` with a check for an active organization.'
      );
    }
    const clickHandler = () => {
      if (!clerk) {
        return;
      }
      return clerk.__internal_openSubscriptionDetails({
        for: _for,
        onSubscriptionCancel,
        ...subscriptionDetailsProps
      });
    };
    const wrappedChildClickHandler = async (e) => {
      if (child && typeof child === "object" && "props" in child) {
        await safeExecute(child.props.onClick)(e);
      }
      return clickHandler();
    };
    const childProps = { ...rest, onClick: wrappedChildClickHandler };
    return React3.cloneElement(child, childProps);
  },
  { component: "SubscriptionDetailsButton", renderWhileLoading: true }
);

// src/experimental.ts
import {
  __experimental_PaymentElementProvider,
  __experimental_usePaymentElement,
  __experimental_PaymentElement,
  __experimental_usePaymentAttempts,
  __experimental_useStatements,
  __experimental_usePaymentMethods,
  __experimental_usePlans,
  __experimental_useSubscription,
  __experimental_CheckoutProvider,
  __experimental_useCheckout
} from "@clerk/shared/react";
export {
  CheckoutButton,
  __experimental_CheckoutProvider as CheckoutProvider,
  __experimental_PaymentElement as PaymentElement,
  __experimental_PaymentElementProvider as PaymentElementProvider,
  PlanDetailsButton,
  SubscriptionDetailsButton,
  __experimental_useCheckout as useCheckout,
  __experimental_usePaymentAttempts as usePaymentAttempts,
  __experimental_usePaymentElement as usePaymentElement,
  __experimental_usePaymentMethods as usePaymentMethods,
  __experimental_usePlans as usePlans,
  __experimental_useStatements as useStatements,
  __experimental_useSubscription as useSubscription
};
//# sourceMappingURL=experimental.mjs.map