@whop/embedded-components-react-js 0.0.0

package/dist/payouts/elements/withdraw-button.js

@@ -0,0 +1,86 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var withdraw_button_exports = {};
+__export(withdraw_button_exports, {
+  WithdrawButtonElement: () => WithdrawButtonElement
+});
+module.exports = __toCommonJS(withdraw_button_exports);
+var import_react = __toESM(require("react"));
+var import_use_element_snapshot = require("../../lib/use-element-snapshot");
+var import_session = require("../session");
+function WithdrawButtonElement({
+  options = {},
+  className,
+  style,
+  onReady,
+  fallback
+}) {
+  const payoutsSession = (0, import_session.usePayoutsSession)();
+  const ref = (0, import_react.useRef)(null);
+  const element = (0, import_react.useMemo)(() => {
+    if (!payoutsSession) return null;
+    const createdElement = payoutsSession.createElement(
+      WithdrawButtonElement,
+      options
+    );
+    return createdElement;
+  }, [payoutsSession]);
+  const elementSnapshot = (0, import_use_element_snapshot.useElementSnapshot)(element);
+  const isReady = elementSnapshot?.state === "ready";
+  (0, import_react.useEffect)(() => {
+    if (!element) return;
+    element.updateOptions(options);
+  }, [options, element]);
+  (0, import_react.useEffect)(() => {
+    if (!element || !onReady) return;
+    element.on("ready", onReady);
+    return () => {
+      element.off("ready", onReady);
+    };
+  }, [element, onReady]);
+  (0, import_react.useLayoutEffect)(() => {
+    if (!element || !ref.current) return;
+    element.mount(ref.current);
+    return () => {
+      element.unmount();
+    };
+  }, [element, ref.current]);
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      style: { ...style, visibility: isReady ? "visible" : "hidden" },
+      className,
+      ref
+    }
+  ), !isReady && (fallback ?? null));
+}
+WithdrawButtonElement.displayName = "WithdrawButtonElement";
+WithdrawButtonElement.type = "withdraw-button-element";
+//# sourceMappingURL=withdraw-button.js.map

package/dist/payouts/elements/withdraw-button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/payouts/elements/withdraw-button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { WithdrawButtonElementOptions } from \"@whop/embedded-components-vanilla-js/types\";\n\nimport React, { useEffect, useLayoutEffect, useMemo, useRef } from \"react\";\nimport { useElementSnapshot } from \"../../lib/use-element-snapshot\";\nimport { usePayoutsSession } from \"../session\";\n\nexport function WithdrawButtonElement({\n\toptions = {},\n\tclassName,\n\tstyle,\n\tonReady,\n\tfallback,\n}: {\n\toptions?: WithdrawButtonElementOptions;\n\tclassName?: string;\n\tstyle?: React.CSSProperties;\n\tonReady?: () => void;\n\tfallback?: React.ReactNode;\n}) {\n\tconst payoutsSession = usePayoutsSession();\n\tconst ref = useRef<HTMLDivElement>(null);\n\tconst element = useMemo(() => {\n\t\tif (!payoutsSession) return null;\n\t\tconst createdElement = payoutsSession.createElement(\n\t\t\tWithdrawButtonElement,\n\t\t\toptions,\n\t\t);\n\t\treturn createdElement;\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [payoutsSession]);\n\n\tconst elementSnapshot = useElementSnapshot(element);\n\n\tconst isReady = elementSnapshot?.state === \"ready\";\n\n\tuseEffect(() => {\n\t\tif (!element) return;\n\t\telement.updateOptions(options);\n\t}, [options, element]);\n\n\tuseEffect(() => {\n\t\tif (!element || !onReady) return;\n\t\telement.on(\"ready\", onReady);\n\t\treturn () => {\n\t\t\telement.off(\"ready\", onReady);\n\t\t};\n\t}, [element, onReady]);\n\n\tuseLayoutEffect(() => {\n\t\tif (!element || !ref.current) return;\n\t\telement.mount(ref.current);\n\t\treturn () => {\n\t\t\telement.unmount();\n\t\t};\n\t}, [element, ref.current]);\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tstyle={{ ...style, visibility: isReady ? \"visible\" : \"hidden\" }}\n\t\t\t\tclassName={className}\n\t\t\t\tref={ref}\n\t\t\t/>\n\t\t\t{!isReady && (fallback ?? null)}\n\t\t</>\n\t);\n}\n\nWithdrawButtonElement.displayName = \"WithdrawButtonElement\";\nWithdrawButtonElement.type = \"withdraw-button-element\" as const;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAAmE;AACnE,kCAAmC;AACnC,qBAAkC;AAE3B,SAAS,sBAAsB;AAAA,EACrC,UAAU,CAAC;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAMG;AACF,QAAM,qBAAiB,kCAAkB;AACzC,QAAM,UAAM,qBAAuB,IAAI;AACvC,QAAM,cAAU,sBAAQ,MAAM;AAC7B,QAAI,CAAC,eAAgB,QAAO;AAC5B,UAAM,iBAAiB,eAAe;AAAA,MACrC;AAAA,MACA;AAAA,IACD;AACA,WAAO;AAAA,EAER,GAAG,CAAC,cAAc,CAAC;AAEnB,QAAM,sBAAkB,gDAAmB,OAAO;AAElD,QAAM,UAAU,iBAAiB,UAAU;AAE3C,8BAAU,MAAM;AACf,QAAI,CAAC,QAAS;AACd,YAAQ,cAAc,OAAO;AAAA,EAC9B,GAAG,CAAC,SAAS,OAAO,CAAC;AAErB,8BAAU,MAAM;AACf,QAAI,CAAC,WAAW,CAAC,QAAS;AAC1B,YAAQ,GAAG,SAAS,OAAO;AAC3B,WAAO,MAAM;AACZ,cAAQ,IAAI,SAAS,OAAO;AAAA,IAC7B;AAAA,EACD,GAAG,CAAC,SAAS,OAAO,CAAC;AAErB,oCAAgB,MAAM;AACrB,QAAI,CAAC,WAAW,CAAC,IAAI,QAAS;AAC9B,YAAQ,MAAM,IAAI,OAAO;AACzB,WAAO,MAAM;AACZ,cAAQ,QAAQ;AAAA,IACjB;AAAA,EACD,GAAG,CAAC,SAAS,IAAI,OAAO,CAAC;AAEzB,SACC,6BAAAA,QAAA,2BAAAA,QAAA,gBACC,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACA,OAAO,EAAE,GAAG,OAAO,YAAY,UAAU,YAAY,SAAS;AAAA,MAC9D;AAAA,MACA;AAAA;AAAA,EACD,GACC,CAAC,YAAY,YAAY,KAC3B;AAEF;AAEA,sBAAsB,cAAc;AACpC,sBAAsB,OAAO;","names":["React"]}

