UNPKG

@whop/embedded-components-react-js

Version:

React components for Whop.js

1 lines 4.52 kB
{"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":[]}