@schematichq/schematic-components 0.3.9 → 0.3.10

package/dist/schematic-components.cjs.js

@@ -2641,7 +2641,7 @@ var registerWrapper = function registerWrapper2(stripe, startTime) {
   }
   stripe._registerWrapper({
     name: "stripe-js",
-    version: "4.7.0",
+    version: "4.8.0",
     startTime
   });
 };
@@ -7264,9 +7264,6 @@ function BillingProductDetailResponseDataFromJSONTyped(json, ignoreDiscriminator
     return json;
   }
   return {
-    prices: json["Prices"].map(
-      BillingPriceResponseDataFromJSON
-    ),
     accountId: json["account_id"],
     createdAt: new Date(json["created_at"]),
     currency: json["currency"],
@@ -7274,6 +7271,9 @@ function BillingProductDetailResponseDataFromJSONTyped(json, ignoreDiscriminator
     externalId: json["external_id"],
     name: json["name"],
     price: json["price"],
+    prices: json["prices"].map(
+      BillingPriceResponseDataFromJSON
+    ),
     productId: json["product_id"],
     quantity: json["quantity"],
     updatedAt: new Date(json["updated_at"])
@@ -7289,7 +7289,6 @@ function BillingProductForSubscriptionResponseDataFromJSONTyped(json, ignoreDisc
     return json;
   }
   return {
-    accountId: json["account_id"],
     createdAt: new Date(json["created_at"]),
     currency: json["currency"],
     environmentId: json["environment_id"],
@@ -7314,16 +7313,111 @@ function BillingSubscriptionResponseDataFromJSONTyped(json, ignoreDiscriminator)
     return json;
   }
   return {
+    companyId: json["company_id"] == null ? void 0 : json["company_id"],
+    createdAt: new Date(json["created_at"]),
     currency: json["currency"],
+    customerExternalId: json["customer_external_id"],
     expiredAt: json["expired_at"] == null ? void 0 : new Date(json["expired_at"]),
-    externalId: json["external_id"],
     id: json["id"],
     interval: json["interval"],
-    totalPrice: json["total_price"],
+    metadata: json["metadata"] == null ? void 0 : json["metadata"],
+    periodEnd: json["period_end"],
+    periodStart: json["period_start"],
+    status: json["status"],
+    subscriptionExternalId: json["subscription_external_id"],
+    totalPrice: json["total_price"]
+  };
+}
+
+// src/api/models/InvoiceResponseData.ts
+function InvoiceResponseDataFromJSON(json) {
+  return InvoiceResponseDataFromJSONTyped(json, false);
+}
+function InvoiceResponseDataFromJSONTyped(json, ignoreDiscriminator) {
+  if (json == null) {
+    return json;
+  }
+  return {
+    amountDue: json["amount_due"],
+    amountPaid: json["amount_paid"],
+    amountRemaining: json["amount_remaining"],
+    collectionMethod: json["collection_method"],
+    companyId: json["company_id"] == null ? void 0 : json["company_id"],
+    createdAt: new Date(json["created_at"]),
+    currency: json["currency"],
+    customerExternalId: json["customer_external_id"],
+    dueDate: json["due_date"] == null ? void 0 : new Date(json["due_date"]),
+    environmentId: json["environment_id"],
+    externalId: json["external_id"] == null ? void 0 : json["external_id"],
+    id: json["id"],
+    paymentMethodExternalId: json["payment_method_external_id"] == null ? void 0 : json["payment_method_external_id"],
+    subscriptionExternalId: json["subscription_external_id"] == null ? void 0 : json["subscription_external_id"],
+    subtotal: json["subtotal"],
+    updatedAt: new Date(json["updated_at"]),
+    url: json["url"] == null ? void 0 : json["url"]
+  };
+}
+
+// src/api/models/PaymentMethodResponseData.ts
+function PaymentMethodResponseDataFromJSON(json) {
+  return PaymentMethodResponseDataFromJSONTyped(json, false);
+}
+function PaymentMethodResponseDataFromJSONTyped(json, ignoreDiscriminator) {
+  if (json == null) {
+    return json;
+  }
+  return {
+    accountLast4: json["account_last4"] == null ? void 0 : json["account_last4"],
+    accountName: json["account_name"] == null ? void 0 : json["account_name"],
+    bankName: json["bank_name"] == null ? void 0 : json["bank_name"],
+    billingEmail: json["billing_email"] == null ? void 0 : json["billing_email"],
+    billingName: json["billing_name"] == null ? void 0 : json["billing_name"],
+    cardBrand: json["card_brand"] == null ? void 0 : json["card_brand"],
+    cardExpMonth: json["card_exp_month"] == null ? void 0 : json["card_exp_month"],
+    cardExpYear: json["card_exp_year"] == null ? void 0 : json["card_exp_year"],
+    cardLast4: json["card_last4"] == null ? void 0 : json["card_last4"],
+    companyId: json["company_id"] == null ? void 0 : json["company_id"],
+    createdAt: new Date(json["created_at"]),
+    customerExternalId: json["customer_external_id"],
+    environmentId: json["environment_id"],
+    externalId: json["external_id"],
+    id: json["id"],
+    paymentMethodType: json["payment_method_type"],
+    subscriptionExternalId: json["subscription_external_id"] == null ? void 0 : json["subscription_external_id"],
     updatedAt: new Date(json["updated_at"])
   };
 }
 
+// src/api/models/BillingSubscriptionView.ts
+function BillingSubscriptionViewFromJSON(json) {
+  return BillingSubscriptionViewFromJSONTyped(json, false);
+}
+function BillingSubscriptionViewFromJSONTyped(json, ignoreDiscriminator) {
+  if (json == null) {
+    return json;
+  }
+  return {
+    companyId: json["company_id"] == null ? void 0 : json["company_id"],
+    createdAt: new Date(json["created_at"]),
+    currency: json["currency"],
+    customerExternalId: json["customer_external_id"],
+    expiredAt: json["expired_at"] == null ? void 0 : new Date(json["expired_at"]),
+    id: json["id"],
+    interval: json["interval"],
+    latestInvoice: json["latest_invoice"] == null ? void 0 : InvoiceResponseDataFromJSON(json["latest_invoice"]),
+    metadata: json["metadata"] == null ? void 0 : json["metadata"],
+    paymentMethod: json["payment_method"] == null ? void 0 : PaymentMethodResponseDataFromJSON(json["payment_method"]),
+    periodEnd: json["period_end"],
+    periodStart: json["period_start"],
+    products: json["products"].map(
+      BillingProductForSubscriptionResponseDataFromJSON
+    ),
+    status: json["status"],
+    subscriptionExternalId: json["subscription_external_id"],
+    totalPrice: json["total_price"]
+  };
+}
+
 // src/api/models/ChangeSubscriptionRequestBody.ts
 function ChangeSubscriptionRequestBodyToJSON(value) {
   if (value == null) {
@@ -7475,7 +7569,7 @@ function CompanyDetailResponseDataFromJSONTyped(json, ignoreDiscriminator) {
       CompanyPlanWithBillingSubViewFromJSON
     ),
     billingSubscriptions: json["billing_subscriptions"].map(
-      BillingSubscriptionResponseDataFromJSON
+      BillingSubscriptionViewFromJSON
     ),
     createdAt: new Date(json["created_at"]),
     entityTraits: json["entity_traits"].map(
@@ -7783,65 +7877,6 @@ function CompanyPlanDetailResponseDataFromJSONTyped(json, ignoreDiscriminator) {
   };
 }
 
-// src/api/models/InvoiceResponseData.ts
-function InvoiceResponseDataFromJSON(json) {
-  return InvoiceResponseDataFromJSONTyped(json, false);
-}
-function InvoiceResponseDataFromJSONTyped(json, ignoreDiscriminator) {
-  if (json == null) {
-    return json;
-  }
-  return {
-    amountDue: json["amount_due"],
-    amountPaid: json["amount_paid"],
-    amountRemaining: json["amount_remaining"],
-    collectionMethod: json["collection_method"],
-    companyId: json["company_id"] == null ? void 0 : json["company_id"],
-    createdAt: new Date(json["created_at"]),
-    currency: json["currency"],
-    customerExternalId: json["customer_external_id"],
-    dueDate: json["due_date"] == null ? void 0 : new Date(json["due_date"]),
-    environmentId: json["environment_id"],
-    externalId: json["external_id"] == null ? void 0 : json["external_id"],
-    id: json["id"],
-    paymentMethodExternalId: json["payment_method_external_id"] == null ? void 0 : json["payment_method_external_id"],
-    subscriptionExternalId: json["subscription_external_id"] == null ? void 0 : json["subscription_external_id"],
-    subtotal: json["subtotal"],
-    updatedAt: new Date(json["updated_at"]),
-    url: json["url"] == null ? void 0 : json["url"]
-  };
-}
-
-// src/api/models/PaymentMethodResponseData.ts
-function PaymentMethodResponseDataFromJSON(json) {
-  return PaymentMethodResponseDataFromJSONTyped(json, false);
-}
-function PaymentMethodResponseDataFromJSONTyped(json, ignoreDiscriminator) {
-  if (json == null) {
-    return json;
-  }
-  return {
-    accountLast4: json["account_last4"] == null ? void 0 : json["account_last4"],
-    accountName: json["account_name"] == null ? void 0 : json["account_name"],
-    bankName: json["bank_name"] == null ? void 0 : json["bank_name"],
-    billingEmail: json["billing_email"] == null ? void 0 : json["billing_email"],
-    billingName: json["billing_name"] == null ? void 0 : json["billing_name"],
-    cardBrand: json["card_brand"] == null ? void 0 : json["card_brand"],
-    cardExpMonth: json["card_exp_month"] == null ? void 0 : json["card_exp_month"],
-    cardExpYear: json["card_exp_year"] == null ? void 0 : json["card_exp_year"],
-    cardLast4: json["card_last4"] == null ? void 0 : json["card_last4"],
-    companyId: json["company_id"] == null ? void 0 : json["company_id"],
-    createdAt: new Date(json["created_at"]),
-    customerExternalId: json["customer_external_id"],
-    environmentId: json["environment_id"],
-    externalId: json["external_id"],
-    id: json["id"],
-    paymentMethodType: json["payment_method_type"],
-    subscriptionExternalId: json["subscription_external_id"] == null ? void 0 : json["subscription_external_id"],
-    updatedAt: new Date(json["updated_at"])
-  };
-}
-
 // src/api/models/CompanySubscriptionResponseData.ts
 function CompanySubscriptionResponseDataFromJSON(json) {
   return CompanySubscriptionResponseDataFromJSONTyped(json, false);
@@ -7866,6 +7901,19 @@ function CompanySubscriptionResponseDataFromJSONTyped(json, ignoreDiscriminator)
   };
 }
 
+// src/api/models/ComponentCapabilities.ts
+function ComponentCapabilitiesFromJSON(json) {
+  return ComponentCapabilitiesFromJSONTyped(json, false);
+}
+function ComponentCapabilitiesFromJSONTyped(json, ignoreDiscriminator) {
+  if (json == null) {
+    return json;
+  }
+  return {
+    checkout: json["checkout"]
+  };
+}
+
 // src/api/models/ComponentResponseData.ts
 function ComponentResponseDataFromJSON(json) {
   return ComponentResponseDataFromJSONTyped(json, false);
@@ -7944,9 +7992,13 @@ function ComponentHydrateResponseDataFromJSONTyped(json, ignoreDiscriminator) {
     return json;
   }
   return {
+    activeAddOns: json["active_add_ons"].map(
+      CompanyPlanDetailResponseDataFromJSON
+    ),
     activePlans: json["active_plans"].map(
       CompanyPlanDetailResponseDataFromJSON
     ),
+    capabilities: json["capabilities"] == null ? void 0 : ComponentCapabilitiesFromJSON(json["capabilities"]),
     company: json["company"] == null ? void 0 : CompanyDetailResponseDataFromJSON(json["company"]),
     component: json["component"] == null ? void 0 : ComponentResponseDataFromJSON(json["component"]),
     featureUsage: json["feature_usage"] == null ? void 0 : FeatureUsageDetailResponseDataFromJSON(json["feature_usage"]),
@@ -8751,6 +8803,7 @@ function parseEditorState(data) {
 var EmbedContext = (0, import_react2.createContext)({
   api: null,
   data: {
+    activeAddOns: [],
     activePlans: []
   },
   nodes: [],
@@ -8781,6 +8834,7 @@ var EmbedProvider = ({
     return {
       api: null,
       data: {
+        activeAddOns: [],
         activePlans: []
       },
       nodes: [],
@@ -8882,7 +8936,7 @@ var EmbedProvider = ({
   (0, import_react2.useEffect)(() => {
     if (accessToken) {
       const { headers = {} } = apiConfig ?? {};
-      headers["X-Schematic-Components-Version"] = "0.3.9";
+      headers["X-Schematic-Components-Version"] = "0.3.10";
       headers["X-Schematic-Session-ID"] = sessionIdRef.current;
       const config = new Configuration({
         ...apiConfig,
@@ -9946,7 +10000,8 @@ var CheckoutDialog = () => {
       document.body.style.overflow = "";
     };
   }, []);
-  const allowCheckout = api && selectedPlan && (selectedPlan.id !== currentPlan?.id || planPeriod !== currentPlan.planPeriod) && (paymentMethod && !showPaymentForm || paymentMethodId) && !isLoading;
+  const canUpdateSubscription = api && selectedPlan && (selectedPlan.id !== currentPlan?.id || planPeriod !== currentPlan.planPeriod) && !isLoading;
+  const canCheckout = canUpdateSubscription && (paymentMethod && !showPaymentForm || paymentMethodId);
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Modal, { size: "lg", children: [
     /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ModalHeader, { bordered: true, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Flex, { $gap: "1rem", children: [
       /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Flex, { $gap: "0.5rem", $alignItems: "center", children: [
@@ -10467,7 +10522,7 @@ var CheckoutDialog = () => {
                           /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                             Flex,
                             {
-                              ...allowCheckout && {
+                              ...canCheckout && {
                                 $opacity: "0.625",
                                 $textDecoration: "line-through"
                               },
@@ -10500,7 +10555,7 @@ var CheckoutDialog = () => {
                         ]
                       }
                     ),
-                    allowCheckout && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Box, { $marginBottom: "1rem", children: [
+                    canCheckout && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Box, { $marginBottom: "1rem", children: [
                       /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                         Box,
                         {
@@ -10693,7 +10748,7 @@ var CheckoutDialog = () => {
                     EmbedButton,
                     {
                       isLoading,
-                      ...allowCheckout ? {
+                      ...canUpdateSubscription ? {
                         onClick: async () => {
                           if (!data.component?.id) {
                             return;
@@ -10722,9 +10777,9 @@ var CheckoutDialog = () => {
                   ) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                     EmbedButton,
                     {
-                      disabled: isLoading || !allowCheckout,
+                      disabled: isLoading || !canCheckout,
                       isLoading,
-                      ...allowCheckout && { onClick: checkout },
+                      ...canCheckout && { onClick: checkout },
                       children: "Pay now"
                     }
                   ),
@@ -11752,12 +11807,12 @@ var resolveDesignProps5 = (props) => {
 var PlanManager = (0, import_react19.forwardRef)(({ children, className, portal, ...rest }, ref) => {
   const props = resolveDesignProps5(rest);
   const theme = nt();
-  const { data, layout, mode, setLayout } = useEmbed();
+  const { data, layout, setLayout } = useEmbed();
   const isLightBackground = useIsLightBackground();
   const { currentPlan, canChangePlan, addOns } = {
-    currentPlan: data.company?.plan,
-    canChangePlan: (mode === "edit" || data.stripeEmbed?.publishableKey && data.company?.plan?.billingProductId) && data.activePlans.length > 0,
-    addOns: data.company?.addOns || []
+    addOns: data.company?.addOns || [],
+    canChangePlan: data.capabilities?.checkout ?? true,
+    currentPlan: data.company?.plan
   };
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     Element,
@@ -12088,6 +12143,7 @@ var ComponentTree = () => {
     setChildren(nodes.map(renderer));
   }, [nodes]);
   if (error) {
+    console.error(error);
     return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Error2, { message: error.message });
   }
   if (import_react22.Children.count(children) === 0) {

package/dist/schematic-components.d.ts

@@ -117,12 +117,6 @@ declare interface BillingPriceResponseData {
  * @interface BillingProductDetailResponseData
  */
 declare interface BillingProductDetailResponseData {
-    /**
-     *
-     * @type {Array<BillingPriceResponseData>}
-     * @memberof BillingProductDetailResponseData
-     */
-    prices: Array<BillingPriceResponseData>;
     /**
      *
      * @type {string}
@@ -165,6 +159,12 @@ declare interface BillingProductDetailResponseData {
      * @memberof BillingProductDetailResponseData
      */
     price: number;
+    /**
+     *
+     * @type {Array<BillingPriceResponseData>}
+     * @memberof BillingProductDetailResponseData
+     */
+    prices: Array<BillingPriceResponseData>;
     /**
      *
      * @type {string}
@@ -202,12 +202,6 @@ declare interface BillingProductDetailResponseData {
  * @interface BillingProductForSubscriptionResponseData
  */
 declare interface BillingProductForSubscriptionResponseData {
-    /**
-     *
-     * @type {string}
-     * @memberof BillingProductForSubscriptionResponseData
-     */
-    accountId: string;
     /**
      *
      * @type {Date}
@@ -304,19 +298,31 @@ declare interface BillingSubscriptionResponseData {
      * @type {string}
      * @memberof BillingSubscriptionResponseData
      */
-    currency: string;
+    companyId?: string | null;
     /**
      *
      * @type {Date}
      * @memberof BillingSubscriptionResponseData
      */
-    expiredAt?: Date | null;
+    createdAt: Date;
     /**
      *
      * @type {string}
      * @memberof BillingSubscriptionResponseData
      */
-    externalId: string;
+    currency: string;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionResponseData
+     */
+    customerExternalId: string;
+    /**
+     *
+     * @type {Date}
+     * @memberof BillingSubscriptionResponseData
+     */
+    expiredAt?: Date | null;
     /**
      *
      * @type {string}
@@ -329,18 +335,146 @@ declare interface BillingSubscriptionResponseData {
      * @memberof BillingSubscriptionResponseData
      */
     interval: string;
+    /**
+     *
+     * @type {object}
+     * @memberof BillingSubscriptionResponseData
+     */
+    metadata?: object;
+    /**
+     *
+     * @type {number}
+     * @memberof BillingSubscriptionResponseData
+     */
+    periodEnd: number;
+    /**
+     *
+     * @type {number}
+     * @memberof BillingSubscriptionResponseData
+     */
+    periodStart: number;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionResponseData
+     */
+    status: string;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionResponseData
+     */
+    subscriptionExternalId: string;
     /**
      *
      * @type {number}
      * @memberof BillingSubscriptionResponseData
      */
     totalPrice: number;
+}
+
+/**
+ *
+ * @export
+ * @interface BillingSubscriptionView
+ */
+declare interface BillingSubscriptionView {
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionView
+     */
+    companyId?: string | null;
     /**
      *
      * @type {Date}
-     * @memberof BillingSubscriptionResponseData
+     * @memberof BillingSubscriptionView
      */
-    updatedAt: Date;
+    createdAt: Date;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionView
+     */
+    currency: string;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionView
+     */
+    customerExternalId: string;
+    /**
+     *
+     * @type {Date}
+     * @memberof BillingSubscriptionView
+     */
+    expiredAt?: Date | null;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionView
+     */
+    id: string;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionView
+     */
+    interval: string;
+    /**
+     *
+     * @type {InvoiceResponseData}
+     * @memberof BillingSubscriptionView
+     */
+    latestInvoice?: InvoiceResponseData;
+    /**
+     *
+     * @type {object}
+     * @memberof BillingSubscriptionView
+     */
+    metadata?: object;
+    /**
+     *
+     * @type {PaymentMethodResponseData}
+     * @memberof BillingSubscriptionView
+     */
+    paymentMethod?: PaymentMethodResponseData;
+    /**
+     *
+     * @type {number}
+     * @memberof BillingSubscriptionView
+     */
+    periodEnd: number;
+    /**
+     *
+     * @type {number}
+     * @memberof BillingSubscriptionView
+     */
+    periodStart: number;
+    /**
+     *
+     * @type {Array<BillingProductForSubscriptionResponseData>}
+     * @memberof BillingSubscriptionView
+     */
+    products: Array<BillingProductForSubscriptionResponseData>;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionView
+     */
+    status: string;
+    /**
+     *
+     * @type {string}
+     * @memberof BillingSubscriptionView
+     */
+    subscriptionExternalId: string;
+    /**
+     *
+     * @type {number}
+     * @memberof BillingSubscriptionView
+     */
+    totalPrice: number;
 }
 
 declare class BlobApiResponse {
@@ -521,10 +655,10 @@ declare interface CompanyDetailResponseData {
     addOns: Array<CompanyPlanWithBillingSubView>;
     /**
      *
-     * @type {Array<BillingSubscriptionResponseData>}
+     * @type {Array<BillingSubscriptionView>}
      * @memberof CompanyDetailResponseData
      */
-    billingSubscriptions: Array<BillingSubscriptionResponseData>;
+    billingSubscriptions: Array<BillingSubscriptionView>;
     /**
      *
      * @type {Date}
@@ -844,18 +978,55 @@ declare interface CompanySubscriptionResponseData {
     totalPrice: number;
 }
 
+/**
+ * Schematic API
+ * Schematic API
+ *
+ * The version of the OpenAPI document: 0.1
+ *
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+/**
+ *
+ * @export
+ * @interface ComponentCapabilities
+ */
+declare interface ComponentCapabilities {
+    /**
+     *
+     * @type {boolean}
+     * @memberof ComponentCapabilities
+     */
+    checkout: boolean;
+}
+
 /**
  * The returned resource
  * @export
  * @interface ComponentHydrateResponseData
  */
 declare interface ComponentHydrateResponseData {
+    /**
+     *
+     * @type {Array<CompanyPlanDetailResponseData>}
+     * @memberof ComponentHydrateResponseData
+     */
+    activeAddOns: Array<CompanyPlanDetailResponseData>;
     /**
      *
      * @type {Array<CompanyPlanDetailResponseData>}
      * @memberof ComponentHydrateResponseData
      */
     activePlans: Array<CompanyPlanDetailResponseData>;
+    /**
+     *
+     * @type {ComponentCapabilities}
+     * @memberof ComponentHydrateResponseData
+     */
+    capabilities?: ComponentCapabilities;
     /**
      *
      * @type {CompanyDetailResponseData}

package/dist/schematic-components.esm.js

@@ -2601,7 +2601,7 @@ var registerWrapper = function registerWrapper2(stripe, startTime) {
   }
   stripe._registerWrapper({
     name: "stripe-js",
-    version: "4.7.0",
+    version: "4.8.0",
     startTime
   });
 };
@@ -7224,9 +7224,6 @@ function BillingProductDetailResponseDataFromJSONTyped(json, ignoreDiscriminator
     return json;
   }
   return {
-    prices: json["Prices"].map(
-      BillingPriceResponseDataFromJSON
-    ),
     accountId: json["account_id"],
     createdAt: new Date(json["created_at"]),
     currency: json["currency"],
@@ -7234,6 +7231,9 @@ function BillingProductDetailResponseDataFromJSONTyped(json, ignoreDiscriminator
     externalId: json["external_id"],
     name: json["name"],
     price: json["price"],
+    prices: json["prices"].map(
+      BillingPriceResponseDataFromJSON
+    ),
     productId: json["product_id"],
     quantity: json["quantity"],
     updatedAt: new Date(json["updated_at"])
@@ -7249,7 +7249,6 @@ function BillingProductForSubscriptionResponseDataFromJSONTyped(json, ignoreDisc
     return json;
   }
   return {
-    accountId: json["account_id"],
     createdAt: new Date(json["created_at"]),
     currency: json["currency"],
     environmentId: json["environment_id"],
@@ -7274,16 +7273,111 @@ function BillingSubscriptionResponseDataFromJSONTyped(json, ignoreDiscriminator)
     return json;
   }
   return {
+    companyId: json["company_id"] == null ? void 0 : json["company_id"],
+    createdAt: new Date(json["created_at"]),
     currency: json["currency"],
+    customerExternalId: json["customer_external_id"],
     expiredAt: json["expired_at"] == null ? void 0 : new Date(json["expired_at"]),
-    externalId: json["external_id"],
     id: json["id"],
     interval: json["interval"],
-    totalPrice: json["total_price"],
+    metadata: json["metadata"] == null ? void 0 : json["metadata"],
+    periodEnd: json["period_end"],
+    periodStart: json["period_start"],
+    status: json["status"],
+    subscriptionExternalId: json["subscription_external_id"],
+    totalPrice: json["total_price"]
+  };
+}
+
+// src/api/models/InvoiceResponseData.ts
+function InvoiceResponseDataFromJSON(json) {
+  return InvoiceResponseDataFromJSONTyped(json, false);
+}
+function InvoiceResponseDataFromJSONTyped(json, ignoreDiscriminator) {
+  if (json == null) {
+    return json;
+  }
+  return {
+    amountDue: json["amount_due"],
+    amountPaid: json["amount_paid"],
+    amountRemaining: json["amount_remaining"],
+    collectionMethod: json["collection_method"],
+    companyId: json["company_id"] == null ? void 0 : json["company_id"],
+    createdAt: new Date(json["created_at"]),
+    currency: json["currency"],
+    customerExternalId: json["customer_external_id"],
+    dueDate: json["due_date"] == null ? void 0 : new Date(json["due_date"]),
+    environmentId: json["environment_id"],
+    externalId: json["external_id"] == null ? void 0 : json["external_id"],
+    id: json["id"],
+    paymentMethodExternalId: json["payment_method_external_id"] == null ? void 0 : json["payment_method_external_id"],
+    subscriptionExternalId: json["subscription_external_id"] == null ? void 0 : json["subscription_external_id"],
+    subtotal: json["subtotal"],
+    updatedAt: new Date(json["updated_at"]),
+    url: json["url"] == null ? void 0 : json["url"]
+  };
+}
+
+// src/api/models/PaymentMethodResponseData.ts
+function PaymentMethodResponseDataFromJSON(json) {
+  return PaymentMethodResponseDataFromJSONTyped(json, false);
+}
+function PaymentMethodResponseDataFromJSONTyped(json, ignoreDiscriminator) {
+  if (json == null) {
+    return json;
+  }
+  return {
+    accountLast4: json["account_last4"] == null ? void 0 : json["account_last4"],
+    accountName: json["account_name"] == null ? void 0 : json["account_name"],
+    bankName: json["bank_name"] == null ? void 0 : json["bank_name"],
+    billingEmail: json["billing_email"] == null ? void 0 : json["billing_email"],
+    billingName: json["billing_name"] == null ? void 0 : json["billing_name"],
+    cardBrand: json["card_brand"] == null ? void 0 : json["card_brand"],
+    cardExpMonth: json["card_exp_month"] == null ? void 0 : json["card_exp_month"],
+    cardExpYear: json["card_exp_year"] == null ? void 0 : json["card_exp_year"],
+    cardLast4: json["card_last4"] == null ? void 0 : json["card_last4"],
+    companyId: json["company_id"] == null ? void 0 : json["company_id"],
+    createdAt: new Date(json["created_at"]),
+    customerExternalId: json["customer_external_id"],
+    environmentId: json["environment_id"],
+    externalId: json["external_id"],
+    id: json["id"],
+    paymentMethodType: json["payment_method_type"],
+    subscriptionExternalId: json["subscription_external_id"] == null ? void 0 : json["subscription_external_id"],
     updatedAt: new Date(json["updated_at"])
   };
 }
 
+// src/api/models/BillingSubscriptionView.ts
+function BillingSubscriptionViewFromJSON(json) {
+  return BillingSubscriptionViewFromJSONTyped(json, false);
+}
+function BillingSubscriptionViewFromJSONTyped(json, ignoreDiscriminator) {
+  if (json == null) {
+    return json;
+  }
+  return {
+    companyId: json["company_id"] == null ? void 0 : json["company_id"],
+    createdAt: new Date(json["created_at"]),
+    currency: json["currency"],
+    customerExternalId: json["customer_external_id"],
+    expiredAt: json["expired_at"] == null ? void 0 : new Date(json["expired_at"]),
+    id: json["id"],
+    interval: json["interval"],
+    latestInvoice: json["latest_invoice"] == null ? void 0 : InvoiceResponseDataFromJSON(json["latest_invoice"]),
+    metadata: json["metadata"] == null ? void 0 : json["metadata"],
+    paymentMethod: json["payment_method"] == null ? void 0 : PaymentMethodResponseDataFromJSON(json["payment_method"]),
+    periodEnd: json["period_end"],
+    periodStart: json["period_start"],
+    products: json["products"].map(
+      BillingProductForSubscriptionResponseDataFromJSON
+    ),
+    status: json["status"],
+    subscriptionExternalId: json["subscription_external_id"],
+    totalPrice: json["total_price"]
+  };
+}
+
 // src/api/models/ChangeSubscriptionRequestBody.ts
 function ChangeSubscriptionRequestBodyToJSON(value) {
   if (value == null) {
@@ -7435,7 +7529,7 @@ function CompanyDetailResponseDataFromJSONTyped(json, ignoreDiscriminator) {
       CompanyPlanWithBillingSubViewFromJSON
     ),
     billingSubscriptions: json["billing_subscriptions"].map(
-      BillingSubscriptionResponseDataFromJSON
+      BillingSubscriptionViewFromJSON
     ),
     createdAt: new Date(json["created_at"]),
     entityTraits: json["entity_traits"].map(
@@ -7743,65 +7837,6 @@ function CompanyPlanDetailResponseDataFromJSONTyped(json, ignoreDiscriminator) {
   };
 }
 
-// src/api/models/InvoiceResponseData.ts
-function InvoiceResponseDataFromJSON(json) {
-  return InvoiceResponseDataFromJSONTyped(json, false);
-}
-function InvoiceResponseDataFromJSONTyped(json, ignoreDiscriminator) {
-  if (json == null) {
-    return json;
-  }
-  return {
-    amountDue: json["amount_due"],
-    amountPaid: json["amount_paid"],
-    amountRemaining: json["amount_remaining"],
-    collectionMethod: json["collection_method"],
-    companyId: json["company_id"] == null ? void 0 : json["company_id"],
-    createdAt: new Date(json["created_at"]),
-    currency: json["currency"],
-    customerExternalId: json["customer_external_id"],
-    dueDate: json["due_date"] == null ? void 0 : new Date(json["due_date"]),
-    environmentId: json["environment_id"],
-    externalId: json["external_id"] == null ? void 0 : json["external_id"],
-    id: json["id"],
-    paymentMethodExternalId: json["payment_method_external_id"] == null ? void 0 : json["payment_method_external_id"],
-    subscriptionExternalId: json["subscription_external_id"] == null ? void 0 : json["subscription_external_id"],
-    subtotal: json["subtotal"],
-    updatedAt: new Date(json["updated_at"]),
-    url: json["url"] == null ? void 0 : json["url"]
-  };
-}
-
-// src/api/models/PaymentMethodResponseData.ts
-function PaymentMethodResponseDataFromJSON(json) {
-  return PaymentMethodResponseDataFromJSONTyped(json, false);
-}
-function PaymentMethodResponseDataFromJSONTyped(json, ignoreDiscriminator) {
-  if (json == null) {
-    return json;
-  }
-  return {
-    accountLast4: json["account_last4"] == null ? void 0 : json["account_last4"],
-    accountName: json["account_name"] == null ? void 0 : json["account_name"],
-    bankName: json["bank_name"] == null ? void 0 : json["bank_name"],
-    billingEmail: json["billing_email"] == null ? void 0 : json["billing_email"],
-    billingName: json["billing_name"] == null ? void 0 : json["billing_name"],
-    cardBrand: json["card_brand"] == null ? void 0 : json["card_brand"],
-    cardExpMonth: json["card_exp_month"] == null ? void 0 : json["card_exp_month"],
-    cardExpYear: json["card_exp_year"] == null ? void 0 : json["card_exp_year"],
-    cardLast4: json["card_last4"] == null ? void 0 : json["card_last4"],
-    companyId: json["company_id"] == null ? void 0 : json["company_id"],
-    createdAt: new Date(json["created_at"]),
-    customerExternalId: json["customer_external_id"],
-    environmentId: json["environment_id"],
-    externalId: json["external_id"],
-    id: json["id"],
-    paymentMethodType: json["payment_method_type"],
-    subscriptionExternalId: json["subscription_external_id"] == null ? void 0 : json["subscription_external_id"],
-    updatedAt: new Date(json["updated_at"])
-  };
-}
-
 // src/api/models/CompanySubscriptionResponseData.ts
 function CompanySubscriptionResponseDataFromJSON(json) {
   return CompanySubscriptionResponseDataFromJSONTyped(json, false);
@@ -7826,6 +7861,19 @@ function CompanySubscriptionResponseDataFromJSONTyped(json, ignoreDiscriminator)
   };
 }
 
+// src/api/models/ComponentCapabilities.ts
+function ComponentCapabilitiesFromJSON(json) {
+  return ComponentCapabilitiesFromJSONTyped(json, false);
+}
+function ComponentCapabilitiesFromJSONTyped(json, ignoreDiscriminator) {
+  if (json == null) {
+    return json;
+  }
+  return {
+    checkout: json["checkout"]
+  };
+}
+
 // src/api/models/ComponentResponseData.ts
 function ComponentResponseDataFromJSON(json) {
   return ComponentResponseDataFromJSONTyped(json, false);
@@ -7904,9 +7952,13 @@ function ComponentHydrateResponseDataFromJSONTyped(json, ignoreDiscriminator) {
     return json;
   }
   return {
+    activeAddOns: json["active_add_ons"].map(
+      CompanyPlanDetailResponseDataFromJSON
+    ),
     activePlans: json["active_plans"].map(
       CompanyPlanDetailResponseDataFromJSON
     ),
+    capabilities: json["capabilities"] == null ? void 0 : ComponentCapabilitiesFromJSON(json["capabilities"]),
     company: json["company"] == null ? void 0 : CompanyDetailResponseDataFromJSON(json["company"]),
     component: json["component"] == null ? void 0 : ComponentResponseDataFromJSON(json["component"]),
     featureUsage: json["feature_usage"] == null ? void 0 : FeatureUsageDetailResponseDataFromJSON(json["feature_usage"]),
@@ -8711,6 +8763,7 @@ function parseEditorState(data) {
 var EmbedContext = createContext({
   api: null,
   data: {
+    activeAddOns: [],
     activePlans: []
   },
   nodes: [],
@@ -8741,6 +8794,7 @@ var EmbedProvider = ({
     return {
       api: null,
       data: {
+        activeAddOns: [],
         activePlans: []
       },
       nodes: [],
@@ -8842,7 +8896,7 @@ var EmbedProvider = ({
   useEffect(() => {
     if (accessToken) {
       const { headers = {} } = apiConfig ?? {};
-      headers["X-Schematic-Components-Version"] = "0.3.9";
+      headers["X-Schematic-Components-Version"] = "0.3.10";
       headers["X-Schematic-Session-ID"] = sessionIdRef.current;
       const config = new Configuration({
         ...apiConfig,
@@ -9906,7 +9960,8 @@ var CheckoutDialog = () => {
       document.body.style.overflow = "";
     };
   }, []);
-  const allowCheckout = api && selectedPlan && (selectedPlan.id !== currentPlan?.id || planPeriod !== currentPlan.planPeriod) && (paymentMethod && !showPaymentForm || paymentMethodId) && !isLoading;
+  const canUpdateSubscription = api && selectedPlan && (selectedPlan.id !== currentPlan?.id || planPeriod !== currentPlan.planPeriod) && !isLoading;
+  const canCheckout = canUpdateSubscription && (paymentMethod && !showPaymentForm || paymentMethodId);
   return /* @__PURE__ */ jsxs6(Modal, { size: "lg", children: [
     /* @__PURE__ */ jsx9(ModalHeader, { bordered: true, children: /* @__PURE__ */ jsxs6(Flex, { $gap: "1rem", children: [
       /* @__PURE__ */ jsxs6(Flex, { $gap: "0.5rem", $alignItems: "center", children: [
@@ -10427,7 +10482,7 @@ var CheckoutDialog = () => {
                           /* @__PURE__ */ jsx9(
                             Flex,
                             {
-                              ...allowCheckout && {
+                              ...canCheckout && {
                                 $opacity: "0.625",
                                 $textDecoration: "line-through"
                               },
@@ -10460,7 +10515,7 @@ var CheckoutDialog = () => {
                         ]
                       }
                     ),
-                    allowCheckout && /* @__PURE__ */ jsxs6(Box, { $marginBottom: "1rem", children: [
+                    canCheckout && /* @__PURE__ */ jsxs6(Box, { $marginBottom: "1rem", children: [
                       /* @__PURE__ */ jsx9(
                         Box,
                         {
@@ -10653,7 +10708,7 @@ var CheckoutDialog = () => {
                     EmbedButton,
                     {
                       isLoading,
-                      ...allowCheckout ? {
+                      ...canUpdateSubscription ? {
                         onClick: async () => {
                           if (!data.component?.id) {
                             return;
@@ -10682,9 +10737,9 @@ var CheckoutDialog = () => {
                   ) : /* @__PURE__ */ jsx9(
                     EmbedButton,
                     {
-                      disabled: isLoading || !allowCheckout,
+                      disabled: isLoading || !canCheckout,
                       isLoading,
-                      ...allowCheckout && { onClick: checkout },
+                      ...canCheckout && { onClick: checkout },
                       children: "Pay now"
                     }
                   ),
@@ -11716,12 +11771,12 @@ var resolveDesignProps5 = (props) => {
 var PlanManager = forwardRef9(({ children, className, portal, ...rest }, ref) => {
   const props = resolveDesignProps5(rest);
   const theme = nt();
-  const { data, layout, mode, setLayout } = useEmbed();
+  const { data, layout, setLayout } = useEmbed();
   const isLightBackground = useIsLightBackground();
   const { currentPlan, canChangePlan, addOns } = {
-    currentPlan: data.company?.plan,
-    canChangePlan: (mode === "edit" || data.stripeEmbed?.publishableKey && data.company?.plan?.billingProductId) && data.activePlans.length > 0,
-    addOns: data.company?.addOns || []
+    addOns: data.company?.addOns || [],
+    canChangePlan: data.capabilities?.checkout ?? true,
+    currentPlan: data.company?.plan
   };
   return /* @__PURE__ */ jsxs13(
     Element,
@@ -12052,6 +12107,7 @@ var ComponentTree = () => {
     setChildren(nodes.map(renderer));
   }, [nodes]);
   if (error) {
+    console.error(error);
     return /* @__PURE__ */ jsx22(Error2, { message: error.message });
   }
   if (Children.count(children) === 0) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schematichq/schematic-components",
-  "version": "0.3.9",
+  "version": "0.3.10",
   "main": "dist/schematic-components.cjs.js",
   "module": "dist/schematic-components.esm.js",
   "types": "dist/schematic-components.d.ts",