package/dist/payouts/elements/withdraw-button.mjs

@@ -0,0 +1,56 @@
+"use client";
+import "../../chunk-NSSMTXJJ.mjs";
+import React, { useEffect, useLayoutEffect, useMemo, useRef } from "react";
+import { useElementSnapshot } from "../../lib/use-element-snapshot.mjs";
+import { usePayoutsSession } from "../session.mjs";
+function WithdrawButtonElement({ options = {}, className, style, onReady, fallback }) {
+    const payoutsSession = usePayoutsSession();
+    const ref = useRef(null);
+    const element = useMemo(()=>{
+        if (!payoutsSession) return null;
+        const createdElement = payoutsSession.createElement(WithdrawButtonElement, options);
+        return createdElement;
+    }, [
+        payoutsSession
+    ]);
+    const elementSnapshot = useElementSnapshot(element);
+    const isReady = elementSnapshot?.state === "ready";
+    useEffect(()=>{
+        if (!element) return;
+        element.updateOptions(options);
+    }, [
+        options,
+        element
+    ]);
+    useEffect(()=>{
+        if (!element || !onReady) return;
+        element.on("ready", onReady);
+        return ()=>{
+            element.off("ready", onReady);
+        };
+    }, [
+        element,
+        onReady
+    ]);
+    useLayoutEffect(()=>{
+        if (!element || !ref.current) return;
+        element.mount(ref.current);
+        return ()=>{
+            element.unmount();
+        };
+    }, [
+        element,
+        ref.current
+    ]);
+    return React.createElement(React.Fragment, null, React.createElement("div", {
+        style: {
+            ...style,
+            visibility: isReady ? "visible" : "hidden"
+        },
+        className,
+        ref
+    }), !isReady && (fallback ?? null));
+}
+WithdrawButtonElement.displayName = "WithdrawButtonElement";
+WithdrawButtonElement.type = "withdraw-button-element";
+export { WithdrawButtonElement };

package/dist/payouts/elements/withdraw-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/payouts/elements/withdraw-button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { WithdrawButtonElementOptions } from \"@whop/embedded-components-vanilla-js/types\";\n\nimport React, { useEffect, useLayoutEffect, useMemo, useRef } from \"react\";\nimport { useElementSnapshot } from \"../../lib/use-element-snapshot\";\nimport { usePayoutsSession } from \"../session\";\n\nexport function WithdrawButtonElement({\n\toptions = {},\n\tclassName,\n\tstyle,\n\tonReady,\n\tfallback,\n}: {\n\toptions?: WithdrawButtonElementOptions;\n\tclassName?: string;\n\tstyle?: React.CSSProperties;\n\tonReady?: () => void;\n\tfallback?: React.ReactNode;\n}) {\n\tconst payoutsSession = usePayoutsSession();\n\tconst ref = useRef<HTMLDivElement>(null);\n\tconst element = useMemo(() => {\n\t\tif (!payoutsSession) return null;\n\t\tconst createdElement = payoutsSession.createElement(\n\t\t\tWithdrawButtonElement,\n\t\t\toptions,\n\t\t);\n\t\treturn createdElement;\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [payoutsSession]);\n\n\tconst elementSnapshot = useElementSnapshot(element);\n\n\tconst isReady = elementSnapshot?.state === \"ready\";\n\n\tuseEffect(() => {\n\t\tif (!element) return;\n\t\telement.updateOptions(options);\n\t}, [options, element]);\n\n\tuseEffect(() => {\n\t\tif (!element || !onReady) return;\n\t\telement.on(\"ready\", onReady);\n\t\treturn () => {\n\t\t\telement.off(\"ready\", onReady);\n\t\t};\n\t}, [element, onReady]);\n\n\tuseLayoutEffect(() => {\n\t\tif (!element || !ref.current) return;\n\t\telement.mount(ref.current);\n\t\treturn () => {\n\t\t\telement.unmount();\n\t\t};\n\t}, [element, ref.current]);\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tstyle={{ ...style, visibility: isReady ? \"visible\" : \"hidden\" }}\n\t\t\t\tclassName={className}\n\t\t\t\tref={ref}\n\t\t\t/>\n\t\t\t{!isReady && (fallback ?? null)}\n\t\t</>\n\t);\n}\n\nWithdrawButtonElement.displayName = \"WithdrawButtonElement\";\nWithdrawButtonElement.type = \"withdraw-button-element\" as const;\n"],"mappings":";;AAIA,OAAO,SAAS,WAAW,iBAAiB,SAAS,cAAc;AACnE,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAE3B,SAAS,sBAAsB;AAAA,EACrC,UAAU,CAAC;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAMG;AACF,QAAM,iBAAiB,kBAAkB;AACzC,QAAM,MAAM,OAAuB,IAAI;AACvC,QAAM,UAAU,QAAQ,MAAM;AAC7B,QAAI,CAAC,eAAgB,QAAO;AAC5B,UAAM,iBAAiB,eAAe;AAAA,MACrC;AAAA,MACA;AAAA,IACD;AACA,WAAO;AAAA,EAER,GAAG,CAAC,cAAc,CAAC;AAEnB,QAAM,kBAAkB,mBAAmB,OAAO;AAElD,QAAM,UAAU,iBAAiB,UAAU;AAE3C,YAAU,MAAM;AACf,QAAI,CAAC,QAAS;AACd,YAAQ,cAAc,OAAO;AAAA,EAC9B,GAAG,CAAC,SAAS,OAAO,CAAC;AAErB,YAAU,MAAM;AACf,QAAI,CAAC,WAAW,CAAC,QAAS;AAC1B,YAAQ,GAAG,SAAS,OAAO;AAC3B,WAAO,MAAM;AACZ,cAAQ,IAAI,SAAS,OAAO;AAAA,IAC7B;AAAA,EACD,GAAG,CAAC,SAAS,OAAO,CAAC;AAErB,kBAAgB,MAAM;AACrB,QAAI,CAAC,WAAW,CAAC,IAAI,QAAS;AAC9B,YAAQ,MAAM,IAAI,OAAO;AACzB,WAAO,MAAM;AACZ,cAAQ,QAAQ;AAAA,IACjB;AAAA,EACD,GAAG,CAAC,SAAS,IAAI,OAAO,CAAC;AAEzB,SACC,0DACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAO,EAAE,GAAG,OAAO,YAAY,UAAU,YAAY,SAAS;AAAA,MAC9D;AAAA,MACA;AAAA;AAAA,EACD,GACC,CAAC,YAAY,YAAY,KAC3B;AAEF;AAEA,sBAAsB,cAAc;AACpC,sBAAsB,OAAO;","names":[]}

