@frak-labs/components 1.0.5 → 1.0.6-beta.dc7ed9db

package/dist/usePlacement-SHVjZ5IW.js

@@ -0,0 +1,404 @@
+import register from "preact-custom-element";
+import * as coreSdkIndex from "@frak-labs/core-sdk";
+import { decompressJsonFromB64, sdkConfigStore, setupClient, trackEvent, withCache } from "@frak-labs/core-sdk";
+import * as coreSdkActions from "@frak-labs/core-sdk/actions";
+import { displaySharingPage } from "@frak-labs/core-sdk/actions";
+import { useEffect, useMemo, useState } from "preact/hooks";
+//#region src/actions/sharingPage.ts
+async function openSharingPage(targetInteraction, placement, options) {
+	if (!window.FrakSetup?.client) {
+		console.error("Frak client not found");
+		return;
+	}
+	await displaySharingPage(window.FrakSetup.client, {
+		...options?.link && { link: options.link },
+		...options?.products?.length && { products: options.products },
+		...targetInteraction && { metadata: { targetInteraction } }
+	}, placement);
+}
+//#endregion
+//#region src/utils/dom/detectListenerPreloads.ts
+/**
+* Tags that count as "Frak components" for the purpose of preload detection.
+*
+* Kept in sync with the registry in `bootstrap/loader.ts#COMPONENTS_MAP` —
+* any new public custom element should be added here too so the iframe
+* preload hash reflects the user's actual page surface.
+*/
+const FRAK_COMPONENT_SELECTOR = [
+	"frak-button-share",
+	"frak-button-wallet",
+	"frak-open-in-app",
+	"frak-post-purchase",
+	"frak-banner"
+].join(",");
+/**
+* Dynamically compute the iframe preload list based on which Frak components
+* are present in the current document.
+*
+* Behaviour:
+*  - No `frak-*` element on the page → `[]` (caller should skip the
+*    `#preload=...` hash entirely so the listener doesn't warm chunks no one
+*    will use).
+*  - At least one `frak-*` element → `["sharing"]`. Every public component
+*    eventually opens the sharing flow (directly via `<frak-button-share>` or
+*    indirectly via wallet/post-purchase/banner CTAs), so a single hint
+*    covers the whole surface without bloating the iframe URL.
+*
+* Called once during {@link initFrakSdk}, before {@link setupClient} creates
+* the iframe. Dynamically-mounted components (added after init) still work —
+* the listener loads handlers on demand — they just skip the warm-up.
+*/
+function detectListenerPreloads() {
+	if (typeof document === "undefined") return [];
+	return document.querySelector(FRAK_COMPONENT_SELECTOR) !== null ? ["sharing"] : [];
+}
+//#endregion
+//#region src/utils/sharingPageProducts.ts
+/**
+* Whether `value` is a syntactically valid URL with an `http(s):` scheme.
+*
+* Used to gate `imageUrl` / `link` fields coming from untrusted inputs (the
+* public `products` prop on `<frak-post-purchase>`, decoded query params for
+* Klaviyo / email share links, etc.) — the listener-side sharing-page builder
+* calls `new URL(...)` on the incoming product link, and a `javascript:` URL
+* would be a XSS sink in any consumer that binds the value to an `href`.
+*/
+function isHttpUrl(value) {
+	try {
+		const parsed = new URL(value);
+		return parsed.protocol === "http:" || parsed.protocol === "https:";
+	} catch {
+		return false;
+	}
+}
+/**
+* Coerce a raw `products` value into a candidate array suitable for
+* per-item normalisation, or null when it cannot be reduced to one.
+*
+* Accepts:
+* - Real arrays (JS-property surface, decompressed query payloads).
+* - JSON-stringified arrays (HTML-attribute surface — WP / Magento
+*   server-render delivers attribute values as raw strings).
+*
+* Anything else (non-array non-string, JSON parse failure, JSON that
+* decodes to a non-array) is treated as "no products" so the share still
+* works without the product card section.
+*/
+function coerceProductCandidates(products) {
+	if (!products) return null;
+	if (Array.isArray(products)) return products;
+	if (typeof products !== "string") return null;
+	try {
+		const parsed = JSON.parse(products);
+		return Array.isArray(parsed) ? parsed : null;
+	} catch {
+		return null;
+	}
+}
+/**
+* Normalise one untrusted candidate into a {@link SharingPageProduct}, or
+* return null when the candidate has no usable title.
+*
+* The `products` payload is a public API boundary — merchants can set it
+* server-side via WP / Magento, imperatively from arbitrary JS, or via
+* email-template query params built by Klaviyo. Each entry is validated
+* structurally so a malformed `link` reaching `new URL(...)` downstream
+* would not crash the sharing-page builder, and so a `javascript:` URL
+* cannot slip through as `imageUrl` / `link`.
+*/
+function normalizeProductCandidate(candidate) {
+	if (!candidate || typeof candidate !== "object") return null;
+	const item = candidate;
+	const title = typeof item.title === "string" ? item.title.trim() : "";
+	if (title === "") return null;
+	const entry = { title };
+	if (typeof item.imageUrl === "string" && isHttpUrl(item.imageUrl)) entry.imageUrl = item.imageUrl;
+	if (typeof item.link === "string" && isHttpUrl(item.link)) entry.link = item.link;
+	if (typeof item.utmContent === "string" && item.utmContent !== "") entry.utmContent = item.utmContent;
+	return entry;
+}
+/**
+* Pipe `coerceProductCandidates` + `normalizeProductCandidate` over an
+* untrusted value and return a non-empty {@link SharingPageProduct}[] or
+* `undefined` when nothing usable came out.
+*
+* The undefined sentinel is what `openSharingPage` / `displaySharingPage`
+* expect when the caller has no products to show — the sharing page just
+* skips the product card section.
+*/
+function sanitizeProductList(input) {
+	const candidates = coerceProductCandidates(input);
+	if (!candidates) return void 0;
+	const sanitized = [];
+	for (const candidate of candidates) {
+		const entry = normalizeProductCandidate(candidate);
+		if (entry) sanitized.push(entry);
+	}
+	return sanitized.length > 0 ? sanitized : void 0;
+}
+/**
+* Decode a `products` URL query param produced by
+* `compressJsonToB64(productsArray)` — the encoding Klaviyo (and any
+* other email tool) uses when embedding the product list of an order
+* confirmation into a Frak share CTA.
+*
+* The result is run through `sanitizeProductList` so every link / image
+* URL is structurally validated before reaching `new URL(...)` downstream.
+* Malformed / tampered payloads degrade gracefully to `undefined` — the
+* share still works, just without the product card section.
+*/
+function decodeProductsParam(value) {
+	if (!value) return void 0;
+	let decoded;
+	try {
+		decoded = decompressJsonFromB64(value);
+	} catch {
+		return;
+	}
+	if (decoded === null) return void 0;
+	return sanitizeProductList(decoded);
+}
+//#endregion
+//#region src/bootstrap/clientReady.ts
+const CUSTOM_EVENT_NAME = "frak:client";
+/**
+* Dispatch a custom event when the Frak client is ready
+*/
+function dispatchClientReadyEvent() {
+	const event = new CustomEvent(CUSTOM_EVENT_NAME);
+	window.dispatchEvent(event);
+}
+/**
+* Add or remove an event listener for when the Frak client is ready
+* @param action
+* @param callback
+*/
+function onClientReady(action, callback) {
+	if (window.FrakSetup?.client && action === "add") {
+		callback();
+		return;
+	}
+	(action === "add" ? window.addEventListener : window.removeEventListener)(CUSTOM_EVENT_NAME, callback, false);
+}
+//#endregion
+//#region src/bootstrap/initFrakSdk.ts
+/**
+* Initializes the Frak SDK client and sets up necessary configurations.
+* Uses withCache for inflight dedup — concurrent callers share the same promise.
+* Failures are not cached, allowing retry on next call.
+*
+* @returns {Promise<void>}
+*/
+function initFrakSdk() {
+	window.FrakSetup.core = {
+		...coreSdkIndex,
+		...coreSdkActions
+	};
+	if (window.FrakSetup?.client) return Promise.resolve();
+	return withCache(() => doInit(), {
+		cacheKey: "frak-sdk-init",
+		cacheTime: Number.POSITIVE_INFINITY
+	}).catch((err) => {
+		trackEvent(window.FrakSetup?.client, "sdk_init_failed", {
+			reason: err instanceof Error ? err.message : typeof err === "string" ? err : "unknown",
+			config_missing: !window.FrakSetup?.config
+		});
+	});
+}
+/**
+* Performs the actual SDK initialization.
+* Throws on failure so withCache doesn't cache failed attempts.
+*/
+async function doInit() {
+	if (!window.FrakSetup?.config) throw new Error("[Frak SDK] Configuration not found. Please ensure window.FrakSetup.config is set.");
+	console.log("[Frak SDK] Starting initialization");
+	const client = await setupClient({ config: withDynamicPreload(window.FrakSetup.config) });
+	if (!client) throw new Error("[Frak SDK] Failed to create client");
+	window.FrakSetup.client = client;
+	console.log("[Frak SDK] Client initialized successfully");
+	dispatchClientReadyEvent();
+	coreSdkActions.setupReferral(client);
+	handleActionQueryParam();
+}
+/**
+* Inject a dynamically-computed `preload` list when the caller hasn't set
+* one explicitly.
+*
+* Rationale: the listener iframe warms Ring 1/Ring 2 chunks based on the
+* `#preload=...` hash. The components CDN entry can detect which Frak
+* components are actually on the page and avoid the warm-up cost when none
+* are mounted. An explicit `config.preload` (including `[]`) is respected
+* as an escape hatch.
+*/
+function withDynamicPreload(config) {
+	if (config.preload !== void 0) return config;
+	return {
+		...config,
+		preload: detectListenerPreloads()
+	};
+}
+/**
+* Check the query param contain params for an auto opening of the frak modal
+*/
+function handleActionQueryParam() {
+	const url = new URL(window.location.href);
+	if (url.searchParams.get("frakAction") !== "share") return;
+	console.log("[Frak SDK] Auto open share via query param");
+	const link = url.searchParams.get("link") ?? void 0;
+	const placement = url.searchParams.get("placement") ?? void 0;
+	const products = decodeProductsParam(url.searchParams.get("products"));
+	url.searchParams.delete("frakAction");
+	url.searchParams.delete("link");
+	url.searchParams.delete("placement");
+	url.searchParams.delete("products");
+	window.history.replaceState({}, "", url.toString());
+	openSharingPage(void 0, placement, {
+		link,
+		products
+	});
+}
+//#endregion
+//#region src/utils/browser/onDocumentReady.ts
+/**
+* When the document is ready, run the callback
+* @param callback
+*/
+function onDocumentReady(callback) {
+	if (document.readyState === "complete" || document.readyState === "interactive") setTimeout(callback, 1);
+	else document.addEventListener("DOMContentLoaded", callback);
+}
+//#endregion
+//#region src/webcomponent/registerWebComponent.ts
+/**
+* Registers a Preact component as a custom web component
+*
+* @param component - The Preact component to register
+* @param tagName - The custom element tag name (e.g., "frak-button-wallet")
+* @param observedAttributes - Array of attribute names to observe for changes
+* @param options - Registration options (e.g., { shadow: true })
+*/
+function registerWebComponent(component, tagName, observedAttributes = [], options = { shadow: true }) {
+	if (typeof window !== "undefined") {
+		onDocumentReady(initFrakSdk);
+		if (!customElements.get(tagName)) register(component, tagName, observedAttributes, options);
+	}
+}
+//#endregion
+//#region src/hooks/useClientReady.ts
+function useClientReady() {
+	const [shouldRender, setShouldRender] = useState(() => {
+		if (!(window.FrakSetup?.config?.waitForBackendConfig !== false)) return true;
+		return sdkConfigStore.isResolved;
+	});
+	const [isHidden, setIsHidden] = useState(() => sdkConfigStore.getConfig().hidden ?? false);
+	const [isClientReady, setIsClientReady] = useState(() => !!window.FrakSetup?.client);
+	useEffect(() => {
+		const currentConfig = sdkConfigStore.getConfig();
+		if (currentConfig.isResolved) {
+			setShouldRender(true);
+			setIsHidden(currentConfig.hidden ?? false);
+		}
+		if (window.FrakSetup?.client) setIsClientReady(true);
+		const onConfig = (e) => {
+			const config = e.detail;
+			if (config.isResolved) setShouldRender(true);
+			setIsHidden(config.hidden ?? false);
+		};
+		window.addEventListener("frak:config", onConfig);
+		const handleReady = () => setIsClientReady(true);
+		onClientReady("add", handleReady);
+		return () => {
+			window.removeEventListener("frak:config", onConfig);
+			onClientReady("remove", handleReady);
+		};
+	}, []);
+	return {
+		shouldRender,
+		isHidden,
+		isClientReady
+	};
+}
+//#endregion
+//#region src/styles/sharedCss.ts
+const sharedCss = `
+:host {
+    display: contents;
+}
+
+:host([hidden]) {
+    display: none;
+}
+
+.button:disabled {
+    opacity: 0.7;
+    cursor: default;
+}
+
+.button__fadeIn {
+    animation: frak-fadeIn 300ms ease-in;
+}
+
+@keyframes frak-fadeIn {
+    from {
+        opacity: 0;
+    }
+
+    to {
+        opacity: 1;
+    }
+}
+`;
+function buildStyleContent(componentCss, placementCss) {
+	return placementCss ? `${sharedCss}\n${componentCss}\n${placementCss}` : `${sharedCss}\n${componentCss}`;
+}
+const lightDomBaseCss = `
+:where(frak-button-share, frak-open-in-app) {
+    display: contents;
+}
+
+:where(frak-button-share .button, frak-open-in-app .button) {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 10px;
+}
+
+:where(frak-button-share .button:disabled, frak-open-in-app .button:disabled) {
+    opacity: 0.7;
+    cursor: default;
+}
+
+:where(frak-button-share .button__fadeIn, frak-open-in-app .button__fadeIn) {
+    animation: frak-fadeIn 300ms ease-in;
+}
+
+@keyframes frak-fadeIn {
+    from {
+        opacity: 0;
+    }
+
+    to {
+        opacity: 1;
+    }
+}
+`;
+//#endregion
+//#region src/hooks/usePlacement.ts
+function getPlacement(id) {
+	return sdkConfigStore.getConfig().placements?.[id];
+}
+function usePlacement(placementId) {
+	const [configVersion, setConfigVersion] = useState(0);
+	useEffect(() => {
+		const onConfig = (_e) => {
+			setConfigVersion((v) => v + 1);
+		};
+		window.addEventListener("frak:config", onConfig);
+		setConfigVersion((v) => v + 1);
+		return () => window.removeEventListener("frak:config", onConfig);
+	}, []);
+	return useMemo(() => placementId ? getPlacement(placementId) : void 0, [placementId, configVersion]);
+}
+//#endregion
+export { registerWebComponent as a, useClientReady as i, buildStyleContent as n, sanitizeProductList as o, lightDomBaseCss as r, openSharingPage as s, usePlacement as t };

