@apps-in-toss/framework 2.9.3 → 2.10.0

package/dist/index.js

@@ -1777,7 +1777,7 @@ function convertIntentURL(url) {
   return `${scheme}://${url.hostname}${url.pathname}${url.search}`;
 }
 
-// src/ads/fetchTossAd.ts
+// src/ads/fetchAppsInTossAd.ts
 import {
   getOperationalEnvironment as getOperationalEnvironment6,
   INTERNAL__appBridgeHandler as INTERNAL__appBridgeHandler3,
@@ -1809,14 +1809,54 @@ function generateSessionId() {
 // src/ads/constants.ts
 var sessionId = generateSessionId();
 
+// src/ads/fetchAppsInTossAd.ts
+var ANDROID_SUPPORTED_VERSION = "5.264.0";
+var IOS_SUPPORTED_VERSION = "5.264.0";
+var APP_BRIDGE_METHOD_NAME2 = "fetchAppsInTossAd";
+var UNSUPPORTED_ERROR_MESSAGE = "This feature is not supported in the current environment";
+function fetchAppsInTossAd(params) {
+  const { body, onEvent, onError } = params;
+  if (!fetchAppsInTossAd.isSupported()) {
+    onError(new Error(UNSUPPORTED_ERROR_MESSAGE));
+    return noop;
+  }
+  const spaceUnitId = normalizeAdGroupId(body.spaceUnitId);
+  if (spaceUnitId.length === 0) {
+    onError(createInvalidAdGroupIdError());
+    return noop;
+  }
+  return INTERNAL__appBridgeHandler3.invokeAppBridgeMethod(
+    APP_BRIDGE_METHOD_NAME2,
+    { ...body, spaceUnitId, sessionId: body.sessionId ?? sessionId },
+    {
+      onSuccess: onEvent,
+      onError
+    }
+  );
+}
+fetchAppsInTossAd.isSupported = () => {
+  if (getOperationalEnvironment6() !== "toss") {
+    return false;
+  }
+  return isMinVersionSupported4({
+    android: ANDROID_SUPPORTED_VERSION,
+    ios: IOS_SUPPORTED_VERSION
+  });
+};
+
 // src/ads/fetchTossAd.ts
+import {
+  getOperationalEnvironment as getOperationalEnvironment7,
+  INTERNAL__appBridgeHandler as INTERNAL__appBridgeHandler4,
+  isMinVersionSupported as isMinVersionSupported5
+} from "@apps-in-toss/native-modules";
 var ANDROID_FETCH_TOSS_AD_SUPPORTED_VERSION = "5.241.0";
 var IOS_FETCH_TOSS_AD_SUPPORTED_VERSION = "5.241.0";
-var UNSUPPORTED_ERROR_MESSAGE = "This feature is not supported in the current environment";
-var ENVIRONMENT = getOperationalEnvironment6();
+var UNSUPPORTED_ERROR_MESSAGE2 = "This feature is not supported in the current environment";
+var ENVIRONMENT = getOperationalEnvironment7();
 function fetchTossAd(params) {
   if (!fetchTossAd.isSupported()) {
-    params.onError(new Error(UNSUPPORTED_ERROR_MESSAGE));
+    params.onError(new Error(UNSUPPORTED_ERROR_MESSAGE2));
     return noop;
   }
   const { onEvent, onError, options } = params;
@@ -1826,7 +1866,7 @@ function fetchTossAd(params) {
     return noop;
   }
   const wireHeaders = options.headers;
-  const unregisterCallbacks = INTERNAL__appBridgeHandler3.invokeAppBridgeMethod(
+  const unregisterCallbacks = INTERNAL__appBridgeHandler4.invokeAppBridgeMethod(
     "fetchTossAd",
     {
       spaceUnitId: adGroupId,
@@ -1850,14 +1890,14 @@ fetchTossAd.isSupported = () => {
   if (ENVIRONMENT !== "toss") {
     return false;
   }
-  return isMinVersionSupported4({
+  return isMinVersionSupported5({
     android: ANDROID_FETCH_TOSS_AD_SUPPORTED_VERSION,
     ios: IOS_FETCH_TOSS_AD_SUPPORTED_VERSION
   });
 };
 
 // src/ads/integratedAd.ts
-import { GoogleAdMob, INTERNAL__appBridgeHandler as INTERNAL__appBridgeHandler4, isMinVersionSupported as isMinVersionSupported5 } from "@apps-in-toss/native-modules";
+import { GoogleAdMob, INTERNAL__appBridgeHandler as INTERNAL__appBridgeHandler5, isMinVersionSupported as isMinVersionSupported6 } from "@apps-in-toss/native-modules";
 
 // src/ads/generateRequestId.ts
 function generateRequestId() {
@@ -1877,7 +1917,7 @@ function getReferrer() {
 }
 
 // src/ads/remotes.ts
-import { getOperationalEnvironment as getOperationalEnvironment7, getPlatformOS, getTossAppVersion } from "@apps-in-toss/native-modules";
+import { getOperationalEnvironment as getOperationalEnvironment8, getPlatformOS, getTossAppVersion } from "@apps-in-toss/native-modules";
 
 // src/ads/getIsDev.ts
 import { getSchemeUri as getSchemeUri7 } from "@granite-js/react-native";
@@ -1890,7 +1930,7 @@ function getIsDev() {
 }
 
 // src/ads/remotes.ts
-var OPERATIONAL_ENVIRONMENT = getOperationalEnvironment7();
+var OPERATIONAL_ENVIRONMENT = getOperationalEnvironment8();
 var OS = getPlatformOS();
 var APP_VER = getTossAppVersion();
 var ALPHA_EVENT_TRACKER_HTTP_ENDPOINT = "https://alpha-trillion.toss.im/trk/sdk-mediation/event";
@@ -1924,10 +1964,10 @@ function postEventTracking(params) {
 var INTEGRATED_AD_SDK_VERSION = "0.0.0";
 var ANDROID_INTEGRATED_AD_SUPPORTED_VERSION = "5.247.0";
 var IOS_INTEGRATED_AD_SUPPORTED_VERSION = "5.247.0";
-var UNSUPPORTED_ERROR_MESSAGE2 = "This feature is not supported in the current environment";
+var UNSUPPORTED_ERROR_MESSAGE3 = "This feature is not supported in the current environment";
 var INTG_AD_ADM_FALLBACK_RID_MAP = {};
 function integratedAdIsSupported() {
-  return isMinVersionSupported5({
+  return isMinVersionSupported6({
     android: ANDROID_INTEGRATED_AD_SUPPORTED_VERSION,
     ios: IOS_INTEGRATED_AD_SUPPORTED_VERSION
   });
@@ -1935,7 +1975,7 @@ function integratedAdIsSupported() {
 function generateLoadFullScreenAd(sdkId) {
   const fn = (params) => {
     if (!GoogleAdMob.loadAppsInTossAdMob.isSupported()) {
-      params.onError(new Error(UNSUPPORTED_ERROR_MESSAGE2));
+      params.onError(new Error(UNSUPPORTED_ERROR_MESSAGE3));
       return noop;
     }
     const normalizedAdGroupId = normalizeAdGroupId(params.options.adGroupId);
@@ -1993,7 +2033,7 @@ function generateLoadFullScreenAd(sdkId) {
     const { adGroupId } = options;
     const referrer = getReferrer();
     const wireHeaders = options.headers;
-    const unregisterCallbacks = INTERNAL__appBridgeHandler4.invokeAppBridgeMethod(
+    const unregisterCallbacks = INTERNAL__appBridgeHandler5.invokeAppBridgeMethod(
       "loadTossAdOrAdmob",
       {
         spaceUnitId: adGroupId,
@@ -2020,7 +2060,7 @@ var loadFullScreenAd = generateLoadFullScreenAd("107");
 var loadFullScreenAdForWeb = generateLoadFullScreenAd("107");
 function showFullScreenAd(params) {
   if (!GoogleAdMob.showAppsInTossAdMob.isSupported()) {
-    params.onError(new Error(UNSUPPORTED_ERROR_MESSAGE2));
+    params.onError(new Error(UNSUPPORTED_ERROR_MESSAGE3));
     return noop;
   }
   const normalizedAdGroupId = normalizeAdGroupId(params.options.adGroupId);
@@ -2135,7 +2175,7 @@ function showFullScreenAd(params) {
   const { onEvent, onError, options } = normalizedParams;
   const { adGroupId } = options;
   const referrer = getReferrer();
-  const unregisterCallbacks = INTERNAL__appBridgeHandler4.invokeAppBridgeMethod(
+  const unregisterCallbacks = INTERNAL__appBridgeHandler5.invokeAppBridgeMethod(
     "showTossAdOrAdmob",
     { spaceUnitId: adGroupId, referrer, sessionId },
     {
@@ -2701,7 +2741,7 @@ function useTopNavigation() {
 }
 
 // src/hooks/useWebViewMemoryDebug.tsx
-import { getOperationalEnvironment as getOperationalEnvironment8 } from "@apps-in-toss/native-modules";
+import { getOperationalEnvironment as getOperationalEnvironment9 } from "@apps-in-toss/native-modules";
 import { Granite as Granite8 } from "@granite-js/react-native";
 import { useToast } from "@toss/tds-react-native";
 function useHandleWebViewProcessDidTerminate(webViewRef) {
@@ -2729,7 +2769,7 @@ function webViewDebugLog(logName, params) {
       deployment_id: global2.deploymentId
     }
   };
-  if (getOperationalEnvironment8() === "toss") {
+  if (getOperationalEnvironment9() === "toss") {
     sendLog(event, { pipelines: ["core"] });
   } else {
     console.log("[webViewDebugLog]", event);
@@ -2875,6 +2915,8 @@ function WebView({ type, local, onMessage, ...props }) {
       showFullScreenAd,
       /** TossAd */
       fetchTossAd,
+      // v1.4 배너: web 이벤트 브릿지는 payload를 options로 전달하지만 fetchAppsInTossAd는 body로 받으므로 어댑팅한다.
+      fetchAppsInTossAd: ({ onEvent, onError, options }) => fetchAppsInTossAd({ body: options, onEvent, onError }),
       /** IAP */
       iapCreateOneTimePurchaseOrder: IAP.createOneTimePurchaseOrder,
       requestSubscriptionPurchase,
@@ -2896,6 +2938,7 @@ function WebView({ type, local, onMessage, ...props }) {
       showFullScreenAd_isSupported: showFullScreenAd.isSupported,
       /** TossAd */
       fetchTossAd_isSupported: fetchTossAd.isSupported,
+      fetchAppsInTossAd_isSupported: fetchAppsInTossAd.isSupported,
       /** env */
       getDeploymentId: env.getDeploymentId,
       getWebViewType: env.getWebViewType,
@@ -3159,6 +3202,159 @@ var AD_STATUS_ERROR_MAP = {
   }
 };
 
+// src/ads/inlineAd/errorTracking.ts
+var BANNER_ERROR_LOG_NAME = "display_ads_all::error__banner";
+var MAX_STACK_TRACE_LENGTH = 255;
+function logBannerErrorToAppLog(info) {
+  void tossAdEventLog({
+    log_name: BANNER_ERROR_LOG_NAME,
+    log_type: "debug",
+    params: {
+      error_code: info.errorCode,
+      error_message: info.errorMessage,
+      ad_group_id: info.adGroupId,
+      mediation_id: info.mediationId,
+      event_context_token: info.eventContextToken
+    }
+  }).catch(noop);
+}
+function trackBannerError(info) {
+  if (info.endpointError) {
+    void fetch(info.endpointError, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        eventContextToken: info.eventContextToken,
+        mediationId: info.mediationId,
+        errorCode: info.errorCode,
+        errorMessage: info.errorMessage,
+        stackTrace: info.stackTrace?.slice(0, MAX_STACK_TRACE_LENGTH)
+      })
+      // POST 실패(CORS·네트워크) → 앱로그 fallback (endpoint와 같은 채널이라 함께 막히는 경우 대비).
+    }).catch(() => logBannerErrorToAppLog(info));
+    return;
+  }
+  logBannerErrorToAppLog(info);
+}
+
+// src/ads/inlineAd/loadAd.ts
+import { getPlatformOS as getPlatformOS3, getTossAppVersion as getTossAppVersion3 } from "@apps-in-toss/native-modules";
+
+// src/ads/fetchAppsInTossAdSchema.ts
+var APPS_IN_TOSS_AD_SPEC_VERSION = "1.4.1";
+var FETCH_APPS_IN_TOSS_AD_DEVICE_MACRO = "{{device}}";
+var TOSS_APP_BUNDLE_IDS = {
+  ios: "com.vivarepublica.cash",
+  android: "viva.republica.toss"
+};
+function resolveTossAppBundleId(os) {
+  return TOSS_APP_BUNDLE_IDS[os];
+}
+
+// package.json
+var package_default = {
+  name: "@apps-in-toss/framework",
+  type: "module",
+  version: "2.10.0",
+  description: "The framework for Apps In Toss",
+  scripts: {
+    typecheck: "tsc --noEmit",
+    test: "vitest --no-watch",
+    "test:no-parallel": "vitest --no-watch --config=vitest.no-parallel.config.mts",
+    lint: "eslint .",
+    build: "tsup"
+  },
+  main: "./dist/index.cjs",
+  module: "./dist/index.js",
+  types: "./dist/index.d.ts",
+  exports: {
+    ".": {
+      types: "./dist/index.d.ts",
+      import: "./dist/index.js",
+      require: "./dist/index.cjs"
+    },
+    "./plugins": {
+      types: "./dist/plugins/index.d.ts",
+      import: "./dist/plugins/index.js",
+      require: "./dist/plugins/index.cjs"
+    },
+    "./internal": {
+      types: "./dist/internal.d.ts",
+      import: "./dist/internal.js",
+      require: "./dist/internal.cjs"
+    },
+    "./bridge-entry": "./src/bridge-entry.ts",
+    "./bridge-meta": {
+      types: "./dist/bridge-meta.d.ts",
+      default: "./dist/bridge-meta.js"
+    },
+    "./jest": {
+      types: "./dist/jest/index.d.ts",
+      import: "./dist/jest/index.js",
+      require: "./dist/jest/index.cjs"
+    },
+    "./package.json": "./package.json"
+  },
+  files: [
+    "dist/**/*",
+    "src/bridge-entry.ts",
+    "src/async-bridges.ts",
+    "src/constant-bridges.ts",
+    "src/event-bridges.ts",
+    "hermesc/**/*",
+    "plugins.d.ts",
+    "jest.d.ts"
+  ],
+  bin: {
+    ait: "./bin/ait.js"
+  },
+  dependencies: {
+    "@apps-in-toss/analytics": "workspace:*",
+    "@apps-in-toss/cli": "workspace:*",
+    "@apps-in-toss/native-modules": "workspace:*",
+    "@apps-in-toss/plugins": "workspace:*",
+    "@apps-in-toss/types": "workspace:*",
+    "@apps-in-toss/user-scripts": "workspace:^",
+    "es-hangul": "^2.3.2"
+  },
+  devDependencies: {
+    "@apps-in-toss/ait-format": "1.0.0",
+    "@babel/runtime": "^7",
+    "@granite-js/mpack": "catalog:granite-js",
+    "@granite-js/native": "catalog:granite-js",
+    "@granite-js/plugin-core": "catalog:granite-js",
+    "@granite-js/react-native": "catalog:granite-js",
+    "@granite-js/utils": "catalog:granite-js",
+    "@toss/tds-react-native": "catalog:react-native",
+    "@types/kill-port": "2.0.1",
+    "@types/react": "catalog:react-native",
+    "brick-module": "catalog:brick-module",
+    "es-toolkit": "^1.34.1",
+    eslint: "^9.7.0",
+    execa: "catalog:tooling",
+    jsdom: "^25.0.1",
+    "kill-port": "2.0.1",
+    react: "catalog:react-native",
+    "react-native": "catalog:react-native",
+    tsup: "^8.3.5",
+    typescript: "5.8.3",
+    vitest: "^3.0.3",
+    "workspace-tools": "^0.38.2"
+  },
+  peerDependencies: {
+    "@granite-js/native": "*",
+    "@granite-js/react-native": "*",
+    "@toss/tds-react-native": ">=2.0.0",
+    "@types/react": "*",
+    "brick-module": "*",
+    react: "*",
+    "react-native": "*"
+  }
+};
+
+// src/ads/sdkVersion.ts
+var SDK_VERSION = package_default.version;
+
 // src/ads/inlineAd/loadAd.ts
 function createError(code, message) {
   return {
@@ -3185,6 +3381,28 @@ function fetchTossAdPromise(options) {
     });
   });
 }
+function requestAd(adGroupId) {
+  if (fetchAppsInTossAd.isSupported()) {
+    const body = {
+      specVersion: APPS_IN_TOSS_AD_SPEC_VERSION,
+      platform: "RN",
+      spaceUnitId: adGroupId,
+      sdkVersion: SDK_VERSION,
+      availableStyleIds: AVAILABLE_STYLE_IDS,
+      // device는 매크로키만 보내고 native가 실제 device로 치환한다.
+      device: FETCH_APPS_IN_TOSS_AD_DEVICE_MACRO,
+      app: {
+        version: getTossAppVersion3(),
+        bundle: resolveTossAppBundleId(getPlatformOS3()),
+        subBundle: global.__granite?.app?.name ?? ""
+      }
+    };
+    return new Promise((resolve, reject) => {
+      fetchAppsInTossAd({ body, onEvent: resolve, onError: reject });
+    });
+  }
+  return fetchTossAdPromise({ adGroupId, sdkId: SDK_ID, availableStyleIds: AVAILABLE_STYLE_IDS });
+}
 function isApiResponse(payload) {
   return Boolean(payload && typeof payload === "object" && "resultType" in payload);
 }
@@ -3198,6 +3416,7 @@ function normalizeAdResponse(adResponse) {
   })).filter((ad) => AVAILABLE_STYLE_IDS.includes(String(ad.styleId))) : [];
   return {
     requestId: adResponse.requestId ?? "",
+    eventContextToken: adResponse.eventContextToken ?? "",
     status: adResponse.status ?? "OK",
     ads,
     ext: adResponse.ext
@@ -3238,7 +3457,7 @@ async function loadAd(adGroupId) {
       error: createError(ERROR_CODES.INVALID_SPACE, INVALID_AD_GROUP_ID_ERROR_MESSAGE)
     };
   }
-  if (!fetchTossAd.isSupported()) {
+  if (!fetchAppsInTossAd.isSupported() && !fetchTossAd.isSupported()) {
     return {
       type: "error",
       error: createError(ERROR_CODES.SDK_NOT_INITIALIZED, "This feature is not supported in the current environment")
@@ -3246,11 +3465,7 @@ async function loadAd(adGroupId) {
   }
   let response;
   try {
-    const raw = await fetchTossAdPromise({
-      adGroupId: normalizedAdGroupId,
-      sdkId: SDK_ID,
-      availableStyleIds: AVAILABLE_STYLE_IDS
-    });
+    const raw = await requestAd(normalizedAdGroupId);
     response = normalizeApiResponse(raw);
   } catch (error) {
     if (isAdError(error)) {
@@ -3352,6 +3567,162 @@ function supertossWeb(uri) {
   return `supertoss://web?url=${encodeURIComponent(uri)}&external=true`;
 }
 
+// src/ads/inlineAd/renderConfig.ts
+var listBannerPalette = {
+  "1": {
+    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)"
+    }
+  },
+  "2": {
+    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: "rgba(217,217,255,0.11)",
+      iconBorder: "rgba(217,217,255,0.11)"
+    }
+  }
+};
+var feedBannerPalette = {
+  "1": {
+    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)"
+    }
+  },
+  "2": {
+    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: "rgba(217,217,255,0.11)",
+      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 resolveCreativeVersion(creativeVersion) {
+  return String(creativeVersion) === "2" ? "2" : "1";
+}
+function resolveListBannerRenderConfig(creativeVersion, theme) {
+  const version = resolveCreativeVersion(creativeVersion);
+  const isV2 = version === "2";
+  return {
+    colors: listBannerPalette[version][theme],
+    defaultPaddingValue: DEFAULT_INLINE_AD_PADDING_BANNER,
+    titleSlotId: isV2 ? "1001" : "101",
+    subtitleSlotId: isV2 ? "1002" : "102",
+    iconImageSlotId: isV2 ? "2505" : "202",
+    adClearancePaddingRight: isV2 ? 24 : void 0
+  };
+}
+function resolveFeedBannerRenderConfig(creativeVersion, theme) {
+  const version = resolveCreativeVersion(creativeVersion);
+  const isV2 = version === "2";
+  return {
+    colors: feedBannerPalette[version][theme],
+    defaultPaddingValue: isV2 ? DEFAULT_INLINE_AD_PADDING_BANNER : DEFAULT_INLINE_AD_PADDING_NATIVE_IMAGE,
+    brandImageSlotId: isV2 ? "2500" : "202",
+    brandNameSlotId: isV2 ? "1004" : "103",
+    titleSlotId: isV2 ? "1000" : "101",
+    subtitleSlotId: isV2 ? "1002" : "102",
+    mainImageSlotId: isV2 ? "2005" : "201",
+    ctaButtonSlotId: "0",
+    adBadgeText: isV2 ? "AD" : "\uAD11\uACE0",
+    showTextArea: !isV2,
+    adBadgePaddingLeft: isV2 ? 1 : void 0,
+    imageButtonBackgroundColor: isV2 ? "#000000" : void 0,
+    cardOverlayBorderWidth: isV2 ? 1.5 : void 0
+  };
+}
+
+// src/ads/inlineAd/resultTracking.ts
+async function fireResultTracking(result, adGroupId, ctx) {
+  if (result.type !== "success") {
+    return;
+  }
+  if (ctx.resultEndpoint == null || ctx.mediationId == null) {
+    return;
+  }
+  const body = {
+    mediationId: ctx.mediationId,
+    spaceUnitId: adGroupId,
+    requestId: result.response?.requestId ?? "",
+    eventContextToken: ctx.eventContextToken,
+    winnerSource: "TOSS",
+    content: null,
+    adUnitId: ctx.adUnitId ?? null,
+    placementId: ctx.placementId ?? null,
+    tossFailed: null
+  };
+  try {
+    const res = await fetch(ctx.resultEndpoint, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(body)
+    });
+    if (!res.ok) {
+      throw new Error(`HTTP ${res.status}`);
+    }
+  } catch (error) {
+    trackBannerError({
+      errorCode: ERROR_CODES.NETWORK_ERROR,
+      errorMessage: `RESULT_TRACKING failed: ${error instanceof Error ? error.message : String(error)}`,
+      adGroupId,
+      mediationId: ctx.mediationId,
+      eventContextToken: ctx.eventContextToken,
+      endpointError: ctx.errorEndpoint
+    });
+  }
+}
+
 // src/ads/inlineAd/tracking.ts
 var GlobalEventDeduplicator = class _GlobalEventDeduplicator {
   static MAX_EVENTS = 1e4;
@@ -3374,12 +3745,13 @@ var GlobalEventDeduplicator = class _GlobalEventDeduplicator {
 };
 var globalEventDeduplicator = new GlobalEventDeduplicator();
 var EventTracker = class {
-  constructor(eventTrackingUrls = [], eventTypes = [], eventPayload = "", requestId, creativeId, requestHeaders) {
+  constructor(eventTrackingUrls = [], eventTypes = [], eventPayload = "", requestId, creativeId, requestHeaders, onTrackingError) {
     this.eventTrackingUrls = eventTrackingUrls;
     this.eventPayload = eventPayload;
     this.requestId = requestId;
     this.creativeId = creativeId;
     this.requestHeaders = requestHeaders;
+    this.onTrackingError = onTrackingError;
     this.eventTypes = new Set(eventTypes);
     this.repeatableEvents = /* @__PURE__ */ new Set(["VIEW_MUTE", "VIEW_UNMUTE"]);
   }
@@ -3403,7 +3775,13 @@ var EventTracker = class {
       type: eventType,
       data: this.eventPayload
     };
-    await Promise.allSettled(this.eventTrackingUrls.map((url) => this.sendTrackingRequest(url, payload)));
+    const results = await Promise.allSettled(
+      this.eventTrackingUrls.map((url) => this.sendTrackingRequest(url, payload))
+    );
+    const failedUrls = this.eventTrackingUrls.filter((_, index) => results[index]?.status === "rejected");
+    if (failedUrls.length > 0) {
+      this.onTrackingError?.(failedUrls);
+    }
     if (!this.repeatableEvents.has(eventType) && this.requestId && this.creativeId) {
       globalEventDeduplicator.markTracked(this.requestId, this.creativeId, eventType);
     }
@@ -3416,14 +3794,33 @@ var EventTracker = class {
     if (this.requestId) {
       headers["X-Toss-RequestId"] = this.requestId;
     }
-    await fetch(url, {
+    const response = await fetch(url, {
       method: "POST",
       headers,
       body: JSON.stringify(payload)
     });
+    if (!response.ok) {
+      throw new Error(`HTTP ${response.status}`);
+    }
   }
 };
 
+// src/ads/inlineAd/trackingContext.ts
+function nonEmptyString(value) {
+  return typeof value === "string" && value.length > 0 ? value : void 0;
+}
+function extractAdTrackingContext(response) {
+  const mediation = response?.ext?.mediation;
+  return {
+    mediationId: nonEmptyString(mediation?.mediationId),
+    eventContextToken: nonEmptyString(response?.eventContextToken),
+    resultEndpoint: nonEmptyString(mediation?.endpoint?.result),
+    errorEndpoint: nonEmptyString(mediation?.endpoint?.error),
+    adUnitId: nonEmptyString(mediation?.admob?.adUnitId),
+    placementId: typeof mediation?.admob?.placementId === "number" ? mediation.admob.placementId : void 0
+  };
+}
+
 // src/ads/inlineAd/ui/FeedBannerAdView.tsx
 import { Path, Svg } from "@granite-js/native/react-native-svg";
 import { useRef as useRef6 } from "react";
@@ -3441,6 +3838,12 @@ 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-
 function FeedBannerAdView({
   brandName,
   brandLogoUri,
+  brandImageSlotId,
+  brandNameSlotId,
+  titleSlotId,
+  subtitleSlotId,
+  mainImageSlotId,
+  ctaButtonSlotId,
   title,
   subtitle,
   mainImageUri,
@@ -3448,6 +3851,11 @@ function FeedBannerAdView({
   ctaTextColor,
   ctaBackgroundColor,
   adClearanceText,
+  adBadgeText,
+  showTextArea,
+  adBadgePaddingLeft,
+  imageButtonBackgroundColor,
+  cardOverlayBorderWidth,
   colors: colors4,
   isAdBadgeEnabled,
   paddingStyle,
@@ -3485,7 +3893,7 @@ function FeedBannerAdView({
               Pressable2,
               {
                 accessibilityRole: "button",
-                onPress: () => onPress("202"),
+                onPress: () => onPress(brandImageSlotId),
                 onPressIn: handlePressIn,
                 onPressOut: handlePressOut,
                 style: styles.logoContainer,
@@ -3500,7 +3908,7 @@ function FeedBannerAdView({
                 Pressable2,
                 {
                   accessibilityRole: "button",
-                  onPress: () => onPress("103"),
+                  onPress: () => onPress(brandNameSlotId),
                   onPressIn: handlePressIn,
                   onPressOut: handlePressOut,
                   children: /* @__PURE__ */ jsx25(
@@ -3514,15 +3922,23 @@ function FeedBannerAdView({
                   )
                 }
               ),
-              isAdBadgeEnabled ? /* @__PURE__ */ jsx25(Text2, { allowFontScaling: false, numberOfLines: 1, style: [styles.adBadge, { color: colors4.adBadge }], children: "\uAD11\uACE0" }) : null
+              isAdBadgeEnabled ? /* @__PURE__ */ jsx25(
+                Text2,
+                {
+                  allowFontScaling: false,
+                  numberOfLines: 1,
+                  style: [styles.adBadge, { color: colors4.adBadge, paddingLeft: adBadgePaddingLeft }],
+                  children: adBadgeText
+                }
+              ) : null
             ] })
           ] }),
-          /* @__PURE__ */ jsxs11(View7, { style: styles.textArea, children: [
+          showTextArea ? /* @__PURE__ */ jsxs11(View7, { style: styles.textArea, children: [
             /* @__PURE__ */ jsx25(
               Pressable2,
               {
                 accessibilityRole: "button",
-                onPress: () => onPress("101"),
+                onPress: () => onPress(titleSlotId),
                 onPressIn: handlePressIn,
                 onPressOut: handlePressOut,
                 children: /* @__PURE__ */ jsx25(Text2, { allowFontScaling: false, style: [styles.title, { color: colors4.title }], children: title })
@@ -3532,23 +3948,26 @@ function FeedBannerAdView({
               Pressable2,
               {
                 accessibilityRole: "button",
-                onPress: () => onPress("102"),
+                onPress: () => onPress(subtitleSlotId),
                 onPressIn: handlePressIn,
                 onPressOut: handlePressOut,
                 children: /* @__PURE__ */ jsx25(Text2, { allowFontScaling: false, style: [styles.subtitle, { color: colors4.subtitle }], children: subtitle })
               }
             )
-          ] })
+          ] }) : null
         ] }),
         /* @__PURE__ */ jsxs11(View7, { style: styles.card, children: [
           /* @__PURE__ */ jsx25(
             Pressable2,
             {
               accessibilityRole: "button",
-              onPress: () => onPress("201"),
+              onPress: () => onPress(mainImageSlotId),
               onPressIn: handlePressIn,
               onPressOut: handlePressOut,
-              style: styles.imageButton,
+              style: [
+                styles.imageButton,
+                imageButtonBackgroundColor ? { backgroundColor: imageButtonBackgroundColor } : null
+              ],
               children: /* @__PURE__ */ jsx25(View7, { style: styles.imageContainer, children: mainImageUri ? /* @__PURE__ */ jsx25(Image2, { source: { uri: mainImageUri }, style: styles.mainImage, resizeMode: "cover" }) : null })
             }
           ),
@@ -3556,7 +3975,7 @@ function FeedBannerAdView({
             Pressable2,
             {
               accessibilityRole: "button",
-              onPress: () => onPress("0"),
+              onPress: () => onPress(ctaButtonSlotId),
               onPressIn: handlePressIn,
               onPressOut: handlePressOut,
               style: [styles.cta, { backgroundColor: resolvedCtaBackground }],
@@ -3566,7 +3985,18 @@ function FeedBannerAdView({
               ]
             }
           ),
-          /* @__PURE__ */ jsx25(View7, { style: [styles.cardOverlay, { borderColor: colors4.imageOverlayBorder }] })
+          /* @__PURE__ */ jsx25(
+            View7,
+            {
+              style: [
+                styles.cardOverlay,
+                {
+                  borderColor: colors4.imageOverlayBorder,
+                  borderWidth: cardOverlayBorderWidth ?? styles.cardOverlay.borderWidth
+                }
+              ]
+            }
+          )
         ] }),
         adClearanceText ? /* @__PURE__ */ jsx25(Text2, { allowFontScaling: false, style: [styles.adClearance, { color: colors4.adClearance }], children: adClearanceText }) : null
       ] })
@@ -3696,8 +4126,12 @@ var SQUIRCLE_PATH = "M0 17.352C0 3.564 3.564 0 17.352 0H18.648C32.436 0 36 3.564
 function ListBannerAdView({
   title,
   subtitle,
+  titleSlotId,
+  subtitleSlotId,
+  iconImageSlotId,
   adClearanceText,
   adClearanceFontSize,
+  adClearancePaddingRight,
   imageUri,
   paddingStyle,
   colors: colors4,
@@ -3733,7 +4167,7 @@ function ListBannerAdView({
             Pressable3,
             {
               accessibilityRole: "button",
-              onPress: () => onPress("202"),
+              onPress: () => onPress(iconImageSlotId),
               onPressIn: handlePressIn,
               onPressOut: handlePressOut,
               style: styles2.iconWrapper,
@@ -3768,7 +4202,7 @@ function ListBannerAdView({
               Pressable3,
               {
                 accessibilityRole: "button",
-                onPress: () => onPress("101"),
+                onPress: () => onPress(titleSlotId),
                 onPressIn: handlePressIn,
                 onPressOut: handlePressOut,
                 children: /* @__PURE__ */ jsx26(Text3, { allowFontScaling: false, style: [styles2.title, { color: colors4.title }], children: title })
@@ -3778,7 +4212,7 @@ function ListBannerAdView({
               Pressable3,
               {
                 accessibilityRole: "button",
-                onPress: () => onPress("102"),
+                onPress: () => onPress(subtitleSlotId),
                 onPressIn: handlePressIn,
                 onPressOut: handlePressOut,
                 children: /* @__PURE__ */ jsx26(Text3, { allowFontScaling: false, style: [styles2.subtitle, { color: colors4.subtitle }], children: subtitle })
@@ -3795,7 +4229,8 @@ function ListBannerAdView({
               {
                 color: colors4.adClearance,
                 fontSize: adClearanceFontSize,
-                lineHeight: adClearanceFontSize * 1.2
+                lineHeight: adClearanceFontSize * 1.2,
+                paddingRight: adClearancePaddingRight
               }
             ],
             children: adClearanceText
@@ -3907,12 +4342,12 @@ function buildBannerEventPayload(slotId, adGroupId, ad) {
     }
   };
 }
-function buildBannerErrorPayload(slotId, adGroupId, error) {
+function buildBannerErrorPayload(slotId, adGroupId, error, mediationId) {
   return {
     slotId,
     adGroupId,
     adMetadata: {},
-    error
+    error: mediationId ? { ...error, mediationId } : error
   };
 }
 function buildNoFillPayload(slotId, adGroupId) {
@@ -3925,44 +4360,6 @@ function buildNoFillPayload(slotId, adGroupId) {
 
 // src/ads/inlineAd/InlineAd.tsx
 import { jsx as jsx27, jsxs as jsxs13 } 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,
@@ -4040,8 +4437,6 @@ function InlineAd(props) {
   const resolvedTheme = selectedTheme === "auto" ? colorScheme === "dark" ? "dark" : "light" : selectedTheme;
   const resolvedTone = tone ?? DEFAULT_INLINE_AD_TONE;
   const resolvedVariant = variant ?? DEFAULT_INLINE_AD_VARIANT;
-  const colors4 = themePalette[resolvedTheme];
-  const feedColors = feedThemePalette[resolvedTheme];
   const backgroundColor = resolvedTone === "grey" ? resolvedTheme === "dark" ? "#101013" : "#f2f4f7" : resolvedTheme === "dark" ? "#17171c" : "#ffffff";
   callbacksRef.current = {
     onAdRendered,
@@ -4063,35 +4458,43 @@ function InlineAd(props) {
   }, []);
   useEffect14(() => {
     const normalizedAdGroupId = normalizeAdGroupId(adGroupId);
+    const emitFailure = (error, responseContext) => {
+      callbacksRef.current.onAdFailedToRender?.(
+        buildBannerErrorPayload(slotIdRef.current, normalizedAdGroupId, error, responseContext?.mediationId)
+      );
+      trackBannerError({
+        errorCode: error.code,
+        errorMessage: error.message,
+        adGroupId: normalizedAdGroupId,
+        mediationId: responseContext?.mediationId,
+        eventContextToken: responseContext?.eventContextToken,
+        endpointError: responseContext?.errorEndpoint
+      });
+    };
     const loadAdRequest = () => {
       if (loadingRef.current) {
         return;
       }
       if (normalizedAdGroupId.length === 0) {
-        const error = createError2(ERROR_CODES.INVALID_SPACE, INVALID_AD_GROUP_ID_ERROR_MESSAGE);
-        callbacksRef.current.onAdFailedToRender?.(
-          buildBannerErrorPayload(slotIdRef.current, normalizedAdGroupId, error)
-        );
+        emitFailure(createError2(ERROR_CODES.INVALID_SPACE, INVALID_AD_GROUP_ID_ERROR_MESSAGE));
         return;
       }
       loadingRef.current = true;
       loadAd(normalizedAdGroupId).then((result) => {
         if (!isMountedRef.current) return;
+        const responseContext = extractAdTrackingContext(result.response);
+        void fireResultTracking(result, normalizedAdGroupId, responseContext);
         if (result.type === "noFill") {
           callbacksRef.current.onNoFill?.(buildNoFillPayload(slotIdRef.current, normalizedAdGroupId));
           return;
         }
         if (result.type === "error") {
-          callbacksRef.current.onAdFailedToRender?.(
-            buildBannerErrorPayload(slotIdRef.current, normalizedAdGroupId, result.error)
-          );
+          emitFailure(result.error, responseContext);
           return;
         }
         if (!isValidCreative(result.ad)) {
           const invalidError = createError2(ERROR_CODES.INTERNAL_ERROR, "Invalid creative payload");
-          callbacksRef.current.onAdFailedToRender?.(
-            buildBannerErrorPayload(slotIdRef.current, normalizedAdGroupId, invalidError)
-          );
+          emitFailure(invalidError, responseContext);
           return;
         }
         if (result.responseExt?.refetchSeconds !== void 0) {
@@ -4108,21 +4511,29 @@ function InlineAd(props) {
         }
         const payload = buildBannerEventPayload(slotIdRef.current, normalizedAdGroupId, result.ad);
         eventPayloadRef.current = payload;
+        const reportEventTrackingFailure = (failedUrls) => trackBannerError({
+          errorCode: ERROR_CODES.NETWORK_ERROR,
+          errorMessage: `eventTracking delivery failed (${failedUrls.length})`,
+          adGroupId: normalizedAdGroupId,
+          mediationId: responseContext.mediationId,
+          eventContextToken: responseContext.eventContextToken,
+          endpointError: responseContext.errorEndpoint
+        });
         eventTrackerRef.current = new EventTracker(
           result.ad.eventTrackingUrls ?? [],
           result.ad.eventTypes ?? [],
           result.ad.eventPayload ?? "",
           result.requestId,
-          result.ad.creative?.id
+          result.ad.creative?.id,
+          void 0,
+          reportEventTrackingFailure
         );
         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, normalizedAdGroupId, adError)
-        );
+        emitFailure(adError);
       }).finally(() => {
         loadingRef.current = false;
       });
@@ -4161,7 +4572,9 @@ function InlineAd(props) {
   }
   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 listBannerConfig = resolveListBannerRenderConfig(ad.creativeVersion, resolvedTheme);
+  const feedBannerConfig = resolveFeedBannerRenderConfig(ad.creativeVersion, resolvedTheme);
+  const defaultPaddingValue = resolvedStyleId === LIST_BANNER_STYLE_ID ? listBannerConfig.defaultPaddingValue : feedBannerConfig.defaultPaddingValue;
   const paddingStyle = resolvePaddingStyle(defaultPaddingValue);
   const isListBanner = String(resolvedStyleId) === LIST_BANNER_STYLE_ID;
   const isFeedBanner = String(resolvedStyleId) === FEED_BANNER_STYLE_ID;
@@ -4257,11 +4670,15 @@ function InlineAd(props) {
                   {
                     title: listCreative.title,
                     subtitle: subtitleText,
+                    titleSlotId: listBannerConfig.titleSlotId,
+                    subtitleSlotId: listBannerConfig.subtitleSlotId,
+                    iconImageSlotId: listBannerConfig.iconImageSlotId,
                     adClearanceText,
                     adClearanceFontSize,
+                    adClearancePaddingRight: listBannerConfig.adClearancePaddingRight,
                     imageUri,
                     paddingStyle,
-                    colors: colors4,
+                    colors: listBannerConfig.colors,
                     onPress: handleClick
                   }
                 ) : null,
@@ -4270,6 +4687,12 @@ function InlineAd(props) {
                   {
                     brandName: feedCreative.brandName,
                     brandLogoUri,
+                    brandImageSlotId: feedBannerConfig.brandImageSlotId,
+                    brandNameSlotId: feedBannerConfig.brandNameSlotId,
+                    titleSlotId: feedBannerConfig.titleSlotId,
+                    subtitleSlotId: feedBannerConfig.subtitleSlotId,
+                    mainImageSlotId: feedBannerConfig.mainImageSlotId,
+                    ctaButtonSlotId: feedBannerConfig.ctaButtonSlotId,
                     title: feedCreative.title,
                     subtitle: feedCreative.subTitle,
                     mainImageUri,
@@ -4277,7 +4700,12 @@ function InlineAd(props) {
                     ctaTextColor: feedCreative.ctaTextColor,
                     ctaBackgroundColor: feedCreative.ctaBackgroundColor,
                     adClearanceText,
-                    colors: feedColors,
+                    adBadgeText: feedBannerConfig.adBadgeText,
+                    showTextArea: feedBannerConfig.showTextArea,
+                    adBadgePaddingLeft: feedBannerConfig.adBadgePaddingLeft,
+                    imageButtonBackgroundColor: feedBannerConfig.imageButtonBackgroundColor,
+                    cardOverlayBorderWidth: feedBannerConfig.cardOverlayBorderWidth,
+                    colors: feedBannerConfig.colors,
                     isAdBadgeEnabled,
                     paddingStyle,
                     onPress: handleClick