package/dist/payouts/index.d.ts

@@ -0,0 +1,6 @@
+export { PayoutsSession, usePayoutsSession } from './session.js';
+export { VerifyElement } from './elements/verify.js';
+export { WithdrawButtonElement } from './elements/withdraw-button.js';
+export { BalanceElement } from './elements/balance.js';
+import '@whop/embedded-components-vanilla-js/types';
+import 'react';

package/dist/payouts/index.js

@@ -0,0 +1,20 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var payouts_exports = {};
+module.exports = __toCommonJS(payouts_exports);
+__reExport(payouts_exports, require("./session"), module.exports);
+__reExport(payouts_exports, require("./elements"), module.exports);
+//# sourceMappingURL=index.js.map

package/dist/payouts/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/payouts/index.tsx"],"sourcesContent":["export * from \"./session\";\nexport * from \"./elements\";\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,4BAAc,sBAAd;AACA,4BAAc,uBADd;","names":[]}

package/dist/payouts/index.mjs

@@ -0,0 +1,2 @@
+export * from "./session.mjs";
+export * from "./elements/index.mjs";

package/dist/payouts/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/payouts/index.tsx"],"sourcesContent":["export * from \"./session\";\nexport * from \"./elements\";\n"],"mappings":"AAAA,cAAc;AACd,cAAc;","names":[]}

package/dist/payouts/session.d.ts

@@ -0,0 +1,7 @@
+import { PayoutsSession as PayoutsSession$1, PayoutsSessionOptions } from '@whop/embedded-components-vanilla-js/types';
+import React, { PropsWithChildren } from 'react';
+
+declare function usePayoutsSession(): PayoutsSession$1 | null;
+declare function PayoutsSession({ children, currency, token, }: PropsWithChildren<PayoutsSessionOptions>): React.JSX.Element;
+
+export { PayoutsSession, usePayoutsSession };

package/dist/payouts/session.js

@@ -0,0 +1,77 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var session_exports = {};
+__export(session_exports, {
+  PayoutsSession: () => PayoutsSession,
+  usePayoutsSession: () => usePayoutsSession
+});
+module.exports = __toCommonJS(session_exports);
+var import_react = __toESM(require("react"));
+var import_react2 = require("react");
+var import_provider = require("../provider");
+const PayoutsSessionContext = (0, import_react2.createContext)(null);
+function usePayoutsSession() {
+  const ctx = (0, import_react2.useContext)(PayoutsSessionContext);
+  if (!ctx) {
+    throw new Error(
+      "usePayoutsSession must be used within a PayoutsSessionProvider"
+    );
+  }
+  return ctx.payoutsSession;
+}
+function PayoutsSession({
+  children,
+  currency,
+  token
+}) {
+  const elements = (0, import_provider.useElements)();
+  const payoutsSession = (0, import_react2.useMemo)(() => {
+    if (!elements) return null;
+    return elements.createPayoutsSession({
+      token,
+      currency
+    });
+  }, [elements]);
+  (0, import_react2.useEffect)(() => {
+    if (!payoutsSession) return;
+    payoutsSession.updateOptions({
+      token,
+      currency
+    });
+  }, [payoutsSession, currency, token]);
+  const value = (0, import_react2.useMemo)(
+    () => ({
+      payoutsSession
+    }),
+    [payoutsSession]
+  );
+  return /* @__PURE__ */ import_react.default.createElement(PayoutsSessionContext.Provider, { value }, children);
+}
+//# sourceMappingURL=session.js.map