package/package.json

@@ -11,7 +11,7 @@
       "url": "https://twitter.com/QNivelais"
     }
   ],
-  "version": "1.0.5",
+  "version": "1.0.6-beta.dc7ed9db",
   "description": "Frak Wallet components, helping any person to interact with the Frak wallet.",
   "repository": {
     "url": "https://github.com/frak-id/wallet",
@@ -86,8 +86,8 @@
     "publish": "echo 'Publishing components...'"
   },
   "dependencies": {
-    "@frak-labs/core-sdk": "1.1.0",
-    "@frak-labs/frame-connector": "0.2.0",
+    "@frak-labs/core-sdk": "1.1.1-beta.dc7ed9db",
+    "@frak-labs/frame-connector": "0.2.0-beta.dc7ed9db",
     "preact": "^10.29.0",
     "preact-custom-element": "^4.6.0",
     "@frak-labs/design-system": "0.0.0"

package/cdn/Banner.CIxY6tCU.js

@@ -1,178 +0,0 @@
-import{T as e,b as t,c as n,d as r,u as i,v as a}from"./loader.js";import{a as o,c as s,d as c,i as l,l as u,o as d,s as f,t as ee,u as p}from"./usePlacement.BgMXY5CX.js";import{a as m,i as h,n as g,r as te,t as _}from"./GiftIcon.eRNTGQ_r.js";import{t as v}from"./useGlobalComponents.TG9kIYSc.js";import{t as ne}from"./useLightDomStyles.tjNBKcOr.js";import{t as re}from"./useReward.B530suzR.js";var y=`inAppBanner_body__1ibpiy75`,b=`inAppBanner_closeButton__1ibpiy78`,x=`inAppBanner_container__1ibpiy71`,S=`inAppBanner_cta__1ibpiy77`,C=`inAppBanner_description__1ibpiy76`,w=`inAppBanner_header__1ibpiy72`,T=`inAppBanner_iconWrapper__1ibpiy73`,E=`inAppBanner_title__1ibpiy74`;function D({title:e,description:t,cta:n,dismissLabel:r,onAction:i,onDismiss:a,className:o,classNames:s}){return p(`div`,{className:`${x}${o?` ${o}`:``}`,role:`alert`,children:[p(`div`,{className:w,children:[p(`span`,{className:`${T}${s?.icon?` ${s.icon}`:``}`,children:p(g,{width:20,height:20})}),p(`p`,{className:`${E}${s?.title?` ${s.title}`:``}`,children:e})]}),p(`div`,{className:y,children:[p(`p`,{className:`${C}${s?.description?` ${s.description}`:``}`,children:t}),p(`button`,{type:`button`,className:`${S}${s?.cta?` ${s.cta}`:``}`,onClick:i,children:[n,p(h,{width:14,height:14})]})]}),p(`button`,{type:`button`,className:`${b}${s?.close?` ${s.close}`:``}`,onClick:a,"aria-label":r,children:p(m,{width:16,height:16})})]})}var O=`Banner_frakLogo__1gnumzia`,k=`Banner_iconSvg__1gnumzi2`,A=`Banner_referral__1gnumzi3 reset_base__1831jhd0 Banner_rootBase__1gnumzi1`,j=`Banner_referralBody__1gnumzi6`,M=`Banner_referralCta__1gnumzi9 sharedBaseCss_buttonReset__7cswil0`,ie=`Banner_referralDescription__1gnumzi8 reset_base__1831jhd0`,ae=`Banner_referralIconWrapper__1gnumzi4`,N=`Banner_referralImage__1gnumzi5`,P=`Banner_referralTitle__1gnumzi7 reset_base__1831jhd0`;function F({placement:c,classname:m=``,interaction:h,referralTitle:g,referralDescription:y,referralCta:b,inappTitle:x,inappDescription:S,inappCta:C,imageUrl:w,preview:T,previewMode:E,allowInappRedirect:F}){let I=!!T,L=E===`inapp`?`inapp`:`referral`,R=F===!0||F===`true`,z=ee(c),{shouldRender:B,isHidden:V,isClientReady:H}=l();ne(`frak-banner`,c,z?.components?.banner?.css,`@keyframes inAppBanner_fadeIn__1ibpiy70 {
-  from {
-    opacity: 0;
-    transform: translateY(-4px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-.inAppBanner_container__1ibpiy71 {
-  position: fixed;
-  top: max(8px, env(safe-area-inset-top));
-  left: 16px;
-  right: 16px;
-  z-index: 1000;
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  padding: 12px 16px;
-  padding-right: 32px;
-  border-radius: 12px;
-  background-color: #000000CC;
-  backdrop-filter: blur(12px);
-  -webkit-backdrop-filter: blur(12px);
-  color: #ffffff;
-  animation: inAppBanner_fadeIn__1ibpiy70 300ms ease-out;
-}
-.inAppBanner_header__1ibpiy72 {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-.inAppBanner_iconWrapper__1ibpiy73 {
-  flex-shrink: 0;
-  width: 20px;
-  height: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: #ffffff;
-}
-.inAppBanner_title__1ibpiy74 {
-  margin: 0;
-  padding: 0;
-  font-size: 16px;
-  font-weight: 500;
-  line-height: 26px;
-  color: var(--text-onAction__pbq4ak6);
-}
-.inAppBanner_body__1ibpiy75 {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: baseline;
-  gap: 0 4px;
-}
-.inAppBanner_description__1ibpiy76 {
-  margin: 0;
-  padding: 0;
-  font-size: 14px;
-  color: var(--text-onAction__pbq4ak6);
-  line-height: 22px;
-  opacity: 0.96;
-}
-.inAppBanner_cta__1ibpiy77 {
-  all: unset;
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  color: #2BB2FF;
-  font-size: 14px;
-  font-weight: 600;
-  text-decoration: underline;
-  text-underline-offset: 2px;
-  cursor: pointer;
-}
-.inAppBanner_cta__1ibpiy77:focus-visible {
-  outline: 2px solid #2BB2FF;
-  outline-offset: 2px;
-  border-radius: 4px;
-}
-.inAppBanner_closeButton__1ibpiy78 {
-  all: unset;
-  position: absolute;
-  top: 8px;
-  right: 8px;
-  width: 28px;
-  height: 28px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 9999px;
-  color: rgba(255, 255, 255, 0.6);
-  cursor: pointer;
-}
-.inAppBanner_closeButton__1ibpiy78:focus-visible {
-  outline: 2px solid #ffffff;
-  outline-offset: 2px;
-}@keyframes Banner_fadeIn__1gnumzi0 {
-  from {
-    opacity: 0;
-    transform: translateY(-4px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-.Banner_rootBase__1gnumzi1 {
-  position: relative;
-  display: flex;
-  animation: Banner_fadeIn__1gnumzi0 300ms ease-out;
-}
-.Banner_iconSvg__1gnumzi2 {
-  width: 100%;
-  height: 100%;
-}
-.Banner_referral__1gnumzi3 {
-  flex-direction: row;
-  align-items: center;
-  gap: 16px;
-  padding: 16px;
-  background-color: #ffffff;
-  color: var(--text-primary__pbq4ak0);
-  border: 1px solid var(--border-default__pbq4akv);
-  border-radius: 12px;
-}
-.Banner_referralIconWrapper__1gnumzi4 {
-  flex-shrink: 0;
-  align-self: flex-start;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 40px;
-  height: 40px;
-  overflow: hidden;
-}
-.Banner_referralImage__1gnumzi5 {
-  max-width: 100%;
-  max-height: 100%;
-  width: auto;
-  height: auto;
-  object-fit: contain;
-  display: block;
-}
-.Banner_referralBody__1gnumzi6 {
-  flex: 1;
-  min-width: 0;
-}
-.Banner_referralTitle__1gnumzi7 {
-  font-size: 16px;
-  font-weight: 600;
-  color: var(--text-primary__pbq4ak0);
-  line-height: 22px;
-}
-.Banner_referralDescription__1gnumzi8 {
-  margin-bottom: 8px;
-  font-size: 14px;
-  color: #979797;
-  line-height: 22px;
-}
-.Banner_referralCta__1gnumzi9 {
-  display: inline-block;
-  padding: 8px 16px;
-  border: 1px solid #000000;
-  border-radius: 9999px;
-  color: var(--text-primary__pbq4ak0);
-  font-size: 10px;
-  font-weight: 700;
-  line-height: 12px;
-  text-transform: uppercase;
-}
-.Banner_frakLogo__1gnumzia {
-  position: absolute;
-  right: 16px;
-  bottom: 12px;
-  pointer-events: none;
-}`,e);let[U,W]=f(!1),[G,K]=f(()=>I?L:R&&a?`inapp`:null),q=o(null);u(()=>{I&&K(L)},[I,L]);let{reward:J}=re(G===`referral`&&H,h),[Y,X]=f(null);u(()=>{let e=window.FrakSetup?.client;G!==`inapp`||I||!H||!e||n(e).then(e=>X(e)).catch(()=>{})},[G,I,H]),u(()=>{I||!G||U||q.current!==G&&H&&(t(window.FrakSetup?.client,`banner_impression`,{placement:c,variant:G,has_reward:G===`referral`?!!J:void 0}),q.current=G)},[G,U,H,I,c]),u(()=>{if(I||G===`inapp`)return;let e=()=>K(`referral`);return window.addEventListener(i,e),()=>window.removeEventListener(i,e)},[I,G]);let Z=s(async()=>{if(I)return;if(t(window.FrakSetup?.client,`banner_resolved`,{placement:c,variant:G??`referral`,outcome:`clicked`}),G===`referral`){W(!0);return}let e=Y;if(!e&&window.FrakSetup?.client)try{e=await n(window.FrakSetup?.client)}catch{}let i=window.location.href;if(e){let t=new URL(i);t.searchParams.set(`fmt`,e),i=t.toString()}r(i)},[I,G,Y,c]),oe=s(()=>{I||(t(window.FrakSetup?.client,`banner_resolved`,{placement:c,variant:G??`referral`,outcome:`dismissed`}),W(!0))},[I,G,c]),se=v(),Q=z?.components?.banner??se?.banner,$=d(()=>{if(G===`referral`){let e=J?`Earn ${J} on purchases on this site`:`You've been referred!`;return{title:g??Q?.referralTitle??e,description:y??Q?.referralDescription??`Earn rewards after your purchase via the Frak partner app.`,cta:b??Q?.referralCta??`Got it`}}return{title:x??Q?.inappTitle??`Open in your browser`,description:S??Q?.inappDescription??`For a better experience and to earn your rewards, open this page in your default browser.`,cta:C??Q?.inappCta??`Open browser`}},[G,J,Q,g,y,b,x,S,C]);if(!G||!I&&(!B||V||U))return null;let ce=[A,`frak-banner`,`frak-banner--${G}`,m].filter(Boolean).join(` `);return G===`inapp`?p(D,{title:$.title,description:$.description,cta:$.cta,dismissLabel:`Dismiss`,onAction:Z,onDismiss:oe,className:[`frak-banner`,`frak-banner--inapp`,m].filter(Boolean).join(` `),classNames:{icon:`frak-banner__icon`,title:`frak-banner__title`,description:`frak-banner__description`,cta:`frak-banner__cta`,close:`frak-banner__close`}}):p(`div`,{class:ce,role:`alert`,children:[p(`div`,{class:`${ae} frak-banner__icon`,children:w?p(`img`,{src:w,alt:``,class:N}):p(_,{class:k})}),p(`div`,{class:`${j} frak-banner__text`,children:[p(`p`,{class:`${P} frak-banner__title`,children:$.title}),p(`p`,{class:`${ie} frak-banner__description`,children:$.description}),p(`button`,{type:`button`,class:`${M} frak-banner__cta`,onClick:Z,children:$.cta})]}),p(te,{class:`${O} frak-banner__logo`,width:42,height:24})]})}c(F,`frak-banner`,[`placement`,`classname`,`interaction`,`referralTitle`,`referralDescription`,`referralCta`,`inappTitle`,`inappDescription`,`inappCta`,`preview`,`previewMode`,`imageUrl`,`allowInappRedirect`],{shadow:!1});export{F as Banner};

package/cdn/ButtonShare.elMtdxF3.js

@@ -1 +0,0 @@
-import{b as e,i as t}from"./loader.js";import{c as n,d as r,i,o as a,t as o,u as s}from"./usePlacement.BgMXY5CX.js";import{t as c}from"./useGlobalComponents.TG9kIYSc.js";import{t as l}from"./useLightDomStyles.tjNBKcOr.js";import{t as u}from"./formatReward.B1ZyoceC.js";import{t as d}from"./useReward.B530suzR.js";import{t as f}from"./sharingPage.BYsqcN9O.js";function p({placement:r,text:p=`Share and earn!`,classname:m=``,useReward:h,noRewardText:g,targetInteraction:_,clickAction:v,preview:y}){let b=!!y,x=o(r),S=c(),C=x?.components?.buttonShare??S?.buttonShare;l(`frak-button-share`,r,C?.css);let w=a(()=>x?.targetInteraction===void 0?_:x.targetInteraction,[x?.targetInteraction,_]),T=C?.text??p,E=C?.noRewardText??g,D=a(()=>C?.useReward??h===!0,[C?.useReward,h]),O=a(()=>C?.clickAction??v??`sharing-page`,[C?.clickAction,v]),{shouldRender:k,isHidden:A,isClientReady:j}=i(),{reward:M}=d(D&&j,w),N=a(()=>D?M?T.includes(`{REWARD}`)?u(T,M):`${T} ${M}`:E??u(T,void 0):T,[D,T,E,M]),P=n(()=>{if(!b){if(e(window.FrakSetup.client,`share_button_clicked`,{placement:r,target_interaction:w,has_reward:!!M,click_action:O}),O===`embedded-wallet`){t(w,r);return}f(w,r)}},[b,O,w,r,M]);if(!b&&(!k||A))return null;let F=[`button`,`button__fadeIn`,m].filter(Boolean).join(` `);return s(`button`,{type:`button`,disabled:!b&&!j,class:F,onClick:P,children:N})}r(p,`frak-button-share`,[`text`,`placement`,`classname`,`clickAction`,`useReward`,`noRewardText`,`targetInteraction`,`preview`],{shadow:!1});export{p as ButtonShare};

package/cdn/ButtonWallet.BUUPX0gO.js

@@ -1,40 +0,0 @@
-import{r as e}from"./loader.js";import{d as t,i as n,l as r,m as i,n as a,o,s,t as c,u as l}from"./usePlacement.BgMXY5CX.js";import{t as u}from"./useReward.B530suzR.js";function d(e){return l(`svg`,{fill:`none`,height:`1em`,viewBox:`0 0 28 28`,width:`1em`,xmlns:`http://www.w3.org/2000/svg`,...e,children:[l(`title`,{children:`Gift icon`}),l(`path`,{d:`m23.1427 13.9999v11.4285h-18.2857v-11.4285m9.1429 11.4285v-17.14282m0 0h-5.1429c-.75776 0-1.48448-.30102-2.0203-.83684s-.83684-1.26255-.83684-2.02031.30102-1.48448.83684-2.0203 1.26254-.83684 2.0203-.83684c4 0 5.1429 5.71429 5.1429 5.71429zm0 0h5.1428c.7578 0 1.4845-.30102 2.0203-.83684s.8369-1.26255.8369-2.02031-.3011-1.48448-.8369-2.0203-1.2625-.83684-2.0203-.83684c-4 0-5.1428 5.71429-5.1428 5.71429zm-11.42861 0h22.85711v5.71432h-22.85711z`,stroke:`#fff`,"stroke-linecap":`round`,"stroke-linejoin":`round`})]})}function f({placement:t,classname:f=``,useReward:p,targetInteraction:m}){let h=c(t),g=o(()=>h?.targetInteraction===void 0?m:h.targetInteraction,[h?.targetInteraction,m]),_=o(()=>p===!0,[p]),{shouldRender:v,isHidden:y,isClientReady:b}=n(),{reward:x}=u(_&&b,g),[S,C]=s(`right`);if(r(()=>{let e=h?.components?.buttonWallet?.position,t=window.FrakSetup?.modalWalletConfig?.metadata?.position;C(e??t??`right`)},[h?.components?.buttonWallet?.position]),!v||y)return null;let w=[`button`,`button__fadeIn`,S===`left`?`button__left`:`button__right`,f].filter(Boolean).join(` `);return l(i,{children:[l(`style`,{children:a(`
-.button {
-    all: unset;
-    position: fixed;
-    bottom: 20px;
-    z-index: 2000000;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background-color: #3e557e;
-    width: 45px;
-    height: 45px;
-    border-radius: 50%;
-    cursor: pointer;
-    text-align: center;
-    font-size: 24px;
-}
-
-.button__left {
-    left: 20px;
-}
-
-.button__right {
-    right: 20px;
-}
-
-.reward {
-    position: absolute;
-    top: -4px;
-    right: 27px;
-    padding: 2px 3px;
-    border-radius: 5px;
-    background: #ff3f3f;
-    font-size: 9px;
-    color: #fff;
-    font-weight: 600;
-    white-space: nowrap;
-    line-height: 9px;
-}
-`,h?.components?.buttonWallet?.css)}),l(`button`,{type:`button`,"aria-label":`Open wallet`,part:`button`,disabled:!b,class:w,onClick:()=>{e(g,t)},children:[l(d,{}),x&&l(`span`,{class:`reward`,children:x})]})]})}t(f,`frak-button-wallet`,[`placement`,`classname`,`useReward`,`targetInteraction`],{shadow:!0});export{f as ButtonWallet};