@blocklet/payment-react 1.13.211 → 1.13.212

package/es/components/safe-guard.d.ts

@@ -0,0 +1,3 @@
+export default function SafeGuard({ children }: {
+    children: any;
+}): any;

package/es/components/safe-guard.js

@@ -0,0 +1,4 @@
+import { isPaymentKitMounted } from "../util.js";
+export default function SafeGuard({ children }) {
+  return isPaymentKitMounted() ? children : null;
+}

package/es/index.d.ts

@@ -7,6 +7,7 @@ import ConfirmDialog from './components/confirm';
 import FormInput from './components/input';
 import Livemode from './components/livemode';
 import PricingTable from './components/pricing-table';
+import SafeGuard from './components/safe-guard';
 import Status from './components/status';
 import Switch from './components/switch-button';
 import dayjs from './dayjs';
@@ -24,4 +25,4 @@ import PaymentSummary from './payment/summary';
 export * from './util';
 export * from './contexts/payment';
 export { translations, createTranslator } from './locales';
-export { api, dayjs, FormInput, PhoneInput, AddressForm, StripeForm, Status, Livemode, Switch, ConfirmDialog, CheckoutForm, CheckoutTable, CheckoutDonate, CurrencySelector, Payment, PaymentSummary, PricingTable, ProductSkeleton, Amount, CustomerInvoiceList, CustomerPaymentList, MiniInvoiceList, TxLink, };
+export { api, dayjs, FormInput, PhoneInput, AddressForm, StripeForm, Status, Livemode, Switch, ConfirmDialog, CheckoutForm, CheckoutTable, CheckoutDonate, CurrencySelector, Payment, PaymentSummary, PricingTable, ProductSkeleton, Amount, CustomerInvoiceList, CustomerPaymentList, MiniInvoiceList, TxLink, SafeGuard, };

package/es/index.js

@@ -7,6 +7,7 @@ import ConfirmDialog from "./components/confirm.js";
 import FormInput from "./components/input.js";
 import Livemode from "./components/livemode.js";
 import PricingTable from "./components/pricing-table.js";
+import SafeGuard from "./components/safe-guard.js";
 import Status from "./components/status.js";
 import Switch from "./components/switch-button.js";
 import dayjs from "./dayjs.js";
@@ -47,5 +48,6 @@ export {
   CustomerInvoiceList,
   CustomerPaymentList,
   MiniInvoiceList,
-  TxLink
+  TxLink,
+  SafeGuard
 };

package/es/util.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import type { PaymentDetails, PriceCurrency, PriceRecurring, TLineItemExpanded, TPaymentCurrency, TPaymentMethod, TPaymentMethodExpanded, TPrice, TSubscriptionExpanded, TSubscriptionItemExpanded } from '@blocklet/payment-types';
 export declare const PAYMENT_KIT_DID = "z2qaCNvKMv5GjouKdcDWexv6WqtHbpNPQDnAk";
+export declare const isPaymentKitMounted: () => any;
 export declare const getPrefix: () => any;
 export declare function formatToDate(date: Date | string | number, locale?: string): any;
 export declare function formatToDatetime(date: Date | string | number, locale?: string): any;

package/es/util.js

@@ -6,6 +6,9 @@ import { joinURL } from "ufo";
 import dayjs from "./dayjs.js";
 import { t } from "./locales/index.js";
 export const PAYMENT_KIT_DID = "z2qaCNvKMv5GjouKdcDWexv6WqtHbpNPQDnAk";