package/dist/payouts/session.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/payouts/session.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n\tPayoutsSessionOptions,\n\tPayoutsSession as PayoutsSessionType,\n} from \"@whop/embedded-components-vanilla-js/types\";\nimport type { PropsWithChildren } from \"react\";\n\nimport React from \"react\";\nimport { createContext, useContext, useEffect, useMemo } from \"react\";\nimport { useElements } from \"../provider\";\n\ninterface ContextState {\n\tpayoutsSession: PayoutsSessionType | null;\n}\n\nconst PayoutsSessionContext = createContext<ContextState | null>(null);\n\nexport function usePayoutsSession() {\n\tconst ctx = useContext(PayoutsSessionContext);\n\tif (!ctx) {\n\t\tthrow new Error(\n\t\t\t\"usePayoutsSession must be used within a PayoutsSessionProvider\",\n\t\t);\n\t}\n\treturn ctx.payoutsSession;\n}\n\nexport function PayoutsSession({\n\tchildren,\n\tcurrency,\n\ttoken,\n}: PropsWithChildren<PayoutsSessionOptions>) {\n\tconst elements = useElements();\n\n\tconst payoutsSession = useMemo(() => {\n\t\tif (!elements) return null;\n\t\treturn elements.createPayoutsSession({\n\t\t\ttoken,\n\t\t\tcurrency,\n\t\t});\n\t}, [elements]);\n\n\tuseEffect(() => {\n\t\tif (!payoutsSession) return;\n\n\t\tpayoutsSession.updateOptions({\n\t\t\ttoken,\n\t\t\tcurrency,\n\t\t});\n\t}, [payoutsSession, currency, token]);\n\n\tconst value: ContextState = useMemo(\n\t\t() => ({\n\t\t\tpayoutsSession,\n\t\t}),\n\t\t[payoutsSession],\n\t);\n\n\treturn (\n\t\t<PayoutsSessionContext.Provider value={value}>\n\t\t\t{children}\n\t\t</PayoutsSessionContext.Provider>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,mBAAkB;AAClB,IAAAA,gBAA8D;AAC9D,sBAA4B;AAM5B,MAAM,4BAAwB,6BAAmC,IAAI;AAE9D,SAAS,oBAAoB;AACnC,QAAM,UAAM,0BAAW,qBAAqB;AAC5C,MAAI,CAAC,KAAK;AACT,UAAM,IAAI;AAAA,MACT;AAAA,IACD;AAAA,EACD;AACA,SAAO,IAAI;AACZ;AAEO,SAAS,eAAe;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACD,GAA6C;AAC5C,QAAM,eAAW,6BAAY;AAE7B,QAAM,qBAAiB,uBAAQ,MAAM;AACpC,QAAI,CAAC,SAAU,QAAO;AACtB,WAAO,SAAS,qBAAqB;AAAA,MACpC;AAAA,MACA;AAAA,IACD,CAAC;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,+BAAU,MAAM;AACf,QAAI,CAAC,eAAgB;AAErB,mBAAe,cAAc;AAAA,MAC5B;AAAA,MACA;AAAA,IACD,CAAC;AAAA,EACF,GAAG,CAAC,gBAAgB,UAAU,KAAK,CAAC;AAEpC,QAAM,YAAsB;AAAA,IAC3B,OAAO;AAAA,MACN;AAAA,IACD;AAAA,IACA,CAAC,cAAc;AAAA,EAChB;AAEA,SACC,6BAAAC,QAAA,cAAC,sBAAsB,UAAtB,EAA+B,SAC9B,QACF;AAEF;","names":["import_react","React"]}

package/dist/payouts/session.mjs

@@ -0,0 +1,45 @@
+"use client";
+import "../chunk-NSSMTXJJ.mjs";
+import React from "react";
+import { createContext, useContext, useEffect, useMemo } from "react";
+import { useElements } from "../provider.mjs";
+const PayoutsSessionContext = createContext(null);
+function usePayoutsSession() {
+    const ctx = useContext(PayoutsSessionContext);
+    if (!ctx) {
+        throw new Error("usePayoutsSession must be used within a PayoutsSessionProvider");
+    }
+    return ctx.payoutsSession;
+}
+function PayoutsSession({ children, currency, token }) {
+    const elements = useElements();
+    const payoutsSession = useMemo(()=>{
+        if (!elements) return null;
+        return elements.createPayoutsSession({
+            token,
+            currency
+        });
+    }, [
+        elements
+    ]);
+    useEffect(()=>{
+        if (!payoutsSession) return;
+        payoutsSession.updateOptions({
+            token,
+            currency
+        });
+    }, [
+        payoutsSession,
+        currency,
+        token
+    ]);
+    const value = useMemo(()=>({
+            payoutsSession
+        }), [
+        payoutsSession
+    ]);
+    return React.createElement(PayoutsSessionContext.Provider, {
+        value
+    }, children);
+}
+export { PayoutsSession, usePayoutsSession };

package/dist/payouts/session.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/payouts/session.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n\tPayoutsSessionOptions,\n\tPayoutsSession as PayoutsSessionType,\n} from \"@whop/embedded-components-vanilla-js/types\";\nimport type { PropsWithChildren } from \"react\";\n\nimport React from \"react\";\nimport { createContext, useContext, useEffect, useMemo } from \"react\";\nimport { useElements } from \"../provider\";\n\ninterface ContextState {\n\tpayoutsSession: PayoutsSessionType | null;\n}\n\nconst PayoutsSessionContext = createContext<ContextState | null>(null);\n\nexport function usePayoutsSession() {\n\tconst ctx = useContext(PayoutsSessionContext);\n\tif (!ctx) {\n\t\tthrow new Error(\n\t\t\t\"usePayoutsSession must be used within a PayoutsSessionProvider\",\n\t\t);\n\t}\n\treturn ctx.payoutsSession;\n}\n\nexport function PayoutsSession({\n\tchildren,\n\tcurrency,\n\ttoken,\n}: PropsWithChildren<PayoutsSessionOptions>) {\n\tconst elements = useElements();\n\n\tconst payoutsSession = useMemo(() => {\n\t\tif (!elements) return null;\n\t\treturn elements.createPayoutsSession({\n\t\t\ttoken,\n\t\t\tcurrency,\n\t\t});\n\t}, [elements]);\n\n\tuseEffect(() => {\n\t\tif (!payoutsSession) return;\n\n\t\tpayoutsSession.updateOptions({\n\t\t\ttoken,\n\t\t\tcurrency,\n\t\t});\n\t}, [payoutsSession, currency, token]);\n\n\tconst value: ContextState = useMemo(\n\t\t() => ({\n\t\t\tpayoutsSession,\n\t\t}),\n\t\t[payoutsSession],\n\t);\n\n\treturn (\n\t\t<PayoutsSessionContext.Provider value={value}>\n\t\t\t{children}\n\t\t</PayoutsSessionContext.Provider>\n\t);\n}\n"],"mappings":";;AAQA,OAAO,WAAW;AAClB,SAAS,eAAe,YAAY,WAAW,eAAe;AAC9D,SAAS,mBAAmB;AAM5B,MAAM,wBAAwB,cAAmC,IAAI;AAE9D,SAAS,oBAAoB;AACnC,QAAM,MAAM,WAAW,qBAAqB;AAC5C,MAAI,CAAC,KAAK;AACT,UAAM,IAAI;AAAA,MACT;AAAA,IACD;AAAA,EACD;AACA,SAAO,IAAI;AACZ;AAEO,SAAS,eAAe;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACD,GAA6C;AAC5C,QAAM,WAAW,YAAY;AAE7B,QAAM,iBAAiB,QAAQ,MAAM;AACpC,QAAI,CAAC,SAAU,QAAO;AACtB,WAAO,SAAS,qBAAqB;AAAA,MACpC;AAAA,MACA;AAAA,IACD,CAAC;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,YAAU,MAAM;AACf,QAAI,CAAC,eAAgB;AAErB,mBAAe,cAAc;AAAA,MAC5B;AAAA,MACA;AAAA,IACD,CAAC;AAAA,EACF,GAAG,CAAC,gBAAgB,UAAU,KAAK,CAAC;AAEpC,QAAM,QAAsB;AAAA,IAC3B,OAAO;AAAA,MACN;AAAA,IACD;AAAA,IACA,CAAC,cAAc;AAAA,EAChB;AAEA,SACC,oCAAC,sBAAsB,UAAtB,EAA+B,SAC9B,QACF;AAEF;","names":[]}

