@apps-in-toss/framework 1.9.4 → 1.10.0

package/dist/index.js

@@ -2717,7 +2717,7 @@ function WebView({ type, local, onMessage, ...props }) {
       memoryDebugLog: webViewMemoryDebugLog,
       debugLog: async (event) => {
         NativeModules3.AppsInTossModule?.eventLog(event);
-        NativeModules3.TossCoreModule?.eventLog(event);
+        NativeModules3.TossCoreModule?.eventLog({ params: event });
       }
     }
   });
@@ -2816,6 +2816,1265 @@ export * from "@apps-in-toss/analytics";
 import { useOverlay as useOverlay3, OverlayProvider } from "@toss/tds-react-native/private";
 export * from "@apps-in-toss/native-modules";
 export * from "@apps-in-toss/types";
+
+// src/ads/inlineAd/InlineAd.tsx
+import { ImpressionArea, useVisibilityChange as useVisibilityChange2 } from "@granite-js/react-native";
+import { useEffect as useEffect14, useRef as useRef9, useState as useState7 } from "react";
+import { StyleSheet as StyleSheet3, View as View7, useColorScheme } from "react-native";
+
+// src/ads/inlineAd/constants.ts
+var SDK_ID = "106";
+var LIST_BANNER_STYLE_ID = "1";
+var NATIVE_IMAGE_STYLE_ID = "2";
+var FEED_BANNER_STYLE_ID = NATIVE_IMAGE_STYLE_ID;
+var AVAILABLE_STYLE_IDS = [LIST_BANNER_STYLE_ID, NATIVE_IMAGE_STYLE_ID];
+var DEFAULT_INLINE_AD_THEME = "auto";
+var DEFAULT_INLINE_AD_TONE = "blackAndWhite";
+var DEFAULT_INLINE_AD_VARIANT = "expanded";
+var DEFAULT_INLINE_AD_PADDING_BANNER = "16px 20px";
+var DEFAULT_INLINE_AD_PADDING_NATIVE_IMAGE = "20px";
+var ERROR_CODES = {
+  NETWORK_ERROR: 1001,
+  INVALID_REQUEST: 1002,
+  NO_AD: 1003,
+  ERROR: 1004,
+  INVALID_SPACE: 1005,
+  SDK_NOT_INITIALIZED: 1007,
+  HTTP_TIMEOUT: 1008,
+  EXECUTION_FAIL: 1009,
+  INTERRUPTED: 1010,
+  FAIL: 1011,
+  BLOCKED: 1012,
+  TIMEOUT: 1013,
+  LIMITED_AD: 1014,
+  CONSENT_REQUIRED: 1015,
+  TEST_MODE: 1016,
+  INTERNAL_ERROR: 1017
+};
+var ERROR_MESSAGES = {
+  [ERROR_CODES.NETWORK_ERROR]: "Network error occurred",
+  [ERROR_CODES.INVALID_REQUEST]: "Invalid request parameters",
+  [ERROR_CODES.NO_AD]: "No ads available",
+  [ERROR_CODES.ERROR]: "Server error occurred",
+  [ERROR_CODES.INVALID_SPACE]: "Invalid or disabled inventory",
+  [ERROR_CODES.SDK_NOT_INITIALIZED]: "SDK is not initialized",
+  [ERROR_CODES.HTTP_TIMEOUT]: "Request timed out",
+  [ERROR_CODES.EXECUTION_FAIL]: "Request execution failed",
+  [ERROR_CODES.INTERRUPTED]: "Request interrupted",
+  [ERROR_CODES.FAIL]: "Request failed",
+  [ERROR_CODES.BLOCKED]: "Ad blocked by policy",
+  [ERROR_CODES.TIMEOUT]: "SSP processing timed out",
+  [ERROR_CODES.LIMITED_AD]: "Ad limited by privacy",
+  [ERROR_CODES.CONSENT_REQUIRED]: "Consent required to show ads",
+  [ERROR_CODES.TEST_MODE]: "Test mode only",
+  [ERROR_CODES.INTERNAL_ERROR]: "Unknown error occurred"
+};
+var API_RESULT_ERROR_MAP = {
+  HTTP_TIMEOUT: {
+    code: ERROR_CODES.HTTP_TIMEOUT,
+    message: ERROR_MESSAGES[ERROR_CODES.HTTP_TIMEOUT]
+  },
+  NETWORK_ERROR: {
+    code: ERROR_CODES.NETWORK_ERROR,
+    message: ERROR_MESSAGES[ERROR_CODES.NETWORK_ERROR]
+  },
+  EXECUTION_FAIL: {
+    code: ERROR_CODES.EXECUTION_FAIL,
+    message: ERROR_MESSAGES[ERROR_CODES.EXECUTION_FAIL]
+  },
+  INTERRUPTED: {
+    code: ERROR_CODES.INTERRUPTED,
+    message: ERROR_MESSAGES[ERROR_CODES.INTERRUPTED]
+  },
+  INTERNAL_ERROR: {
+    code: ERROR_CODES.ERROR,
+    message: ERROR_MESSAGES[ERROR_CODES.ERROR]
+  },
+  FAIL: {
+    code: ERROR_CODES.FAIL,
+    message: ERROR_MESSAGES[ERROR_CODES.FAIL]
+  }
+};
+var AD_STATUS_ERROR_MAP = {
+  NO_AD: {
+    code: ERROR_CODES.NO_AD,
+    message: ERROR_MESSAGES[ERROR_CODES.NO_AD]
+  },
+  BLOCKED: {
+    code: ERROR_CODES.BLOCKED,
+    message: ERROR_MESSAGES[ERROR_CODES.BLOCKED]
+  },
+  ERROR: {
+    code: ERROR_CODES.ERROR,
+    message: ERROR_MESSAGES[ERROR_CODES.ERROR]
+  },
+  TIMEOUT: {
+    code: ERROR_CODES.TIMEOUT,
+    message: ERROR_MESSAGES[ERROR_CODES.TIMEOUT]
+  },
+  INVALID_SPACE: {
+    code: ERROR_CODES.INVALID_SPACE,
+    message: ERROR_MESSAGES[ERROR_CODES.INVALID_SPACE]
+  },
+  INVALID_REQUEST: {
+    code: ERROR_CODES.INVALID_REQUEST,
+    message: ERROR_MESSAGES[ERROR_CODES.INVALID_REQUEST]
+  },
+  LIMITED_AD: {
+    code: ERROR_CODES.LIMITED_AD,
+    message: ERROR_MESSAGES[ERROR_CODES.LIMITED_AD]
+  },
+  CONSENT_REQUIRED: {
+    code: ERROR_CODES.CONSENT_REQUIRED,
+    message: ERROR_MESSAGES[ERROR_CODES.CONSENT_REQUIRED]
+  },
+  TEST_MODE: {
+    code: ERROR_CODES.TEST_MODE,
+    message: ERROR_MESSAGES[ERROR_CODES.TEST_MODE]
+  }
+};
+
+// src/ads/inlineAd/loadAd.ts
+function createError(code, message) {
+  return {
+    code,
+    message: message || ERROR_MESSAGES[code] || "Unknown error",
+    domain: "@apps-in-toss/framework"
+  };
+}
+function isAdError(error) {
+  return Boolean(
+    error && typeof error === "object" && "code" in error && typeof error.code === "number" && "message" in error && typeof error.message === "string"
+  );
+}
+function fetchTossAdPromise(options) {
+  return new Promise((resolve, reject) => {
+    if (!fetchTossAd.isSupported()) {
+      reject(new Error("fetchTossAd is not supported in this environment."));
+      return;
+    }
+    fetchTossAd({
+      options,
+      onEvent: resolve,
+      onError: reject
+    });
+  });
+}
+function isApiResponse(payload) {
+  return Boolean(payload && typeof payload === "object" && "resultType" in payload);
+}
+function isAdResponse(payload) {
+  return Boolean(payload && typeof payload === "object" && "ads" in payload);
+}
+function normalizeAdResponse(adResponse) {
+  const ads = Array.isArray(adResponse.ads) ? adResponse.ads.map((ad) => ({
+    ...ad,
+    requestId: ad.requestId ?? adResponse.requestId
+  })).filter((ad) => AVAILABLE_STYLE_IDS.includes(String(ad.styleId))) : [];
+  return {
+    requestId: adResponse.requestId ?? "",
+    status: adResponse.status ?? "OK",
+    ads,
+    ext: adResponse.ext
+  };
+}
+function normalizeApiResponse(raw) {
+  if (isApiResponse(raw)) {
+    if (raw.resultType !== "SUCCESS") {
+      return raw;
+    }
+    if (!raw.success) {
+      return {
+        resultType: "FAIL",
+        error: { reason: "fetchTossAd returned SUCCESS without payload" }
+      };
+    }
+    return { ...raw, success: normalizeAdResponse(raw.success) };
+  }
+  if (isAdResponse(raw)) {
+    return {
+      resultType: "SUCCESS",
+      success: normalizeAdResponse(raw)
+    };
+  }
+  return {
+    resultType: "FAIL",
+    error: { reason: "Invalid response from fetchTossAd" }
+  };
+}
+function isStructurallyValidAd(ad) {
+  return Boolean(ad && ad.creative && typeof ad.creative === "object");
+}
+async function loadAd(adGroupId) {
+  if (!adGroupId) {
+    return {
+      type: "error",
+      error: createError(ERROR_CODES.INVALID_SPACE, "Invalid adGroupId - adGroupId must be provided")
+    };
+  }
+  if (!fetchTossAd.isSupported()) {
+    return {
+      type: "error",
+      error: createError(ERROR_CODES.SDK_NOT_INITIALIZED, "This feature is not supported in the current environment")
+    };
+  }
+  let response;
+  try {
+    const raw = await fetchTossAdPromise({
+      adGroupId,
+      sdkId: SDK_ID,
+      availableStyleIds: AVAILABLE_STYLE_IDS
+    });
+    response = normalizeApiResponse(raw);
+  } catch (error) {
+    if (isAdError(error)) {
+      return { type: "error", error };
+    }
+    const message = error instanceof Error ? error.message : "Network error";
+    return {
+      type: "error",
+      error: createError(ERROR_CODES.NETWORK_ERROR, message)
+    };
+  }
+  if (response.resultType !== "SUCCESS") {
+    const mappedError = API_RESULT_ERROR_MAP[response.resultType];
+    const errorMessage = response.error?.reason ?? mappedError?.message ?? ERROR_MESSAGES[ERROR_CODES.INTERNAL_ERROR];
+    const errorCode = mappedError?.code ?? ERROR_CODES.INTERNAL_ERROR;
+    return {
+      type: "error",
+      error: createError(errorCode, errorMessage)
+    };
+  }
+  if (!response.success) {
+    return {
+      type: "error",
+      error: createError(ERROR_CODES.INTERNAL_ERROR, "Missing ad response payload")
+    };
+  }
+  const adResponse = response.success;
+  if (adResponse.status !== "OK" && adResponse.status !== "TEST_MODE") {
+    const statusError = AD_STATUS_ERROR_MAP[adResponse.status];
+    const errorMessage = statusError?.message ?? `Ad response status: ${adResponse.status}`;
+    const errorCode = statusError?.code ?? ERROR_CODES.INTERNAL_ERROR;
+    const error = createError(errorCode, errorMessage);
+    if (error.code === ERROR_CODES.NO_AD) {
+      return { type: "noFill", error, response: adResponse };
+    }
+    return { type: "error", error, response: adResponse };
+  }
+  const topPriorityAd = adResponse.ads[0];
+  const selectedAd = isStructurallyValidAd(topPriorityAd) ? topPriorityAd : adResponse.ads.find(isStructurallyValidAd) ?? null;
+  if (!selectedAd) {
+    return {
+      type: "error",
+      error: createError(ERROR_CODES.INTERNAL_ERROR, "Unsupported styleId in response"),
+      response: adResponse
+    };
+  }
+  return {
+    type: "success",
+    ad: selectedAd,
+    responseExt: adResponse.ext ?? null,
+    requestId: adResponse.requestId,
+    response: adResponse
+  };
+}
+
+// src/ads/inlineAd/opener.ts
+import { openURL as openURL6 } from "@granite-js/react-native";
+function isSafeUrl(url) {
+  try {
+    const parsed = new URL(url);
+    const dangerous = [
+      "javascript:",
+      "data:",
+      "vbscript:",
+      "file:",
+      "about:",
+      "blob:",
+      "filesystem:",
+      "chrome:",
+      "chrome-extension:",
+      "ftp:",
+      "ftps:",
+      "sftp:",
+      "telnet:",
+      "ssh:",
+      "intent:"
+    ];
+    return !dangerous.includes(parsed.protocol.toLowerCase());
+  } catch {
+    return false;
+  }
+}
+function openLandingUrl(url) {
+  if (!isSafeUrl(url)) {
+    console.warn("[InlineAd] Blocked unsafe landing URL:", url);
+    return;
+  }
+  try {
+    openURL6(getWebSchemeOrUri(url));
+  } catch (error) {
+    console.error("[InlineAd] Failed to open landing URL:", error);
+  }
+}
+function getWebSchemeOrUri(uri) {
+  const isHttp = ["http://", "https://"].some((protocol) => uri.startsWith(protocol));
+  return isHttp ? supertossWeb(uri) : uri;
+}
+function supertossWeb(uri) {
+  return `supertoss://web?url=${encodeURIComponent(uri)}&external=true`;
+}
+
+// src/ads/inlineAd/tracking.ts
+var GlobalEventDeduplicator = class _GlobalEventDeduplicator {
+  static MAX_EVENTS = 1e4;
+  trackedEvents = /* @__PURE__ */ new Set();
+  hasTracked(requestId, creativeId, eventType) {
+    return this.trackedEvents.has(this.buildKey(requestId, creativeId, eventType));
+  }
+  markTracked(requestId, creativeId, eventType) {
+    if (this.trackedEvents.size >= _GlobalEventDeduplicator.MAX_EVENTS) {
+      const firstKey = this.trackedEvents.keys().next().value;
+      if (firstKey) {
+        this.trackedEvents.delete(firstKey);
+      }
+    }
+    this.trackedEvents.add(this.buildKey(requestId, creativeId, eventType));
+  }
+  buildKey(requestId, creativeId, eventType) {
+    return `${requestId}:${creativeId}:${eventType}`;
+  }
+};
+var globalEventDeduplicator = new GlobalEventDeduplicator();
+var EventTracker = class {
+  constructor(eventTrackingUrls = [], eventTypes = [], eventPayload = "", requestId, creativeId, requestHeaders) {
+    this.eventTrackingUrls = eventTrackingUrls;
+    this.eventPayload = eventPayload;
+    this.requestId = requestId;
+    this.creativeId = creativeId;
+    this.requestHeaders = requestHeaders;
+    this.eventTypes = new Set(eventTypes);
+    this.repeatableEvents = /* @__PURE__ */ new Set(["VIEW_MUTE", "VIEW_UNMUTE"]);
+  }
+  eventTypes;
+  repeatableEvents;
+  async track(eventType) {
+    if (!this.eventTypes.has(eventType)) {
+      return;
+    }
+    if (!this.repeatableEvents.has(eventType)) {
+      if (this.requestId && this.creativeId) {
+        if (globalEventDeduplicator.hasTracked(this.requestId, this.creativeId, eventType)) {
+          return;
+        }
+      }
+    }
+    if (this.eventTrackingUrls.length === 0) {
+      return;
+    }
+    const payload = {
+      type: eventType,
+      data: this.eventPayload
+    };
+    await Promise.allSettled(this.eventTrackingUrls.map((url) => this.sendTrackingRequest(url, payload)));
+    if (!this.repeatableEvents.has(eventType) && this.requestId && this.creativeId) {
+      globalEventDeduplicator.markTracked(this.requestId, this.creativeId, eventType);
+    }
+  }
+  async sendTrackingRequest(url, payload) {
+    const headers = {
+      "Content-Type": "application/json",
+      ...this.requestHeaders ?? {}
+    };
+    if (this.requestId) {
+      headers["X-Toss-RequestId"] = this.requestId;
+    }
+    await fetch(url, {
+      method: "POST",
+      headers,
+      body: JSON.stringify(payload)
+    });
+  }
+};
+
+// src/ads/inlineAd/ui/FeedBannerAdView.tsx
+import { Path, Svg } from "@granite-js/native/react-native-svg";
+import { useRef as useRef7 } from "react";
+import {
+  Animated,
+  Easing,
+  Image,
+  Pressable as Pressable2,
+  StyleSheet,
+  Text,
+  View as View5
+} from "react-native";
+import { jsx as jsx20, jsxs as jsxs9 } from "react/jsx-runtime";
+var ARROW_PATH = "m7.5 20.4c-.5-.5-.5-1.2 0-1.7l6.7-6.7-6.8-6.7c-.5-.5-.5-1.2 0-1.7s1.2-.5 1.7 0l7.5 7.5c.5.5.5 1.2 0 1.7l-7.5 7.5c-.2.3-.5.4-.8.4s-.6-.1-.8-.3z";
+function FeedBannerAdView({
+  brandName,
+  brandLogoUri,
+  title,
+  subtitle,
+  mainImageUri,
+  ctaText,
+  ctaTextColor,
+  ctaBackgroundColor,
+  adClearanceText,
+  colors,
+  isAdBadgeEnabled,
+  paddingStyle,
+  onPress
+}) {
+  const scale = useRef7(new Animated.Value(1)).current;
+  const animateScale = (toValue) => {
+    Animated.timing(scale, {
+      toValue,
+      duration: 100,
+      easing: Easing.inOut(Easing.ease),
+      useNativeDriver: true
+    }).start();
+  };
+  const handlePressIn = () => {
+    animateScale(0.98);
+  };
+  const handlePressOut = () => {
+    animateScale(1);
+  };
+  const resolvedCtaBackground = ctaBackgroundColor ?? "#3081F9";
+  const resolvedCtaTextColor = ctaTextColor ?? "#ffffff";
+  return /* @__PURE__ */ jsx20(
+    Pressable2,
+    {
+      accessibilityRole: "button",
+      onPress: () => onPress(null),
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
+      style: styles.pressable,
+      children: /* @__PURE__ */ jsxs9(Animated.View, { style: [styles.container, paddingStyle, { transform: [{ scale }] }], children: [
+        /* @__PURE__ */ jsxs9(View5, { style: styles.profileContainer, children: [
+          /* @__PURE__ */ jsxs9(View5, { style: styles.brandArea, children: [
+            /* @__PURE__ */ jsx20(
+              Pressable2,
+              {
+                accessibilityRole: "button",
+                onPress: () => onPress("202"),
+                onPressIn: handlePressIn,
+                onPressOut: handlePressOut,
+                style: styles.logoContainer,
+                children: /* @__PURE__ */ jsxs9(View5, { style: [styles.logoWrapper, { backgroundColor: colors.brandLogoBg }], children: [
+                  brandLogoUri ? /* @__PURE__ */ jsx20(Image, { source: { uri: brandLogoUri }, style: styles.logoImage, resizeMode: "cover" }) : null,
+                  /* @__PURE__ */ jsx20(View5, { style: [styles.logoOverlay, { borderColor: colors.brandLogoBorder }] })
+                ] })
+              }
+            ),
+            /* @__PURE__ */ jsxs9(View5, { style: styles.brandTextContainer, children: [
+              /* @__PURE__ */ jsx20(
+                Pressable2,
+                {
+                  accessibilityRole: "button",
+                  onPress: () => onPress("103"),
+                  onPressIn: handlePressIn,
+                  onPressOut: handlePressOut,
+                  children: /* @__PURE__ */ jsx20(Text, { numberOfLines: 1, style: [styles.brandName, { color: colors.brandName }], children: brandName })
+                }
+              ),
+              isAdBadgeEnabled ? /* @__PURE__ */ jsx20(Text, { numberOfLines: 1, style: [styles.adBadge, { color: colors.adBadge }], children: "\uAD11\uACE0" }) : null
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs9(View5, { style: styles.textArea, children: [
+            /* @__PURE__ */ jsx20(
+              Pressable2,
+              {
+                accessibilityRole: "button",
+                onPress: () => onPress("101"),
+                onPressIn: handlePressIn,
+                onPressOut: handlePressOut,
+                children: /* @__PURE__ */ jsx20(Text, { style: [styles.title, { color: colors.title }], children: title })
+              }
+            ),
+            /* @__PURE__ */ jsx20(
+              Pressable2,
+              {
+                accessibilityRole: "button",
+                onPress: () => onPress("102"),
+                onPressIn: handlePressIn,
+                onPressOut: handlePressOut,
+                children: /* @__PURE__ */ jsx20(Text, { style: [styles.subtitle, { color: colors.subtitle }], children: subtitle })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs9(View5, { style: styles.card, children: [
+          /* @__PURE__ */ jsx20(
+            Pressable2,
+            {
+              accessibilityRole: "button",
+              onPress: () => onPress("201"),
+              onPressIn: handlePressIn,
+              onPressOut: handlePressOut,
+              style: styles.imageButton,
+              children: /* @__PURE__ */ jsx20(View5, { style: styles.imageContainer, children: mainImageUri ? /* @__PURE__ */ jsx20(Image, { source: { uri: mainImageUri }, style: styles.mainImage, resizeMode: "cover" }) : null })
+            }
+          ),
+          /* @__PURE__ */ jsxs9(
+            Pressable2,
+            {
+              accessibilityRole: "button",
+              onPress: () => onPress("0"),
+              onPressIn: handlePressIn,
+              onPressOut: handlePressOut,
+              style: [styles.cta, { backgroundColor: resolvedCtaBackground }],
+              children: [
+                /* @__PURE__ */ jsx20(Text, { style: [styles.ctaText, { color: resolvedCtaTextColor }], children: ctaText }),
+                /* @__PURE__ */ jsx20(Svg, { width: 20, height: 20, viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx20(Path, { d: ARROW_PATH, fill: resolvedCtaTextColor }) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx20(View5, { style: [styles.cardOverlay, { borderColor: colors.imageOverlayBorder }] })
+        ] }),
+        adClearanceText ? /* @__PURE__ */ jsx20(Text, { style: [styles.adClearance, { color: colors.adClearance }], children: adClearanceText }) : null
+      ] })
+    }
+  );
+}
+var styles = StyleSheet.create({
+  pressable: {
+    width: "100%"
+  },
+  container: {
+    flexDirection: "column",
+    padding: 0,
+    width: "100%"
+  },
+  profileContainer: {
+    flexDirection: "column",
+    paddingBottom: 8,
+    gap: 12
+  },
+  brandArea: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 8
+  },
+  logoContainer: {
+    width: 40,
+    height: 40,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  logoWrapper: {
+    width: 36,
+    height: 36,
+    borderRadius: 18,
+    overflow: "hidden",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  logoImage: {
+    width: 36,
+    height: 36,
+    borderRadius: 18
+  },
+  logoOverlay: {
+    ...StyleSheet.absoluteFillObject,
+    borderWidth: 1,
+    borderRadius: 18
+  },
+  brandTextContainer: {
+    flexDirection: "column"
+  },
+  brandName: {
+    fontSize: 15,
+    fontWeight: "600",
+    lineHeight: 22.5
+  },
+  adBadge: {
+    fontSize: 13,
+    fontWeight: "400",
+    lineHeight: 19.5
+  },
+  textArea: {
+    flexDirection: "column",
+    alignItems: "flex-start"
+  },
+  title: {
+    fontSize: 15,
+    fontWeight: "600",
+    lineHeight: 22.5
+  },
+  subtitle: {
+    fontSize: 15,
+    fontWeight: "400",
+    lineHeight: 22.5
+  },
+  card: {
+    borderRadius: 12,
+    overflow: "hidden",
+    position: "relative",
+    width: "100%"
+  },
+  imageButton: {
+    width: "100%"
+  },
+  imageContainer: {
+    width: "100%",
+    aspectRatio: 16 / 9,
+    overflow: "hidden"
+  },
+  mainImage: {
+    width: "100%",
+    height: "100%"
+  },
+  cta: {
+    height: 50,
+    paddingLeft: 20,
+    paddingRight: 16,
+    alignItems: "center",
+    justifyContent: "space-between",
+    flexDirection: "row"
+  },
+  ctaText: {
+    fontSize: 15,
+    fontWeight: "600",
+    lineHeight: 22.5
+  },
+  cardOverlay: {
+    ...StyleSheet.absoluteFillObject,
+    borderWidth: 2,
+    borderRadius: 12,
+    pointerEvents: "none"
+  },
+  adClearance: {
+    marginTop: 10,
+    fontSize: 8,
+    fontWeight: "400"
+  }
+});
+
+// src/ads/inlineAd/ui/ListBannerAdView.tsx
+import { ClipPath, Defs, Image as SvgImage, Path as Path2, Svg as Svg2 } from "@granite-js/native/react-native-svg";
+import { useRef as useRef8 } from "react";
+import { Animated as Animated2, Easing as Easing2, Pressable as Pressable3, StyleSheet as StyleSheet2, Text as Text2, View as View6 } from "react-native";
+import { jsx as jsx21, jsxs as jsxs10 } from "react/jsx-runtime";
+var SQUIRCLE_PATH = "M0 17.352C0 3.564 3.564 0 17.352 0H18.648C32.436 0 36 3.564 36 17.352V18.648C36 32.436 32.436 36 18.648 36H17.352C3.564 36 0 32.436 0 18.648V17.352Z";
+function ListBannerAdView({
+  title,
+  subtitle,
+  adClearanceText,
+  adClearanceFontSize,
+  imageUri,
+  paddingStyle,
+  colors,
+  onPress
+}) {
+  const scale = useRef8(new Animated2.Value(1)).current;
+  const clipIdRef = useRef8(`clip-${Math.random().toString(36).slice(2)}`);
+  const animateScale = (toValue) => {
+    Animated2.timing(scale, {
+      toValue,
+      duration: 100,
+      easing: Easing2.inOut(Easing2.ease),
+      useNativeDriver: true
+    }).start();
+  };
+  const handlePressIn = () => {
+    animateScale(0.96);
+  };
+  const handlePressOut = () => {
+    animateScale(1);
+  };
+  return /* @__PURE__ */ jsx21(
+    Pressable3,
+    {
+      accessibilityRole: "button",
+      onPress: () => onPress(null),
+      onPressIn: handlePressIn,
+      onPressOut: handlePressOut,
+      style: styles2.pressable,
+      children: /* @__PURE__ */ jsxs10(Animated2.View, { style: [styles2.container, paddingStyle, { transform: [{ scale }] }], children: [
+        /* @__PURE__ */ jsxs10(View6, { style: styles2.titleRow, children: [
+          /* @__PURE__ */ jsx21(
+            Pressable3,
+            {
+              accessibilityRole: "button",
+              onPress: () => onPress("202"),
+              onPressIn: handlePressIn,
+              onPressOut: handlePressOut,
+              style: styles2.iconWrapper,
+              children: /* @__PURE__ */ jsxs10(Svg2, { width: 36, height: 36, viewBox: "0 0 36 36", children: [
+                /* @__PURE__ */ jsx21(Defs, { children: /* @__PURE__ */ jsx21(ClipPath, { id: clipIdRef.current, children: /* @__PURE__ */ jsx21(Path2, { d: SQUIRCLE_PATH }) }) }),
+                /* @__PURE__ */ jsx21(Path2, { d: SQUIRCLE_PATH, fill: colors.iconBg }),
+                imageUri ? /* @__PURE__ */ jsx21(
+                  SvgImage,
+                  {
+                    href: { uri: imageUri },
+                    width: 36,
+                    height: 36,
+                    preserveAspectRatio: "xMidYMid slice",
+                    clipPath: `url(#${clipIdRef.current})`
+                  }
+                ) : null,
+                /* @__PURE__ */ jsx21(
+                  Path2,
+                  {
+                    d: SQUIRCLE_PATH,
+                    fill: "none",
+                    stroke: colors.iconBorder,
+                    strokeWidth: 2,
+                    clipPath: `url(#${clipIdRef.current})`
+                  }
+                )
+              ] })
+            }
+          ),
+          /* @__PURE__ */ jsxs10(View6, { style: styles2.textWrapper, children: [
+            /* @__PURE__ */ jsx21(
+              Pressable3,
+              {
+                accessibilityRole: "button",
+                onPress: () => onPress("101"),
+                onPressIn: handlePressIn,
+                onPressOut: handlePressOut,
+                children: /* @__PURE__ */ jsx21(Text2, { style: [styles2.title, { color: colors.title }], children: title })
+              }
+            ),
+            /* @__PURE__ */ jsx21(
+              Pressable3,
+              {
+                accessibilityRole: "button",
+                onPress: () => onPress("102"),
+                onPressIn: handlePressIn,
+                onPressOut: handlePressOut,
+                children: /* @__PURE__ */ jsx21(Text2, { style: [styles2.subtitle, { color: colors.subtitle }], children: subtitle })
+              }
+            )
+          ] })
+        ] }),
+        adClearanceText ? /* @__PURE__ */ jsx21(
+          Text2,
+          {
+            style: [
+              styles2.adClearance,
+              {
+                color: colors.adClearance,
+                fontSize: adClearanceFontSize,
+                lineHeight: adClearanceFontSize * 1.2
+              }
+            ],
+            children: adClearanceText
+          }
+        ) : null
+      ] })
+    }
+  );
+}
+var styles2 = StyleSheet2.create({
+  pressable: {
+    width: "100%"
+  },
+  container: {
+    flexDirection: "column",
+    padding: 0,
+    width: "100%"
+  },
+  titleRow: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  iconWrapper: {
+    width: 36,
+    height: 36,
+    overflow: "hidden",
+    alignItems: "center",
+    justifyContent: "center",
+    marginRight: 12
+  },
+  textWrapper: {
+    flex: 1,
+    flexDirection: "column",
+    alignItems: "flex-start",
+    justifyContent: "center",
+    width: "100%"
+  },
+  title: {
+    fontSize: 17,
+    fontWeight: "700",
+    lineHeight: 25.5
+  },
+  subtitle: {
+    fontSize: 13,
+    fontWeight: "500",
+    flexShrink: 1,
+    lineHeight: 15.6
+  },
+  adClearance: {
+    marginTop: 8,
+    paddingLeft: 48,
+    width: "100%"
+  }
+});
+
+// src/ads/inlineAd/utils/ids.ts
+var slotCounter = 0;
+function createSlotId() {
+  slotCounter += 1;
+  return `banner-slot-${Date.now()}-${slotCounter}`;
+}
+
+// src/ads/inlineAd/utils/padding.ts
+function resolvePaddingStyle(padding) {
+  if (padding === void 0) {
+    return void 0;
+  }
+  if (typeof padding === "number") {
+    return { padding };
+  }
+  const trimmed = padding.trim();
+  if (!trimmed) {
+    return void 0;
+  }
+  const parts = trimmed.split(/\s+/);
+  if (parts.length < 1 || parts.length > 4) {
+    return void 0;
+  }
+  const values = parts.map((part) => {
+    const normalized = part.endsWith("px") ? part.slice(0, -2).trim() : part;
+    const numeric = Number(normalized);
+    return Number.isFinite(numeric) ? numeric : null;
+  });
+  if (values.some((value) => value === null)) {
+    return void 0;
+  }
+  const [top, right, bottom, left] = normalizePaddingValues(values);
+  return {
+    paddingTop: top,
+    paddingRight: right,
+    paddingBottom: bottom,
+    paddingLeft: left
+  };
+}
+function normalizePaddingValues(values) {
+  const [top = 0, right = top, bottom = top, left = right] = values;
+  return [top, right, bottom, left];
+}
+
+// src/ads/inlineAd/utils/payload.ts
+function buildBannerEventPayload(slotId, adGroupId, ad) {
+  return {
+    slotId,
+    adGroupId,
+    adMetadata: {
+      creativeId: ad.creative?.id ?? "",
+      requestId: ad.requestId ?? "",
+      styleId: ad.styleId ?? LIST_BANNER_STYLE_ID
+    }
+  };
+}
+function buildBannerErrorPayload(slotId, adGroupId, error) {
+  return {
+    slotId,
+    adGroupId,
+    adMetadata: {},
+    error
+  };
+}
+function buildNoFillPayload(slotId, adGroupId) {
+  return {
+    slotId,
+    adGroupId,
+    adMetadata: {}
+  };
+}
+
+// src/ads/inlineAd/InlineAd.tsx
+import { jsx as jsx22, jsxs as jsxs11 } from "react/jsx-runtime";
+var themePalette = {
+  light: {
+    title: "#4e5968",
+    subtitle: "#6b7684",
+    adClearance: "#b0b8c1",
+    iconBg: "rgba(2,32,71,0.05)",
+    iconBorder: "rgba(2,32,71,0.05)"
+  },
+  dark: {
+    title: "rgba(253,253,255,0.75)",
+    subtitle: "rgba(248,248,255,0.6)",
+    adClearance: "rgba(242,242,255,0.47)",
+    iconBg: "#ffffff",
+    iconBorder: "rgba(217,217,255,0.11)"
+  }
+};
+var feedThemePalette = {
+  light: {
+    brandLogoBg: "rgba(2,32,71,0.05)",
+    brandLogoBorder: "rgba(2,32,71,0.05)",
+    brandName: "#6b7684",
+    adBadge: "#8b95a1",
+    title: "#333d4b",
+    subtitle: "#4e5968",
+    adClearance: "#8b95a1",
+    imageOverlayBorder: "rgba(2,32,71,0.05)"
+  },
+  dark: {
+    brandLogoBg: "#ffffff",
+    brandLogoBorder: "rgba(217,217,255,0.11)",
+    brandName: "#9e9ea4",
+    adBadge: "#7e7e87",
+    title: "#e4e4e5",
+    subtitle: "#c3c3c6",
+    adClearance: "#7e7e87",
+    imageOverlayBorder: "rgba(217,217,255,0.11)"
+  }
+};
+function createError2(code, message) {
+  return {
+    code,
+    message: message || ERROR_MESSAGES[code] || "Unknown error",
+    domain: "@apps-in-toss/framework"
+  };
+}
+function isListBannerCreative(creative) {
+  return Boolean(
+    creative && typeof creative.title === "string" && typeof creative.subTitle === "string" && typeof creative.landingUrl === "string" && typeof creative.imageUrl === "string"
+  );
+}
+function isFeedBannerCreative(creative) {
+  if (!creative || typeof creative !== "object") {
+    return false;
+  }
+  if (!("brandName" in creative)) {
+    return false;
+  }
+  const candidate = creative;
+  return Boolean(
+    typeof candidate.brandName === "string" && typeof candidate.brandLogoUrl === "string" && typeof candidate.title === "string" && typeof candidate.subTitle === "string" && typeof candidate.mainImageUrl === "string" && typeof candidate.ctaText === "string" && typeof candidate.landingUrl === "string"
+  );
+}
+function isValidCreative(ad) {
+  const creative = ad.creative;
+  const styleId = String(ad.styleId);
+  if (styleId === LIST_BANNER_STYLE_ID) {
+    return isListBannerCreative(creative);
+  }
+  if (styleId === FEED_BANNER_STYLE_ID) {
+    return isFeedBannerCreative(creative);
+  }
+  return false;
+}
+function InlineAd(props) {
+  const {
+    adGroupId,
+    theme,
+    tone,
+    variant,
+    impressFallbackOnMount,
+    onAdRendered,
+    onAdViewable,
+    onAdClicked,
+    onAdImpression,
+    onAdFailedToRender,
+    onNoFill
+  } = props;
+  const slotIdRef = useRef9(createSlotId());
+  const [ad, setAd] = useState7(null);
+  const [isAdBadgeEnabled, setIsAdBadgeEnabled] = useState7(true);
+  const eventTrackerRef = useRef9(null);
+  const eventPayloadRef = useRef9(null);
+  const hasRenderedRef = useRef9(false);
+  const hasLoggedImp1pxRef = useRef9(false);
+  const hasLoggedImp100pRef = useRef9(false);
+  const hasNotifiedViewableRef = useRef9(false);
+  const viewableTimerRef = useRef9(null);
+  const refetchIntervalMsRef = useRef9(null);
+  const lastImp1pxAtRef = useRef9(null);
+  const loadingRef = useRef9(false);
+  const loadRef = useRef9(null);
+  const callbacksRef = useRef9({
+    onAdRendered,
+    onAdViewable,
+    onAdClicked,
+    onAdImpression,
+    onAdFailedToRender,
+    onNoFill
+  });
+  const isMountedRef = useRef9(false);
+  const colorScheme = useColorScheme();
+  const selectedTheme = theme ?? DEFAULT_INLINE_AD_THEME;
+  const resolvedTheme = selectedTheme === "auto" ? colorScheme === "dark" ? "dark" : "light" : selectedTheme;
+  const resolvedTone = tone ?? DEFAULT_INLINE_AD_TONE;
+  const resolvedVariant = variant ?? DEFAULT_INLINE_AD_VARIANT;
+  const colors = themePalette[resolvedTheme];
+  const feedColors = feedThemePalette[resolvedTheme];
+  const backgroundColor = resolvedTone === "grey" ? resolvedTheme === "dark" ? "#101013" : "#f2f4f7" : resolvedTheme === "dark" ? "#17171c" : "#ffffff";
+  callbacksRef.current = {
+    onAdRendered,
+    onAdViewable,
+    onAdClicked,
+    onAdImpression,
+    onAdFailedToRender,
+    onNoFill
+  };
+  useEffect14(() => {
+    isMountedRef.current = true;
+    return () => {
+      isMountedRef.current = false;
+      if (viewableTimerRef.current) {
+        clearTimeout(viewableTimerRef.current);
+        viewableTimerRef.current = null;
+      }
+    };
+  }, []);
+  useEffect14(() => {
+    const loadAdRequest = () => {
+      if (loadingRef.current) {
+        return;
+      }
+      if (!adGroupId) {
+        const error = createError2(
+          ERROR_CODES.INVALID_SPACE,
+          `${ERROR_MESSAGES[ERROR_CODES.INVALID_SPACE]} - adGroupId must be provided`
+        );
+        callbacksRef.current.onAdFailedToRender?.(buildBannerErrorPayload(slotIdRef.current, adGroupId, error));
+        return;
+      }
+      loadingRef.current = true;
+      loadAd(adGroupId).then((result) => {
+        if (!isMountedRef.current) return;
+        if (result.type === "noFill") {
+          callbacksRef.current.onNoFill?.(buildNoFillPayload(slotIdRef.current, adGroupId));
+          return;
+        }
+        if (result.type === "error") {
+          callbacksRef.current.onAdFailedToRender?.(
+            buildBannerErrorPayload(slotIdRef.current, adGroupId, result.error)
+          );
+          return;
+        }
+        if (!isValidCreative(result.ad)) {
+          const invalidError = createError2(ERROR_CODES.INTERNAL_ERROR, "Invalid creative payload");
+          callbacksRef.current.onAdFailedToRender?.(
+            buildBannerErrorPayload(slotIdRef.current, adGroupId, invalidError)
+          );
+          return;
+        }
+        if (result.responseExt?.refetchSeconds !== void 0) {
+          refetchIntervalMsRef.current = typeof result.responseExt.refetchSeconds === "number" && result.responseExt.refetchSeconds > 0 ? result.responseExt.refetchSeconds * 1e3 : null;
+        }
+        hasRenderedRef.current = false;
+        hasLoggedImp1pxRef.current = false;
+        hasLoggedImp100pRef.current = false;
+        hasNotifiedViewableRef.current = false;
+        lastImp1pxAtRef.current = null;
+        if (viewableTimerRef.current) {
+          clearTimeout(viewableTimerRef.current);
+          viewableTimerRef.current = null;
+        }
+        const payload = buildBannerEventPayload(slotIdRef.current, adGroupId, result.ad);
+        eventPayloadRef.current = payload;
+        eventTrackerRef.current = new EventTracker(
+          result.ad.eventTrackingUrls ?? [],
+          result.ad.eventTypes ?? [],
+          result.ad.eventPayload ?? "",
+          result.requestId,
+          result.ad.creative?.id
+        );
+        setIsAdBadgeEnabled(result.responseExt?.isAdBadgeEnabled !== false);
+        setAd(result.ad);
+      }).catch((error) => {
+        if (!isMountedRef.current) return;
+        const adError = error instanceof Error ? createError2(ERROR_CODES.INTERNAL_ERROR, error.message) : createError2(ERROR_CODES.INTERNAL_ERROR, "Unknown error");
+        callbacksRef.current.onAdFailedToRender?.(buildBannerErrorPayload(slotIdRef.current, adGroupId, adError));
+      }).finally(() => {
+        loadingRef.current = false;
+      });
+    };
+    loadRef.current = loadAdRequest;
+    loadAdRequest();
+    return () => {
+      loadRef.current = null;
+    };
+  }, [adGroupId]);
+  useVisibilityChange2((documentVisibility) => {
+    if (documentVisibility !== "visible") {
+      return;
+    }
+    const interval = refetchIntervalMsRef.current;
+    const lastImp1pxAt = lastImp1pxAtRef.current;
+    if (!interval || !lastImp1pxAt || loadingRef.current) {
+      return;
+    }
+    if (Date.now() - lastImp1pxAt >= interval) {
+      loadRef.current?.();
+    }
+  });
+  useEffect14(() => {
+    if (!ad || hasRenderedRef.current) {
+      return;
+    }
+    hasRenderedRef.current = true;
+    const payload = eventPayloadRef.current;
+    if (payload) {
+      callbacksRef.current.onAdRendered?.(payload);
+    }
+  }, [ad]);
+  if (!ad) {
+    return null;
+  }
+  const impressionKey = `${ad.requestId ?? "request"}:${ad.creative?.id ?? "creative"}`;
+  const resolvedStyleId = ad.styleId || LIST_BANNER_STYLE_ID;
+  const defaultPaddingValue = resolvedStyleId === LIST_BANNER_STYLE_ID ? DEFAULT_INLINE_AD_PADDING_BANNER : DEFAULT_INLINE_AD_PADDING_NATIVE_IMAGE;
+  const paddingStyle = resolvePaddingStyle(defaultPaddingValue);
+  const isListBanner = String(resolvedStyleId) === LIST_BANNER_STYLE_ID;
+  const isFeedBanner = String(resolvedStyleId) === FEED_BANNER_STYLE_ID;
+  const listCreative = isListBanner ? ad.creative : null;
+  const feedCreative = isFeedBanner ? ad.creative : null;
+  const subtitleText = listCreative && isAdBadgeEnabled ? `${listCreative.subTitle} \u2022 AD` : listCreative?.subTitle ?? "";
+  const adClearanceText = listCreative?.adClearanceText ?? feedCreative?.adClearanceText ?? void 0;
+  const adClearanceFontSize = adClearanceText && adClearanceText.length >= 60 ? 6 : 8;
+  const imageUri = listCreative?.imageUrl && isSafeUrl(listCreative.imageUrl) ? listCreative.imageUrl : null;
+  const brandLogoUri = feedCreative?.brandLogoUrl && isSafeUrl(feedCreative.brandLogoUrl) ? feedCreative.brandLogoUrl : null;
+  const mainImageUri = feedCreative?.mainImageUrl && isSafeUrl(feedCreative.mainImageUrl) ? feedCreative.mainImageUrl : null;
+  const basePayload = eventPayloadRef.current;
+  const trackEvent = (eventType) => {
+    eventTrackerRef.current?.track(eventType).catch((error) => {
+      console.error("[InlineAd] Failed to track event:", error);
+    });
+  };
+  const handleImpression1px = () => {
+    if (hasLoggedImp1pxRef.current) return;
+    hasLoggedImp1pxRef.current = true;
+    lastImp1pxAtRef.current = Date.now();
+    trackEvent("IMP_1PX");
+    if (basePayload) {
+      void tossAdEventLog({
+        log_name: "display_ads_all::impression__1px_banner",
+        log_type: "event",
+        params: {
+          event_type: "impression",
+          schema_id: 1812034,
+          request_id: basePayload.adMetadata.requestId ?? ""
+        }
+      });
+      callbacksRef.current.onAdImpression?.(basePayload);
+    }
+  };
+  const handleImpression100p = () => {
+    if (hasLoggedImp100pRef.current) return;
+    hasLoggedImp100pRef.current = true;
+    trackEvent("IMP_100P");
+  };
+  const handleViewableStart = () => {
+    if (hasNotifiedViewableRef.current || viewableTimerRef.current) return;
+    viewableTimerRef.current = setTimeout(() => {
+      hasNotifiedViewableRef.current = true;
+      viewableTimerRef.current = null;
+      trackEvent("VIMP");
+      if (basePayload) {
+        callbacksRef.current.onAdViewable?.(basePayload);
+      }
+    }, 1e3);
+  };
+  const handleViewableEnd = () => {
+    if (viewableTimerRef.current) {
+      clearTimeout(viewableTimerRef.current);
+      viewableTimerRef.current = null;
+    }
+  };
+  const handleClick = (slotKey) => {
+    trackEvent("CLICK");
+    if (slotKey != null) {
+      trackEvent(`CLICK_${slotKey}`);
+    }
+    if (isSafeUrl(ad.creative.landingUrl)) {
+      openLandingUrl(ad.creative.landingUrl);
+    }
+    if (basePayload) {
+      callbacksRef.current.onAdClicked?.(basePayload);
+    }
+  };
+  return /* @__PURE__ */ jsx22(
+    ImpressionArea,
+    {
+      style: styles3.impressionArea,
+      onImpressionStart: handleImpression1px,
+      areaThreshold: 0,
+      UNSAFE__impressFallbackOnMount: Boolean(impressFallbackOnMount),
+      children: /* @__PURE__ */ jsx22(
+        ImpressionArea,
+        {
+          onImpressionStart: handleImpression100p,
+          areaThreshold: 1,
+          UNSAFE__impressFallbackOnMount: Boolean(impressFallbackOnMount),
+          children: /* @__PURE__ */ jsx22(
+            ImpressionArea,
+            {
+              onImpressionStart: handleViewableStart,
+              onImpressionEnd: handleViewableEnd,
+              areaThreshold: 0.5,
+              UNSAFE__impressFallbackOnMount: Boolean(impressFallbackOnMount),
+              children: /* @__PURE__ */ jsx22(View7, { style: [styles3.wrapper, resolvedVariant === "card" && styles3.cardWrapper], children: /* @__PURE__ */ jsxs11(View7, { style: [styles3.surface, { backgroundColor }, resolvedVariant === "card" && styles3.cardSurface], children: [
+                isListBanner && listCreative ? /* @__PURE__ */ jsx22(
+                  ListBannerAdView,
+                  {
+                    title: listCreative.title,
+                    subtitle: subtitleText,
+                    adClearanceText,
+                    adClearanceFontSize,
+                    imageUri,
+                    paddingStyle,
+                    colors,
+                    onPress: handleClick
+                  }
+                ) : null,
+                isFeedBanner && feedCreative ? /* @__PURE__ */ jsx22(
+                  FeedBannerAdView,
+                  {
+                    brandName: feedCreative.brandName,
+                    brandLogoUri,
+                    title: feedCreative.title,
+                    subtitle: feedCreative.subTitle,
+                    mainImageUri,
+                    ctaText: feedCreative.ctaText,
+                    ctaTextColor: feedCreative.ctaTextColor,
+                    ctaBackgroundColor: feedCreative.ctaBackgroundColor,
+                    adClearanceText,
+                    colors: feedColors,
+                    isAdBadgeEnabled,
+                    paddingStyle,
+                    onPress: handleClick
+                  }
+                ) : null
+              ] }) })
+            }
+          )
+        }
+      )
+    },
+    impressionKey
+  );
+}
+var styles3 = StyleSheet3.create({
+  impressionArea: {
+    width: "100%"
+  },
+  wrapper: {
+    width: "100%"
+  },
+  cardWrapper: {
+    paddingHorizontal: 10
+  },
+  surface: {
+    width: "100%",
+    overflow: "hidden"
+  },
+  cardSurface: {
+    borderRadius: 16
+  }
+});
+
+// src/index.ts
 var Analytics2 = {
   init: InternalAnalytics.init,
   Impression: InternalAnalytics.Impression,
@@ -2826,6 +4085,7 @@ export {
   Analytics2 as Analytics,
   AppsInToss,
   INTERNAL__onVisibilityChangedByTransparentServiceWeb,
+  InlineAd,
   OverlayProvider,
   WebView,
   env,