@adstage/web-sdk 1.1.0 → 1.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -1,5 +1,3 @@
1
- import require$$0, { createContext, useState, useEffect, useContext, useRef, useMemo, Component, useCallback } from 'react';
2
-
3
1
  // 광고 타입 정의
4
2
  var AdType;
5
3
  (function (AdType) {
@@ -1662,357 +1660,135 @@ class SDKUtils {
1662
1660
  }
1663
1661
  }
1664
1662
 
1665
- var jsxRuntime = {exports: {}};
1666
-
1667
- var reactJsxRuntime_production_min = {};
1668
-
1669
1663
  /**
1670
- * @license React
1671
- * react-jsx-runtime.production.min.js
1672
- *
1673
- * Copyright (c) Facebook, Inc. and its affiliates.
1674
- *
1675
- * This source code is licensed under the MIT license found in the
1676
- * LICENSE file in the root directory of this source tree.
1664
+ * AdStage SDK Standalone API
1665
+ * 간단하고 직관적인 사용을 위한 통합 API
1677
1666
  */
1678
-
1679
- var hasRequiredReactJsxRuntime_production_min;
1680
-
1681
- function requireReactJsxRuntime_production_min () {
1682
- if (hasRequiredReactJsxRuntime_production_min) return reactJsxRuntime_production_min;
1683
- hasRequiredReactJsxRuntime_production_min = 1;
1684
- var f=require$$0,k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};
1685
- function q(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=""+g);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(h=a.ref);for(b in a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return {$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}reactJsxRuntime_production_min.Fragment=l;reactJsxRuntime_production_min.jsx=q;reactJsxRuntime_production_min.jsxs=q;
1686
- return reactJsxRuntime_production_min;
1687
- }
1688
-
1689
- {
1690
- jsxRuntime.exports = requireReactJsxRuntime_production_min();
1691
- }
1692
-
1693
- var jsxRuntimeExports = jsxRuntime.exports;
1694
-
1695
- const AdStageContext = createContext({
1696
- sdk: null,
1697
- isLoading: true,
1698
- error: null,
1699
- isInitialized: false,
1700
- });
1701
- const AdStageProvider = ({ config, children, autoInit = true, }) => {
1702
- const [sdk, setSdk] = useState(null);
1703
- const [isLoading, setIsLoading] = useState(true);
1704
- const [error, setError] = useState(null);
1705
- const [isInitialized, setIsInitialized] = useState(false);
1706
- useEffect(() => {
1707
- const initializeSDK = async () => {
1708
- try {
1709
- setIsLoading(true);
1710
- setError(null);
1711
- // Dynamic import를 사용해서 circular dependency 방지
1712
- const { AdStageSDK } = await Promise.resolve().then(function () { return index; });
1713
- // SDK 인스턴스 생성
1714
- const sdkInstance = AdStageSDK.init(config);
1715
- setSdk(sdkInstance);
1716
- setIsInitialized(true);
1717
- setIsLoading(false);
1718
- }
1719
- catch (err) {
1720
- const errorMessage = err instanceof Error ? err.message : 'SDK 초기화 중 오류가 발생했습니다.';
1721
- setError(errorMessage);
1722
- setIsLoading(false);
1723
- console.error('AdStage SDK initialization failed:', err);
1724
- }
1725
- };
1726
- initializeSDK();
1727
- }, [config.apiKey, config.debug, autoInit]);
1728
- const value = {
1729
- sdk,
1730
- isLoading,
1731
- error,
1732
- isInitialized,
1733
- };
1734
- return (jsxRuntimeExports.jsx(AdStageContext.Provider, { value: value, children: children }));
1735
- };
1736
-
1667
+ let globalSDKInstance = null;
1668
+ let isInitializing = false;
1737
1669
  /**
1738
- * AdStage SDK 인스턴스에 접근하기 위한 Hook
1739
- * AdStageProvider 내부에서만 사용 가능
1670
+ * SDK 초기화 (한 번만 호출)
1740
1671
  */
1741
- const useAdStage = () => {
1742
- const context = useContext(AdStageContext);
1743
- if (!context) {
1744
- throw new Error('useAdStage must be used within an AdStageProvider');
1672
+ async function initAdStage(config) {
1673
+ if (globalSDKInstance) {
1674
+ console.warn('AdStage SDK가 이미 초기화되었습니다.');
1675
+ return;
1676
+ }
1677
+ if (isInitializing) {
1678
+ console.warn('AdStage SDK 초기화가 진행 중입니다.');
1679
+ return;
1680
+ }
1681
+ isInitializing = true;
1682
+ try {
1683
+ // 동적 import로 circular dependency 방지
1684
+ const { AdStageSDK } = await Promise.resolve().then(function () { return index; });
1685
+ globalSDKInstance = AdStageSDK.init({
1686
+ apiKey: config.apiKey,
1687
+ debug: config.debug || false
1688
+ });
1689
+ console.log('✅ AdStage SDK 초기화 완료');
1745
1690
  }
1746
- return context;
1747
- };
1748
-
1749
- /**
1750
- * 범용 광고 슬롯 컴포넌트
1751
- * 모든 광고 타입을 지원하며 SSR 환경에서도 안전하게 동작
1752
- */
1753
- const AdSlot = ({ slotId, adType, width, height, className, style, autoSlideInterval = 3, sliderEffect = 'slide', language, deviceType, country, }) => {
1754
- const containerRef = useRef(null);
1755
- const { sdk, isLoading, error } = useAdStage();
1756
- const containerId = useMemo(() => `adstage-${slotId}`, [slotId]);
1757
- useEffect(() => {
1758
- if (!sdk || !containerRef.current || isLoading || error) {
1759
- return;
1760
- }
1761
- // 컨테이너에 ID 설정
1762
- containerRef.current.id = containerId;
1763
- // 광고 슬롯 생성
1764
- const createSlot = async () => {
1765
- try {
1766
- await sdk.createSlot(slotId, containerId, adType, {
1767
- width,
1768
- height,
1769
- language,
1770
- deviceType,
1771
- country,
1772
- autoSlideInterval,
1773
- sliderEffect,
1774
- });
1775
- }
1776
- catch (err) {
1777
- console.error(`Failed to create ad slot ${slotId}:`, err);
1778
- }
1779
- };
1780
- createSlot();
1781
- // 클린업 함수
1782
- return () => {
1783
- // SDK에 removeSlot 메서드가 없으므로 DOM 정리만 수행
1784
- if (containerRef.current) {
1785
- containerRef.current.innerHTML = '';
1786
- }
1787
- };
1788
- }, [
1789
- sdk,
1790
- slotId,
1791
- containerId,
1792
- adType,
1793
- width,
1794
- height,
1795
- language,
1796
- deviceType,
1797
- country,
1798
- autoSlideInterval,
1799
- sliderEffect,
1800
- isLoading,
1801
- error,
1802
- ]);
1803
- const containerStyle = {
1804
- width: typeof width === 'number' ? `${width}px` : width,
1805
- height: typeof height === 'number' ? `${height}px` : height,
1806
- ...style,
1807
- };
1808
- // 로딩 상태 표시
1809
- if (isLoading) {
1810
- return (jsxRuntimeExports.jsx("div", { className: className, style: {
1811
- ...containerStyle,
1812
- display: 'flex',
1813
- alignItems: 'center',
1814
- justifyContent: 'center',
1815
- backgroundColor: '#f5f5f5',
1816
- border: '1px dashed #ccc',
1817
- color: '#999',
1818
- }, children: "Loading Ad..." }));
1819
- }
1820
- // 에러 상태 표시
1821
- if (error) {
1822
- return (jsxRuntimeExports.jsx("div", { className: className, style: {
1823
- ...containerStyle,
1824
- display: 'flex',
1825
- alignItems: 'center',
1826
- justifyContent: 'center',
1827
- backgroundColor: '#fee',
1828
- border: '1px solid #fcc',
1829
- color: '#c00',
1830
- }, children: "Ad Load Error" }));
1831
- }
1832
- return (jsxRuntimeExports.jsx("div", { ref: containerRef, className: className, style: containerStyle }));
1833
- };
1834
-
1691
+ catch (error) {
1692
+ console.error('❌ AdStage SDK 초기화 실패:', error);
1693
+ throw error;
1694
+ }
1695
+ finally {
1696
+ isInitializing = false;
1697
+ }
1698
+ }
1835
1699
  /**
1836
- * 배너 광고 전용 컴포넌트
1837
- * AdSlot의 래퍼로 adType이 BANNER로 고정됨
1700
+ * 배너 광고 생성 (가장 간단한 API)
1838
1701
  */
1839
- const BannerAd = (props) => {
1840
- return jsxRuntimeExports.jsx(AdSlot, { ...props, adType: AdType.BANNER });
1841
- };
1842
-
1702
+ async function createBanner(containerId, options) {
1703
+ if (!globalSDKInstance) {
1704
+ throw new Error('AdStage SDK가 초기화되지 않았습니다. initAdStage()를 먼저 호출하세요.');
1705
+ }
1706
+ const slotId = `banner-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
1707
+ return globalSDKInstance.createSlot(slotId, containerId, 'BANNER', {
1708
+ width: options?.width || '100%',
1709
+ height: options?.height || 120,
1710
+ autoSlideInterval: options?.autoSlide ? (options.slideInterval || 5) : 0,
1711
+ sliderEffect: 'fade'
1712
+ });
1713
+ }
1843
1714
  /**
1844
- * 텍스트 광고 전용 컴포넌트
1845
- * AdSlot의 래퍼로 adType이 TEXT로 고정됨
1715
+ * 텍스트 광고 생성
1846
1716
  */
1847
- const TextAd = (props) => {
1848
- return jsxRuntimeExports.jsx(AdSlot, { ...props, adType: AdType.TEXT });
1849
- };
1850
-
1717
+ async function createTextAd(containerId, options) {
1718
+ if (!globalSDKInstance) {
1719
+ throw new Error('AdStage SDK가 초기화되지 않았습니다.');
1720
+ }
1721
+ const slotId = `text-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
1722
+ return globalSDKInstance.createSlot(slotId, containerId, 'TEXT', {
1723
+ maxLines: options?.maxLines || 3,
1724
+ style: options?.style || 'card'
1725
+ });
1726
+ }
1851
1727
  /**
1852
- * 네이티브 광고 전용 컴포넌트
1853
- * AdSlot의 래퍼로 adType이 NATIVE로 고정됨
1728
+ * 비디오 광고 생성
1854
1729
  */
1855
- const NativeAd = (props) => {
1856
- return jsxRuntimeExports.jsx(AdSlot, { ...props, adType: AdType.NATIVE });
1857
- };
1858
-
1730
+ async function createVideoAd(containerId, options) {
1731
+ if (!globalSDKInstance) {
1732
+ throw new Error('AdStage SDK가 초기화되지 않았습니다.');
1733
+ }
1734
+ const slotId = `video-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
1735
+ return globalSDKInstance.createSlot(slotId, containerId, 'VIDEO', {
1736
+ width: options?.width || '100%',
1737
+ height: options?.height || 300,
1738
+ autoplay: options?.autoplay || false,
1739
+ muted: options?.muted || true
1740
+ });
1741
+ }
1859
1742
  /**
1860
- * 비디오 광고 전용 컴포넌트
1861
- * AdSlot의 래퍼로 adType이 VIDEO로 고정됨
1743
+ * 커스텀 이벤트 추적
1862
1744
  */
1863
- const VideoAd = (props) => {
1864
- return jsxRuntimeExports.jsx(AdSlot, { ...props, adType: AdType.VIDEO });
1865
- };
1866
-
1745
+ function trackEvent(eventName, params) {
1746
+ if (!globalSDKInstance) {
1747
+ console.warn('AdStage SDK가 초기화되지 않았습니다. 이벤트 추적을 건너뜁니다.');
1748
+ return;
1749
+ }
1750
+ try {
1751
+ globalSDKInstance.trackEvent(eventName, {
1752
+ timestamp: new Date().toISOString(),
1753
+ ...params
1754
+ });
1755
+ console.log(`📊 이벤트 추적: ${eventName}`, params);
1756
+ }
1757
+ catch (error) {
1758
+ console.error('이벤트 추적 실패:', error);
1759
+ }
1760
+ }
1867
1761
  /**
1868
- * 인터스티셜 광고 전용 컴포넌트
1869
- * AdSlot의 래퍼로 adType이 INTERSTITIAL로 고정됨
1762
+ * SDK 상태 확인
1870
1763
  */
1871
- const InterstitialAd = (props) => {
1872
- return jsxRuntimeExports.jsx(AdSlot, { ...props, adType: AdType.INTERSTITIAL });
1873
- };
1874
-
1764
+ function isAdStageReady() {
1765
+ return globalSDKInstance !== null && !isInitializing;
1766
+ }
1875
1767
  /**
1876
- * 광고 컴포넌트에서 발생하는 오류를 포착하는 Error Boundary
1877
- * 광고 로딩 실패 시 fallback UI를 표시하고 앱 전체가 크래시되는 것을 방지
1768
+ * SDK 인스턴스 가져오기 (고급 사용자용)
1878
1769
  */
1879
- class AdErrorBoundary extends Component {
1880
- constructor(props) {
1881
- super(props);
1882
- this.state = { hasError: false, error: null };
1883
- }
1884
- static getDerivedStateFromError(error) {
1885
- return { hasError: true, error };
1886
- }
1887
- componentDidCatch(error, errorInfo) {
1888
- console.error('AdStage Error Boundary caught an error:', error, errorInfo);
1889
- // 사용자 정의 에러 핸들러 호출
1890
- if (this.props.onError) {
1891
- this.props.onError(error, errorInfo);
1892
- }
1893
- }
1894
- render() {
1895
- if (this.state.hasError) {
1896
- // 사용자 정의 fallback이 있으면 사용, 없으면 기본 fallback 표시
1897
- if (this.props.fallback) {
1898
- return this.props.fallback;
1899
- }
1900
- return (jsxRuntimeExports.jsxs("div", { style: {
1901
- padding: '20px',
1902
- textAlign: 'center',
1903
- backgroundColor: '#fee',
1904
- border: '1px solid #fcc',
1905
- borderRadius: '4px',
1906
- color: '#c00',
1907
- }, children: [jsxRuntimeExports.jsx("h3", { children: "\uAD11\uACE0 \uB85C\uB529 \uC624\uB958" }), jsxRuntimeExports.jsx("p", { children: "\uAD11\uACE0\uB97C \uBD88\uB7EC\uC624\uB294 \uC911 \uBB38\uC81C\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4." }), jsxRuntimeExports.jsx("button", { onClick: () => this.setState({ hasError: false, error: null }), style: {
1908
- padding: '8px 16px',
1909
- backgroundColor: '#fff',
1910
- border: '1px solid #ccc',
1911
- borderRadius: '4px',
1912
- cursor: 'pointer',
1913
- }, children: "\uB2E4\uC2DC \uC2DC\uB3C4" })] }));
1914
- }
1915
- return this.props.children;
1770
+ function getAdStageInstance() {
1771
+ if (!globalSDKInstance) {
1772
+ console.warn('AdStage SDK가 초기화되지 않았습니다.');
1773
+ return null;
1916
1774
  }
1775
+ return globalSDKInstance;
1917
1776
  }
1918
-
1919
1777
  /**
1920
- * 광고 슬롯 생성 및 관리를 위한 Hook
1921
- * 컴포넌트에서 직접 슬롯을 제어하고 싶을 때 사용
1778
+ * SDK 초기화 해제 (필요시)
1922
1779
  */
1923
- const useAdSlot = (options) => {
1924
- const { sdk } = useAdStage();
1925
- const [isLoading, setIsLoading] = useState(false);
1926
- const [error, setError] = useState(null);
1927
- const [isCreated, setIsCreated] = useState(false);
1928
- const createSlot = async () => {
1929
- if (!sdk) {
1930
- setError('SDK not initialized');
1931
- return;
1932
- }
1933
- setIsLoading(true);
1934
- setError(null);
1780
+ function destroyAdStage() {
1781
+ if (globalSDKInstance) {
1935
1782
  try {
1936
- await sdk.createSlot(options.slotId, options.containerId, options.adType, {
1937
- width: options.width,
1938
- height: options.height,
1939
- language: options.language,
1940
- deviceType: options.deviceType,
1941
- country: options.country,
1942
- autoSlideInterval: options.autoSlideInterval,
1943
- sliderEffect: options.sliderEffect,
1944
- });
1945
- setIsCreated(true);
1946
- }
1947
- catch (err) {
1948
- const errorMessage = err instanceof Error ? err.message : '슬롯 생성 중 오류가 발생했습니다.';
1949
- setError(errorMessage);
1950
- setIsCreated(false);
1951
- }
1952
- finally {
1953
- setIsLoading(false);
1954
- }
1955
- };
1956
- const resetSlot = () => {
1957
- setIsLoading(false);
1958
- setError(null);
1959
- setIsCreated(false);
1960
- };
1961
- // SDK가 변경되면 상태 초기화
1962
- useEffect(() => {
1963
- resetSlot();
1964
- }, [sdk]);
1965
- return {
1966
- isLoading,
1967
- error,
1968
- isCreated,
1969
- createSlot,
1970
- resetSlot,
1971
- };
1972
- };
1973
-
1974
- /**
1975
- * 광고 이벤트 추적을 위한 Hook
1976
- * 커스텀 이벤트 추적이 필요할 때 사용
1977
- */
1978
- const useAdTracking = () => {
1979
- const { sdk } = useAdStage();
1980
- const trackEvent = useCallback((adId, slotId, eventType) => {
1981
- if (!sdk) {
1982
- console.warn('SDK not initialized - cannot track event');
1983
- return;
1783
+ // SDK cleanup logic here
1784
+ globalSDKInstance = null;
1785
+ console.log('🧹 AdStage SDK 정리 완료');
1984
1786
  }
1985
- try {
1986
- // SDK eventTracker에 직접 접근할 수 없으므로
1987
- // 여기서는 console.log로 대체하거나 SDK에 public 메서드가 있다면 사용
1988
- console.log('Ad Event Tracked:', { adId, slotId, eventType });
1989
- // 실제 구현에서는 SDK에 trackEvent 메서드가 있다면 사용
1990
- // sdk.trackEvent(adId, slotId, eventType);
1991
- }
1992
- catch (err) {
1993
- console.error('Failed to track event:', err);
1994
- }
1995
- }, [sdk]);
1996
- const trackClick = useCallback((adId, slotId) => {
1997
- trackEvent(adId, slotId, AdEventType.CLICK);
1998
- }, [trackEvent]);
1999
- const trackImpression = useCallback((adId, slotId) => {
2000
- trackEvent(adId, slotId, AdEventType.IMPRESSION);
2001
- }, [trackEvent]);
2002
- const trackView = useCallback((adId, slotId) => {
2003
- trackEvent(adId, slotId, AdEventType.VIEWABLE);
2004
- }, [trackEvent]);
2005
- const trackClose = useCallback((adId, slotId) => {
2006
- trackEvent(adId, slotId, AdEventType.COMPLETED);
2007
- }, [trackEvent]);
2008
- return {
2009
- trackEvent,
2010
- trackClick,
2011
- trackImpression,
2012
- trackView,
2013
- trackClose,
2014
- };
2015
- };
1787
+ catch (error) {
1788
+ console.error('SDK 정리 오류:', error);
1789
+ }
1790
+ }
1791
+ }
2016
1792
 
2017
1793
  /**
2018
1794
  * AdStage SDK 메인 클래스
@@ -2265,24 +2041,23 @@ if (DOMUtils.isBrowser()) {
2265
2041
  DOMUtils.waitForDOM().then(autoInit);
2266
2042
  }
2267
2043
  }
2044
+ // React exports (React가 있을 때만 사용 - 레거시)
2045
+ // export * from './react';
2268
2046
 
2269
2047
  var index = /*#__PURE__*/Object.freeze({
2270
2048
  __proto__: null,
2271
- AdErrorBoundary: AdErrorBoundary,
2272
2049
  get AdEventType () { return AdEventType; },
2273
- AdSlot: AdSlot,
2274
- AdStageProvider: AdStageProvider,
2275
2050
  AdStageSDK: AdStageSDK,
2276
2051
  get AdType () { return AdType; },
2277
- BannerAd: BannerAd,
2278
- InterstitialAd: InterstitialAd,
2279
- NativeAd: NativeAd,
2280
- TextAd: TextAd,
2281
- VideoAd: VideoAd,
2052
+ createBanner: createBanner,
2053
+ createTextAd: createTextAd,
2054
+ createVideoAd: createVideoAd,
2282
2055
  default: AdStageSDK,
2283
- useAdSlot: useAdSlot,
2284
- useAdStage: useAdStage,
2285
- useAdTracking: useAdTracking
2056
+ destroyAdStage: destroyAdStage,
2057
+ getAdStageInstance: getAdStageInstance,
2058
+ initAdStage: initAdStage,
2059
+ isAdStageReady: isAdStageReady,
2060
+ trackEvent: trackEvent
2286
2061
  });
2287
2062
 
2288
- export { AdErrorBoundary, AdEventType, AdSlot, AdStageProvider, AdStageSDK, AdType, BannerAd, InterstitialAd, NativeAd, TextAd, VideoAd, AdStageSDK as default, useAdSlot, useAdStage, useAdTracking };
2063
+ export { AdEventType, AdStageSDK, AdType, createBanner, createTextAd, createVideoAd, AdStageSDK as default, destroyAdStage, getAdStageInstance, initAdStage, isAdStageReady, trackEvent };