package/dist/provider.d.ts

@@ -0,0 +1,11 @@
+import { WhopElements, WhopElementsOptions } from '@whop/embedded-components-vanilla-js/types';
+import React from 'react';
+
+declare function useElements(): WhopElements | null;
+type ElementsProp = PromiseLike<WhopElements | null> | WhopElements | null;
+declare function Elements({ children, elements: elementsProp, appearance, locale, }: {
+    children: React.ReactNode;
+    elements: ElementsProp;
+} & WhopElementsOptions): React.JSX.Element;
+
+export { Elements, useElements };

package/dist/provider.js

@@ -0,0 +1,116 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var provider_exports = {};
+__export(provider_exports, {
+  Elements: () => Elements,
+  useElements: () => useElements
+});
+module.exports = __toCommonJS(provider_exports);
+var import_react = __toESM(require("react"));
+var import_react2 = require("react");
+const ElementsContext = (0, import_react2.createContext)(null);
+function useElements() {
+  const ctx = (0, import_react2.useContext)(ElementsContext);
+  if (!ctx) {
+    throw new Error("useElements must be used within a ElementsProvider");
+  }
+  return ctx.elements;
+}
+function normalizeElementsProp(prop) {
+  if (prop instanceof Promise) return prop;
+  return Promise.resolve(prop);
+}
+class PromiseStore {
+  constructor(promise) {
+    __publicField(this, "subscribers", /* @__PURE__ */ new Set());
+    __publicField(this, "value", { state: "pending" });
+    __publicField(this, "subscribe", (listener) => {
+      this.subscribers.add(listener);
+      return () => {
+        this.subscribers.delete(listener);
+      };
+    });
+    promise.then((value) => {
+      this.value = { state: "fulfilled", value };
+      for (const subscriber of this.subscribers) {
+        subscriber();
+      }
+    }).catch((err) => {
+      this.value = { state: "rejected", error: err };
+      for (const subscriber of this.subscribers) {
+        subscriber();
+      }
+    });
+  }
+  getSnapshot() {
+    return this.value;
+  }
+}
+function useAwaitElements(elements) {
+  const store = (0, import_react2.useMemo)(
+    () => new PromiseStore(Promise.resolve(elements)),
+    [elements]
+  );
+  const state = (0, import_react.useSyncExternalStore)(
+    store.subscribe,
+    () => {
+      const snapshot = store.getSnapshot();
+      if (snapshot.state === "fulfilled") {
+        return snapshot.value;
+      }
+      return null;
+    },
+    () => null
+  );
+  return state;
+}
+function Elements({
+  children,
+  elements: elementsProp,
+  appearance,
+  locale
+}) {
+  const elementsPromise = normalizeElementsProp(elementsProp);
+  const elements = useAwaitElements(elementsPromise);
+  (0, import_react2.useEffect)(() => {
+    if (!elements) return;
+    elements.updateOptions({ appearance, locale });
+  }, [elements, appearance, locale]);
+  const value = (0, import_react2.useMemo)(
+    () => ({
+      elements
+    }),
+    [elements]
+  );
+  return /* @__PURE__ */ import_react.default.createElement(ElementsContext.Provider, { value }, children);
+}
+//# sourceMappingURL=provider.js.map

