feat: 추가 component viewer

layers/middleware/init.route.global.ts

@@ -53,8 +53,8 @@ export default defineNuxtRouteMiddleware(async (to, _from) => {
     // await getGameDataExternal(req)
 
 
-    // error 페이지는 API 호출하지 않음
-    if (pageUrl === '/error' || to.path.includes('/error') || to.path.includes('/inspection')) {
+    // error 페이지 및 특수 페이지는 API 호출하지 않음
+    if (pageUrl === '/error' || to.path.includes('/error') || to.path.includes('/inspection') || to.path.includes('components-viewer')) {
       return
     }
 

layers/middleware/pageData.global.ts

@@ -27,11 +27,18 @@ export default defineNuxtRouteMiddleware(async (to, _from) => {
   )
 
   try {
+    // 점검 페이지 예외 처리
     if (to.path.includes('inspection')) {
       console.log('🚀 ~ 점검페이지 접근 pageData.global')
       return
     }
 
+    // 컴포넌트 뷰어 페이지 예외 처리
+    if (to.path.includes('components-viewer')) {
+      console.log('🚀 ~ 컴포넌트 뷰어 페이지 접근 pageData.global')
+      return
+    }
+
     const pageUrl = getPathAfterLanguage(to.path)
     console.log("🚀 ~ pageUrl:", pageUrl)
 

layers/server/middleware/gameData.ts

@@ -215,6 +215,13 @@ export default defineEventHandler(async event => {
     return
   }
 
+  // 1-3. /components-viewer 페이지 패스 (개발용 컴포넌트 뷰어)
+  if (fullPath.includes('components-viewer')) {
+    // 최소한의 gameData 설정 (컴포넌트 뷰어는 gameData 불필요)
+    event.context.gameData = initGameData?.value || null
+    return
+  }
+
   // 정적 자산, API, 파비콘 등은 제외하고 페이지 요청만 처리
   if (
     fullPath.startsWith('/api/') ||

layers/types/components/button.ts

@@ -9,6 +9,6 @@ export type DownloadButtonType = 'default' | 'single' | 'duplication' | 'custom'
 
 export type ButtonSize = 'large' | 'medium' | 'small' | 'extra-small'
 
-export type ButtonVariant = 'filled' | 'outlined'
+export type ButtonVariant = 'filled' | 'outlined' | 'text' | 'ghost'
 
 export type Platform = 'google_play' | 'app_store' | 'pc' | 'stove'

public/images/common/btn_system_play.svg

@@ -0,0 +1,10 @@
+<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+<foreignObject x="0" y="0" width="100" height="100"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(5px);clip-path:url(#bgblur_0_3299_15025_clip_path);height:100%;width:100%"></div></foreignObject><g data-figma-bg-blur-radius="10">
+<circle cx="50" cy="50" r="40" fill="black" fill-opacity="0.5"/>
+<circle cx="50" cy="50" r="39.5" stroke="white" stroke-opacity="0.5"/>
+</g>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M48.4839 59.0812C46.7639 60.0629 45.079 60.9852 43.4291 61.8405C42.4954 62.3239 41.4072 61.6545 41.337 60.5612C41.2106 58.62 41.1193 56.6119 41.0632 54.5443C41.0211 53.0568 41 51.5396 41 50C41 48.4604 41.0211 46.9506 41.0632 45.4557C41.1193 43.3881 41.2106 41.38 41.337 39.4388C41.4072 38.3455 42.4954 37.6761 43.4291 38.1595C45.079 39.0149 46.7709 39.9371 48.4839 40.9188C49.7196 41.6254 50.9692 42.3617 52.2259 43.1352C53.4826 43.9087 54.7112 44.6822 55.9047 45.4631C57.5686 46.549 59.1622 47.6349 60.6857 48.7208C61.5492 49.3306 61.5492 50.6694 60.6857 51.2793C59.1622 52.3651 57.5615 53.4584 55.9047 54.5369C54.7112 55.3178 53.4826 56.0987 52.2259 56.8648C50.9692 57.6383 49.7196 58.3672 48.4839 59.0812Z" fill="white" fill-opacity="0.5"/>
+<defs>
+<clipPath id="bgblur_0_3299_15025_clip_path" transform="translate(0 0)"><circle cx="50" cy="50" r="40"/>
+</clipPath></defs>
+</svg>