+export const isPaymentKitMounted = () => {
+  return (window.blocklet?.componentMountPoints || []).some((x) => x.did === PAYMENT_KIT_DID);
+};
 export const getPrefix = () => {
   const componentId = (window?.blocklet?.componentId || "").split("/").pop();
   if (componentId === PAYMENT_KIT_DID) {

package/lib/components/safe-guard.d.ts

@@ -0,0 +1,3 @@
+export default function SafeGuard({ children }: {
+    children: any;
+}): any;

package/lib/components/safe-guard.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+module.exports = SafeGuard;
+var _util = require("../util");
+function SafeGuard({
+  children
+}) {
+  return (0, _util.isPaymentKitMounted)() ? children : null;
+}

package/lib/index.d.ts

@@ -7,6 +7,7 @@ import ConfirmDialog from './components/confirm';
 import FormInput from './components/input';
 import Livemode from './components/livemode';
 import PricingTable from './components/pricing-table';
+import SafeGuard from './components/safe-guard';
 import Status from './components/status';
 import Switch from './components/switch-button';
 import dayjs from './dayjs';
@@ -24,4 +25,4 @@ import PaymentSummary from './payment/summary';
 export * from './util';
 export * from './contexts/payment';
 export { translations, createTranslator } from './locales';
-export { api, dayjs, FormInput, PhoneInput, AddressForm, StripeForm, Status, Livemode, Switch, ConfirmDialog, CheckoutForm, CheckoutTable, CheckoutDonate, CurrencySelector, Payment, PaymentSummary, PricingTable, ProductSkeleton, Amount, CustomerInvoiceList, CustomerPaymentList, MiniInvoiceList, TxLink, };
+export { api, dayjs, FormInput, PhoneInput, AddressForm, StripeForm, Status, Livemode, Switch, ConfirmDialog, CheckoutForm, CheckoutTable, CheckoutDonate, CurrencySelector, Payment, PaymentSummary, PricingTable, ProductSkeleton, Amount, CustomerInvoiceList, CustomerPaymentList, MiniInvoiceList, TxLink, SafeGuard, };

package/lib/index.js

@@ -13,6 +13,7 @@ var _exportNames = {
   FormInput: true,
   Livemode: true,
   PricingTable: true,
+  SafeGuard: true,
   Status: true,
   Switch: true,
   dayjs: true,
@@ -132,6 +133,12 @@ Object.defineProperty(exports, "ProductSkeleton", {
     return _productSkeleton.default;
   }
 });
+Object.defineProperty(exports, "SafeGuard", {
+  enumerable: true,
+  get: function () {
+    return _safeGuard.default;
+  }
+});
 Object.defineProperty(exports, "Status", {
   enumerable: true,
   get: function () {
@@ -189,6 +196,7 @@ var _confirm = _interopRequireDefault(require("./components/confirm"));
 var _input = _interopRequireDefault(require("./components/input"));
 var _livemode = _interopRequireDefault(require("./components/livemode"));
 var _pricingTable = _interopRequireDefault(require("./components/pricing-table"));
+var _safeGuard = _interopRequireDefault(require("./components/safe-guard"));
 var _status = _interopRequireDefault(require("./components/status"));
 var _switchButton = _interopRequireDefault(require("./components/switch-button"));
 var _dayjs = _interopRequireDefault(require("./dayjs"));

package/lib/util.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import type { PaymentDetails, PriceCurrency, PriceRecurring, TLineItemExpanded, TPaymentCurrency, TPaymentMethod, TPaymentMethodExpanded, TPrice, TSubscriptionExpanded, TSubscriptionItemExpanded } from '@blocklet/payment-types';
 export declare const PAYMENT_KIT_DID = "z2qaCNvKMv5GjouKdcDWexv6WqtHbpNPQDnAk";
+export declare const isPaymentKitMounted: () => any;
 export declare const getPrefix: () => any;
 export declare function formatToDate(date: Date | string | number, locale?: string): any;
 export declare function formatToDatetime(date: Date | string | number, locale?: string): any;

package/lib/util.js

@@ -35,6 +35,7 @@ exports.getSubscriptionAction = void 0;
 exports.getSubscriptionStatusColor = getSubscriptionStatusColor;
 exports.getTxLink = exports.getSubscriptionTimeSummary = void 0;
 exports.getWebhookStatusColor = getWebhookStatusColor;
+exports.isPaymentKitMounted = void 0;
 exports.isValidCountry = isValidCountry;
 exports.mergeExtraParams = void 0;
 exports.sleep = sleep;
@@ -48,6 +49,10 @@ var _dayjs = _interopRequireDefault(require("./dayjs"));
 var _locales = require("./locales");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const PAYMENT_KIT_DID = exports.PAYMENT_KIT_DID = "z2qaCNvKMv5GjouKdcDWexv6WqtHbpNPQDnAk";
+const isPaymentKitMounted = () => {
+  return (window.blocklet?.componentMountPoints || []).some(x => x.did === PAYMENT_KIT_DID);
+};
+exports.isPaymentKitMounted = isPaymentKitMounted;
 const getPrefix = () => {
   const componentId = (window?.blocklet?.componentId || "").split("/").pop();
   if (componentId === PAYMENT_KIT_DID) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/payment-react",
-  "version": "1.13.211",
+  "version": "1.13.212",
   "description": "Reusable react components for payment kit v2",
   "keywords": [
     "react",
@@ -90,7 +90,7 @@
     "@babel/core": "^7.23.9",
     "@babel/preset-env": "^7.23.9",
     "@babel/preset-react": "^7.23.3",
-    "@blocklet/payment-types": "1.13.211",
+    "@blocklet/payment-types": "1.13.212",
     "@storybook/addon-essentials": "^7.6.13",
     "@storybook/addon-interactions": "^7.6.13",
     "@storybook/addon-links": "^7.6.13",
@@ -119,5 +119,5 @@
     "vite-plugin-babel": "^1.2.0",
     "vite-plugin-node-polyfills": "^0.21.0"
   },
-  "gitHead": "2fe03028e2284261a1a62260d82a2e79ec45ce4a"
+  "gitHead": "942de3b017723af85a6c271a7e4ddd35443bc84d"
 }

package/src/components/safe-guard.tsx

@@ -0,0 +1,5 @@
+import { isPaymentKitMounted } from '../util';
+
+export default function SafeGuard({ children }: { children: any }) {
+  return isPaymentKitMounted() ? children : null;
+}

package/src/index.ts

@@ -7,6 +7,7 @@ import ConfirmDialog from './components/confirm';
 import FormInput from './components/input';
 import Livemode from './components/livemode';
 import PricingTable from './components/pricing-table';
+import SafeGuard from './components/safe-guard';
 import Status from './components/status';
 import Switch from './components/switch-button';
 import dayjs from './dayjs';
@@ -51,4 +52,5 @@ export {
   CustomerPaymentList,
   MiniInvoiceList,
   TxLink,
+  SafeGuard,
 };

package/src/util.ts

@@ -23,6 +23,10 @@ import { t } from './locales';
 
 export const PAYMENT_KIT_DID = 'z2qaCNvKMv5GjouKdcDWexv6WqtHbpNPQDnAk';
 
+export const isPaymentKitMounted = () => {
+  return (window.blocklet?.componentMountPoints || []).some((x: any) => x.did === PAYMENT_KIT_DID);
+};
+
 export const getPrefix = () => {
   const componentId = (window?.blocklet?.componentId || '').split('/').pop();
   if (componentId === PAYMENT_KIT_DID) {