package/dist/provider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/provider.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n\tWhopElements,\n\tWhopElementsOptions,\n} from \"@whop/embedded-components-vanilla-js/types\";\n\nimport React, { useSyncExternalStore } from \"react\";\nimport { createContext, useContext, useEffect, useMemo } from \"react\";\n\ninterface ContextState {\n\telements: WhopElements | null;\n}\n\nconst ElementsContext = createContext<ContextState | null>(null);\n\nexport function useElements() {\n\tconst ctx = useContext(ElementsContext);\n\tif (!ctx) {\n\t\tthrow new Error(\"useElements must be used within a ElementsProvider\");\n\t}\n\n\treturn ctx.elements;\n}\n\ntype ElementsProp = PromiseLike<WhopElements | null> | WhopElements | null;\n\nfunction normalizeElementsProp(\n\tprop: ElementsProp,\n): Promise<Awaited<ElementsProp>> {\n\tif (prop instanceof Promise) return prop;\n\treturn Promise.resolve(prop);\n}\n\nclass PromiseStore<T> {\n\tprivate subscribers: Set<() => void> = new Set();\n\tprivate value:\n\t\t| {\n\t\t\t\tstate: \"pending\";\n\t\t  }\n\t\t| {\n\t\t\t\tstate: \"fulfilled\";\n\t\t\t\tvalue: T;\n\t\t  }\n\t\t| {\n\t\t\t\tstate: \"rejected\";\n\t\t\t\terror: unknown;\n\t\t  } = { state: \"pending\" };\n\n\tconstructor(promise: Promise<T>) {\n\t\tpromise\n\t\t\t.then((value) => {\n\t\t\t\tthis.value = { state: \"fulfilled\", value };\n\t\t\t\tfor (const subscriber of this.subscribers) {\n\t\t\t\t\tsubscriber();\n\t\t\t\t}\n\t\t\t})\n\t\t\t.catch((err) => {\n\t\t\t\tthis.value = { state: \"rejected\", error: err };\n\t\t\t\tfor (const subscriber of this.subscribers) {\n\t\t\t\t\tsubscriber();\n\t\t\t\t}\n\t\t\t});\n\t}\n\n\tpublic getSnapshot() {\n\t\treturn this.value;\n\t}\n\n\tpublic subscribe = (listener: () => void) => {\n\t\tthis.subscribers.add(listener);\n\t\treturn () => {\n\t\t\tthis.subscribers.delete(listener);\n\t\t};\n\t};\n}\n\nfunction useAwaitElements(elements: ElementsProp | null) {\n\tconst store = useMemo(\n\t\t() => new PromiseStore(Promise.resolve(elements)),\n\t\t[elements],\n\t);\n\n\tconst state = useSyncExternalStore(\n\t\tstore.subscribe,\n\t\t() => {\n\t\t\tconst snapshot = store.getSnapshot();\n\t\t\tif (snapshot.state === \"fulfilled\") {\n\t\t\t\treturn snapshot.value;\n\t\t\t}\n\t\t\treturn null;\n\t\t},\n\t\t() => null,\n\t);\n\n\treturn state;\n}\n\nexport function Elements({\n\tchildren,\n\telements: elementsProp,\n\tappearance,\n\tlocale,\n}: {\n\tchildren: React.ReactNode;\n\telements: ElementsProp;\n} & WhopElementsOptions) {\n\tconst elementsPromise = normalizeElementsProp(elementsProp);\n\tconst elements = useAwaitElements(elementsPromise);\n\n\tuseEffect(() => {\n\t\tif (!elements) return;\n\t\telements.updateOptions({ appearance, locale });\n\t}, [elements, appearance, locale]);\n\n\tconst value: ContextState = useMemo(\n\t\t() => ({\n\t\t\telements,\n\t\t}),\n\t\t[elements],\n\t);\n\n\treturn (\n\t\t<ElementsContext.Provider value={value}>\n\t\t\t{children}\n\t\t</ElementsContext.Provider>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,mBAA4C;AAC5C,IAAAA,gBAA8D;AAM9D,MAAM,sBAAkB,6BAAmC,IAAI;AAExD,SAAS,cAAc;AAC7B,QAAM,UAAM,0BAAW,eAAe;AACtC,MAAI,CAAC,KAAK;AACT,UAAM,IAAI,MAAM,oDAAoD;AAAA,EACrE;AAEA,SAAO,IAAI;AACZ;AAIA,SAAS,sBACR,MACiC;AACjC,MAAI,gBAAgB,QAAS,QAAO;AACpC,SAAO,QAAQ,QAAQ,IAAI;AAC5B;AAEA,MAAM,aAAgB;AAAA,EAerB,YAAY,SAAqB;AAdjC,wBAAQ,eAA+B,oBAAI,IAAI;AAC/C,wBAAQ,SAWD,EAAE,OAAO,UAAU;AAsB1B,wBAAO,aAAY,CAAC,aAAyB;AAC5C,WAAK,YAAY,IAAI,QAAQ;AAC7B,aAAO,MAAM;AACZ,aAAK,YAAY,OAAO,QAAQ;AAAA,MACjC;AAAA,IACD;AAxBC,YACE,KAAK,CAAC,UAAU;AAChB,WAAK,QAAQ,EAAE,OAAO,aAAa,MAAM;AACzC,iBAAW,cAAc,KAAK,aAAa;AAC1C,mBAAW;AAAA,MACZ;AAAA,IACD,CAAC,EACA,MAAM,CAAC,QAAQ;AACf,WAAK,QAAQ,EAAE,OAAO,YAAY,OAAO,IAAI;AAC7C,iBAAW,cAAc,KAAK,aAAa;AAC1C,mBAAW;AAAA,MACZ;AAAA,IACD,CAAC;AAAA,EACH;AAAA,EAEO,cAAc;AACpB,WAAO,KAAK;AAAA,EACb;AAQD;AAEA,SAAS,iBAAiB,UAA+B;AACxD,QAAM,YAAQ;AAAA,IACb,MAAM,IAAI,aAAa,QAAQ,QAAQ,QAAQ,CAAC;AAAA,IAChD,CAAC,QAAQ;AAAA,EACV;AAEA,QAAM,YAAQ;AAAA,IACb,MAAM;AAAA,IACN,MAAM;AACL,YAAM,WAAW,MAAM,YAAY;AACnC,UAAI,SAAS,UAAU,aAAa;AACnC,eAAO,SAAS;AAAA,MACjB;AACA,aAAO;AAAA,IACR;AAAA,IACA,MAAM;AAAA,EACP;AAEA,SAAO;AACR;AAEO,SAAS,SAAS;AAAA,EACxB;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AACD,GAGyB;AACxB,QAAM,kBAAkB,sBAAsB,YAAY;AAC1D,QAAM,WAAW,iBAAiB,eAAe;AAEjD,+BAAU,MAAM;AACf,QAAI,CAAC,SAAU;AACf,aAAS,cAAc,EAAE,YAAY,OAAO,CAAC;AAAA,EAC9C,GAAG,CAAC,UAAU,YAAY,MAAM,CAAC;AAEjC,QAAM,YAAsB;AAAA,IAC3B,OAAO;AAAA,MACN;AAAA,IACD;AAAA,IACA,CAAC,QAAQ;AAAA,EACV;AAEA,SACC,6BAAAC,QAAA,cAAC,gBAAgB,UAAhB,EAAyB,SACxB,QACF;AAEF;","names":["import_react","React"]}

package/dist/provider.mjs

@@ -0,0 +1,87 @@
+"use client";
+import { __publicField } from "./chunk-NSSMTXJJ.mjs";
+import React, { useSyncExternalStore } from "react";
+import { createContext, useContext, useEffect, useMemo } from "react";
+const ElementsContext = createContext(null);
+function useElements() {
+    const ctx = useContext(ElementsContext);
+    if (!ctx) {
+        throw new Error("useElements must be used within a ElementsProvider");
+    }
+    return ctx.elements;
+}
+function normalizeElementsProp(prop) {
+    if (prop instanceof Promise) return prop;
+    return Promise.resolve(prop);
+}
+class PromiseStore {
+    constructor(promise){
+        __publicField(this, "subscribers", new Set());
+        __publicField(this, "value", {
+            state: "pending"
+        });
+        __publicField(this, "subscribe", (listener)=>{
+            this.subscribers.add(listener);
+            return ()=>{
+                this.subscribers.delete(listener);
+            };
+        });
+        promise.then((value)=>{
+            this.value = {
+                state: "fulfilled",
+                value
+            };
+            for (const subscriber of this.subscribers){
+                subscriber();
+            }
+        }).catch((err)=>{
+            this.value = {
+                state: "rejected",
+                error: err
+            };
+            for (const subscriber of this.subscribers){
+                subscriber();
+            }
+        });
+    }
+    getSnapshot() {
+        return this.value;
+    }
+}
+function useAwaitElements(elements) {
+    const store = useMemo(()=>new PromiseStore(Promise.resolve(elements)), [
+        elements
+    ]);
+    const state = useSyncExternalStore(store.subscribe, ()=>{
+        const snapshot = store.getSnapshot();
+        if (snapshot.state === "fulfilled") {
+            return snapshot.value;
+        }
+        return null;
+    }, ()=>null);
+    return state;
+}
+function Elements({ children, elements: elementsProp, appearance, locale }) {
+    const elementsPromise = normalizeElementsProp(elementsProp);
+    const elements = useAwaitElements(elementsPromise);
+    useEffect(()=>{
+        if (!elements) return;
+        elements.updateOptions({
+            appearance,
+            locale
+        });
+    }, [
+        elements,
+        appearance,
+        locale
+    ]);
+    const value = useMemo(()=>({
+            elements
+        }), [
+        elements
+    ]);
+    return React.createElement(ElementsContext.Provider, {
+        value
+    }, children);
+}
+export { Elements, useElements };

package/dist/provider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/provider.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n\tWhopElements,\n\tWhopElementsOptions,\n} from \"@whop/embedded-components-vanilla-js/types\";\n\nimport React, { useSyncExternalStore } from \"react\";\nimport { createContext, useContext, useEffect, useMemo } from \"react\";\n\ninterface ContextState {\n\telements: WhopElements | null;\n}\n\nconst ElementsContext = createContext<ContextState | null>(null);\n\nexport function useElements() {\n\tconst ctx = useContext(ElementsContext);\n\tif (!ctx) {\n\t\tthrow new Error(\"useElements must be used within a ElementsProvider\");\n\t}\n\n\treturn ctx.elements;\n}\n\ntype ElementsProp = PromiseLike<WhopElements | null> | WhopElements | null;\n\nfunction normalizeElementsProp(\n\tprop: ElementsProp,\n): Promise<Awaited<ElementsProp>> {\n\tif (prop instanceof Promise) return prop;\n\treturn Promise.resolve(prop);\n}\n\nclass PromiseStore<T> {\n\tprivate subscribers: Set<() => void> = new Set();\n\tprivate value:\n\t\t| {\n\t\t\t\tstate: \"pending\";\n\t\t  }\n\t\t| {\n\t\t\t\tstate: \"fulfilled\";\n\t\t\t\tvalue: T;\n\t\t  }\n\t\t| {\n\t\t\t\tstate: \"rejected\";\n\t\t\t\terror: unknown;\n\t\t  } = { state: \"pending\" };\n\n\tconstructor(promise: Promise<T>) {\n\t\tpromise\n\t\t\t.then((value) => {\n\t\t\t\tthis.value = { state: \"fulfilled\", value };\n\t\t\t\tfor (const subscriber of this.subscribers) {\n\t\t\t\t\tsubscriber();\n\t\t\t\t}\n\t\t\t})\n\t\t\t.catch((err) => {\n\t\t\t\tthis.value = { state: \"rejected\", error: err };\n\t\t\t\tfor (const subscriber of this.subscribers) {\n\t\t\t\t\tsubscriber();\n\t\t\t\t}\n\t\t\t});\n\t}\n\n\tpublic getSnapshot() {\n\t\treturn this.value;\n\t}\n\n\tpublic subscribe = (listener: () => void) => {\n\t\tthis.subscribers.add(listener);\n\t\treturn () => {\n\t\t\tthis.subscribers.delete(listener);\n\t\t};\n\t};\n}\n\nfunction useAwaitElements(elements: ElementsProp | null) {\n\tconst store = useMemo(\n\t\t() => new PromiseStore(Promise.resolve(elements)),\n\t\t[elements],\n\t);\n\n\tconst state = useSyncExternalStore(\n\t\tstore.subscribe,\n\t\t() => {\n\t\t\tconst snapshot = store.getSnapshot();\n\t\t\tif (snapshot.state === \"fulfilled\") {\n\t\t\t\treturn snapshot.value;\n\t\t\t}\n\t\t\treturn null;\n\t\t},\n\t\t() => null,\n\t);\n\n\treturn state;\n}\n\nexport function Elements({\n\tchildren,\n\telements: elementsProp,\n\tappearance,\n\tlocale,\n}: {\n\tchildren: React.ReactNode;\n\telements: ElementsProp;\n} & WhopElementsOptions) {\n\tconst elementsPromise = normalizeElementsProp(elementsProp);\n\tconst elements = useAwaitElements(elementsPromise);\n\n\tuseEffect(() => {\n\t\tif (!elements) return;\n\t\telements.updateOptions({ appearance, locale });\n\t}, [elements, appearance, locale]);\n\n\tconst value: ContextState = useMemo(\n\t\t() => ({\n\t\t\telements,\n\t\t}),\n\t\t[elements],\n\t);\n\n\treturn (\n\t\t<ElementsContext.Provider value={value}>\n\t\t\t{children}\n\t\t</ElementsContext.Provider>\n\t);\n}\n"],"mappings":";;;;AAOA,OAAO,SAAS,4BAA4B;AAC5C,SAAS,eAAe,YAAY,WAAW,eAAe;AAM9D,MAAM,kBAAkB,cAAmC,IAAI;AAExD,SAAS,cAAc;AAC7B,QAAM,MAAM,WAAW,eAAe;AACtC,MAAI,CAAC,KAAK;AACT,UAAM,IAAI,MAAM,oDAAoD;AAAA,EACrE;AAEA,SAAO,IAAI;AACZ;AAIA,SAAS,sBACR,MACiC;AACjC,MAAI,gBAAgB,QAAS,QAAO;AACpC,SAAO,QAAQ,QAAQ,IAAI;AAC5B;AAEA,MAAM,aAAgB;AAAA,EAerB,YAAY,SAAqB;AAdjC,wBAAQ,eAA+B,oBAAI,IAAI;AAC/C,wBAAQ,SAWD,EAAE,OAAO,UAAU;AAsB1B,wBAAO,aAAY,CAAC,aAAyB;AAC5C,WAAK,YAAY,IAAI,QAAQ;AAC7B,aAAO,MAAM;AACZ,aAAK,YAAY,OAAO,QAAQ;AAAA,MACjC;AAAA,IACD;AAxBC,YACE,KAAK,CAAC,UAAU;AAChB,WAAK,QAAQ,EAAE,OAAO,aAAa,MAAM;AACzC,iBAAW,cAAc,KAAK,aAAa;AAC1C,mBAAW;AAAA,MACZ;AAAA,IACD,CAAC,EACA,MAAM,CAAC,QAAQ;AACf,WAAK,QAAQ,EAAE,OAAO,YAAY,OAAO,IAAI;AAC7C,iBAAW,cAAc,KAAK,aAAa;AAC1C,mBAAW;AAAA,MACZ;AAAA,IACD,CAAC;AAAA,EACH;AAAA,EAEO,cAAc;AACpB,WAAO,KAAK;AAAA,EACb;AAQD;AAEA,SAAS,iBAAiB,UAA+B;AACxD,QAAM,QAAQ;AAAA,IACb,MAAM,IAAI,aAAa,QAAQ,QAAQ,QAAQ,CAAC;AAAA,IAChD,CAAC,QAAQ;AAAA,EACV;AAEA,QAAM,QAAQ;AAAA,IACb,MAAM;AAAA,IACN,MAAM;AACL,YAAM,WAAW,MAAM,YAAY;AACnC,UAAI,SAAS,UAAU,aAAa;AACnC,eAAO,SAAS;AAAA,MACjB;AACA,aAAO;AAAA,IACR;AAAA,IACA,MAAM;AAAA,EACP;AAEA,SAAO;AACR;AAEO,SAAS,SAAS;AAAA,EACxB;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AACD,GAGyB;AACxB,QAAM,kBAAkB,sBAAsB,YAAY;AAC1D,QAAM,WAAW,iBAAiB,eAAe;AAEjD,YAAU,MAAM;AACf,QAAI,CAAC,SAAU;AACf,aAAS,cAAc,EAAE,YAAY,OAAO,CAAC;AAAA,EAC9C,GAAG,CAAC,UAAU,YAAY,MAAM,CAAC;AAEjC,QAAM,QAAsB;AAAA,IAC3B,OAAO;AAAA,MACN;AAAA,IACD;AAAA,IACA,CAAC,QAAQ;AAAA,EACV;AAEA,SACC,oCAAC,gBAAgB,UAAhB,EAAyB,SACxB,QACF;AAEF;","names":[]}

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@whop/embedded-components-react-js",
+  "version": "0.0.0",
+  "description": "React components for Whop.js",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "jsnext:main": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "typing": "dist/index.d.ts",
+  "keywords": [
+    "Whop",
+    "Whop.js",
+    "React",
+    "embedded",
+    "payments",
+    "payouts"
+  ],
+  "author": "Whop (https://whop.com)",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "devDependencies": {
+    "@swc/core": "1.11.29",
+    "@types/node": "latest",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "eslint": "latest",
+    "fast-glob": "^3.3.3",
+    "react": "18.1.0",
+    "react-dom": "18.1.0",
+    "rimraf": "^6.1.0",
+    "tsup": "latest",
+    "typescript": "latest",
+    "@local/eslint-config": "0.0.0",
+    "@whop/embedded-components-vanilla-js": "^0.0.0",
+    "@local/typescript-config": "0.0.0"
+  },
+  "peerDependencies": {
+    "react": ">=16.8.0 <20.0.0",
+    "react-dom": ">=16.8.0 <20.0.0",
+    "@whop/embedded-components-vanilla-js": "^0.0.0"
+  },
+  "scripts": {
+    "build": "rimraf dist && NODE_ENV=production tsup",
+    "dev": "NODE_ENV=development tsup --watch"
+  }
+}