viewlogic 1.2.3 → 1.2.5

package/dist/viewlogic-router.js

@@ -355,8 +355,7 @@ var AuthManager = class {
       checkAuthFunction: options.checkAuthFunction || null,
       redirectAfterLogin: options.redirectAfterLogin || "home",
       authCookieName: options.authCookieName || "authToken",
-      authStorage: options.authStorage || "localStorage",
-      authSkipValidation: options.authSkipValidation || false
+      authStorage: options.authStorage || "localStorage"
     };
     this.router = router;
     this.eventListeners = /* @__PURE__ */ new Map();
@@ -387,7 +386,12 @@ var AuthManager = class {
     }
     if (typeof this.config.checkAuthFunction === "function") {
       try {
-        const isAuthenticated2 = await this.config.checkAuthFunction(routeName);
+        const route = {
+          name: routeName,
+          $api: this.router.routeLoader.apiHandler.bindToComponent({}),
+          $state: this.router.stateHandler
+        };
+        const isAuthenticated2 = await this.config.checkAuthFunction(route);
         return {
           allowed: isAuthenticated2,
           reason: isAuthenticated2 ? "custom_auth_success" : "custom_auth_failed",
@@ -505,11 +509,10 @@ var AuthManager = class {
     }
     const {
       storage = this.config.authStorage,
-      cookieOptions = this.config.authCookieOptions,
-      skipValidation = this.config.authSkipValidation
+      cookieOptions = this.config.authCookieOptions
     } = options;
     try {
-      if (!skipValidation && !this.isTokenValid(token)) {
+      if (!this.isTokenValid(token)) {
         this.log("warn", "\u274C Token is expired or invalid");
         return false;
       }
@@ -536,7 +539,7 @@ var AuthManager = class {
       });
       return true;
     } catch (error) {
-      this.log("Failed to set token:", error);
+      this.log("error", "Failed to set token:", error);
       return false;
     }
   }
@@ -587,14 +590,14 @@ var AuthManager = class {
         break;
     }
     this.emitAuthEvent("token_removed", { storage });
-    this.log(`Token removed from: ${storage}`);
+    this.log("debug", `Token removed from: ${storage}`);
   }
   /**
    * 로그인 성공 처리
    */
   loginSuccess(targetRoute = null) {
     const redirectRoute = targetRoute || this.config.redirectAfterLogin;
-    this.log(`\u{1F389} Login success, redirecting to: ${redirectRoute}`);
+    this.log("info", `\u{1F389} Login success, redirecting to: ${redirectRoute}`);
     this.emitAuthEvent("login_success", { targetRoute: redirectRoute });
     if (this.router && typeof this.router.navigateTo === "function") {
       this.router.navigateTo(redirectRoute);
@@ -605,7 +608,7 @@ var AuthManager = class {
    * 로그아웃 처리
    */
   logout() {
-    this.log("\u{1F44B} Logging out user");
+    this.log("info", "\u{1F44B} Logging out user");
     this.removeAccessToken();
     this.emitAuthEvent("logout", {});
     if (this.router && typeof this.router.navigateTo === "function") {
@@ -630,11 +633,11 @@ var AuthManager = class {
         try {
           listener(data);
         } catch (error) {
-          this.log("Event listener error:", error);
+          this.log("error", "Event listener error:", error);
         }
       });
     }
-    this.log(`\u{1F514} Auth event emitted: ${eventType}`, data);
+    this.log("debug", `\u{1F514} Auth event emitted: ${eventType}`, data);
   }
   /**
    * 이벤트 리스너 등록
@@ -807,7 +810,7 @@ var CacheManager = class {
     patterns.forEach((pattern) => {
       totalInvalidated += this.deleteByPattern(pattern);
     });
-    this.log(`\u{1F504} Deleted component cache for route: ${routeName} (${totalInvalidated} entries)`);
+    this.log("debug", `\u{1F504} Deleted component cache for route: ${routeName} (${totalInvalidated} entries)`);
     return totalInvalidated;
   }
   /**
@@ -819,7 +822,7 @@ var CacheManager = class {
     componentPatterns.forEach((pattern) => {
       totalCleared += this.deleteByPattern(pattern);
     });
-    this.log(`\u{1F9FD} Deleted all component caches (${totalCleared} entries)`);
+    this.log("debug", `\u{1F9FD} Deleted all component caches (${totalCleared} entries)`);
     return totalCleared;
   }
   /**
@@ -830,7 +833,7 @@ var CacheManager = class {
     this.cache.clear();
     this.cacheTimestamps.clear();
     this.lruOrder = [];
-    this.log(`\u{1F525} Cleared all cache (${size} entries)`);
+    this.log("debug", `\u{1F525} Cleared all cache (${size} entries)`);
     return size;
   }
   /**
@@ -855,7 +858,7 @@ var CacheManager = class {
       }
     });
     if (expiredKeys.length > 0) {
-      this.log(`\u23F1\uFE0F Cleaned ${expiredKeys.length} expired cache entries`);
+      this.log("debug", `\u23F1\uFE0F Cleaned ${expiredKeys.length} expired cache entries`);
     }
     return expiredKeys.length;
   }
@@ -947,7 +950,7 @@ var CacheManager = class {
     this.cleanupInterval = setInterval(() => {
       this.cleanExpired();
     }, interval);
-    this.log(`\u{1F916} Auto cleanup started (interval: ${interval}ms)`);
+    this.log("debug", `\u{1F916} Auto cleanup started (interval: ${interval}ms)`);
   }
   /**
    * 자동 정리 중지
@@ -1169,11 +1172,8 @@ var QueryManager = class {
 var FormHandler = class {
   constructor(router, options = {}) {
     this.router = router;
-    this.config = {
-      debug: options.debug || false,
-      requestTimeout: options.requestTimeout || 3e4,
-      ...options
-    };
+    this.requestTimeout = options.requestTimeout || 3e4;
+    this.uploadTimeout = options.uploadTimeout || 3e5;
     this.log("debug", "FormHandler initialized");
   }
   /**
@@ -1200,11 +1200,13 @@ var FormHandler = class {
   startFormSubmission(form) {
     form._isSubmitting = true;
     form._abortController = new AbortController();
+    const hasFile = Array.from(form.elements).some((el) => el.type === "file" && el.files.length > 0);
+    const timeout = hasFile ? this.uploadTimeout : this.requestTimeout;
     form._timeoutId = setTimeout(() => {
       if (form._isSubmitting) {
         this.abortFormSubmission(form);
       }
-    }, this.config.requestTimeout);
+    }, timeout);
   }
   /**
    * 폼 제출 완료
@@ -1247,9 +1249,9 @@ var FormHandler = class {
     const form = event.target;
     let action = form.getAttribute("action");
     const method = form.getAttribute("method") || "POST";
-    const successHandler = form.getAttribute("data-success-handler");
-    const errorHandler = form.getAttribute("data-error-handler");
-    const loadingHandler = form.getAttribute("data-loading-handler");
+    const successHandler = form.getAttribute("data-success");
+    const errorHandler = form.getAttribute("data-error");
+    const loadingHandler = form.getAttribute("data-loading");
     const redirectTo = form.getAttribute("data-redirect");
     action = this.processActionParams(action, component);
     if (!this.validateForm(form, component)) {
@@ -1408,12 +1410,7 @@ var FormHandler = class {
 var ApiHandler = class {
   constructor(router, options = {}) {
     this.router = router;
-    this.config = {
-      debug: options.debug || false,
-      timeout: options.timeout || 1e4,
-      retries: options.retries || 1,
-      ...options
-    };
+    this.apiBaseURL = options.apiBaseURL || "";
     this.log("debug", "ApiHandler initialized");
   }
   /**
@@ -1430,6 +1427,9 @@ var ApiHandler = class {
   async fetchData(dataURL, component = null, options = {}) {
     try {
       let processedURL = this.processURLParameters(dataURL, component);
+      if (this.apiBaseURL && !this.isAbsoluteURL(processedURL)) {
+        processedURL = this.combineURLs(this.apiBaseURL, processedURL);
+      }
       const queryString = this.router.queryManager?.buildQueryString(this.router.queryManager?.getQueryParams()) || "";
       const fullURL = queryString ? `${processedURL}?${queryString}` : processedURL;
       this.log("debug", `Fetching data from: ${fullURL}`);
@@ -1520,15 +1520,15 @@ var ApiHandler = class {
         const paramName = match.slice(1, -1);
         try {
           let paramValue = null;
-          if (component.getParam) {
-            paramValue = component.getParam(paramName);
+          if (component.$options?.computed?.[paramName]) {
+            paramValue = component[paramName];
           }
           if (paramValue === null || paramValue === void 0) {
             paramValue = component[paramName];
           }
           if (paramValue === null || paramValue === void 0) {
-            if (component.$options?.computed?.[paramName]) {
-              paramValue = component[paramName];
+            if (component.getParam) {
+              paramValue = component.getParam(paramName);
             }
           }
           if (paramValue === null || paramValue === void 0) {
@@ -1582,6 +1582,20 @@ var ApiHandler = class {
       fetchMultipleData: (dataConfig) => this.fetchMultipleData(dataConfig, component)
     };
   }
+  /**
+   * 절대 URL인지 확인
+   */
+  isAbsoluteURL(url) {
+    return /^https?:\/\//.test(url) || url.startsWith("//");
+  }
+  /**
+   * 두 URL을 조합
+   */
+  combineURLs(baseURL, relativeURL) {
+    const cleanBase = baseURL.replace(/\/$/, "");
+    const cleanRelative = relativeURL.startsWith("/") ? relativeURL : `/${relativeURL}`;
+    return `${cleanBase}${cleanRelative}`;
+  }
   /**
    * 정리 (메모리 누수 방지)
    */
@@ -1597,7 +1611,6 @@ var ComponentLoader = class {
     this.config = {
       componentsPath: options.componentsPath || "/components",
       // srcPath 기준 상대 경로
-      debug: options.debug || false,
       environment: options.environment || "development",
       ...options
     };
@@ -1868,8 +1881,7 @@ var RouteLoader = class {
       // 프로덕션 라우트 경로
       environment: options.environment || "development",
       useLayout: options.useLayout !== false,
-      defaultLayout: options.defaultLayout || "default",
-      debug: options.debug || false
+      defaultLayout: options.defaultLayout || "default"
     };
     this.router = router;
     this.formHandler = new FormHandler(router, this.config);
@@ -2036,6 +2048,7 @@ ${template}`;
           ...originalData,
           currentRoute: routeName,
           $query: router.queryManager?.getQueryParams() || {},
+          $params: router.queryManager?.getRouteParams() || {},
           $lang: (() => {
             try {
               return router.i18nManager?.getCurrentLanguage() || router.config.i18nDefaultLanguage || router.config.defaultLanguage || "ko";
@@ -2057,11 +2070,12 @@ ${template}`;
       },
       async mounted() {
         this.$api = router.routeLoader.apiHandler.bindToComponent(this);
+        this.$state = router.stateHandler;
         if (script.mounted) {
           await script.mounted.call(this);
         }
         if (script.dataURL) {
-          await this.$fetchData();
+          await this.fetchData();
         }
         await this.$nextTick();
         router.routeLoader.formHandler.bindAutoForms(this);
@@ -2083,29 +2097,22 @@ ${template}`;
             return key;
           }
         },
-        // 인증 관련
-        $isAuthenticated: () => router.authManager?.isAuthenticated() || false,
-        $logout: () => router.authManager ? router.navigateTo(router.authManager.logout()) : null,
-        $loginSuccess: (target) => router.authManager ? router.navigateTo(router.authManager.loginSuccess(target)) : null,
-        $checkAuth: (route) => router.authManager ? router.authManager.checkAuthentication(route) : Promise.resolve({ allowed: true, reason: "auth_disabled" }),
-        $getToken: () => router.authManager?.getAccessToken() || null,
-        $setToken: (token, options) => router.authManager?.setAccessToken(token, options) || false,
-        $removeToken: (storage) => router.authManager?.removeAccessToken(storage) || null,
-        $getAuthCookie: () => router.authManager?.getAuthCookie() || null,
-        $getCookie: (name) => router.authManager?.getCookieValue(name) || null,
-        // 상태 관리
-        $state: {
-          get: (key, defaultValue) => router.stateHandler?.get(key, defaultValue),
-          set: (key, value) => router.stateHandler?.set(key, value),
-          has: (key) => router.stateHandler?.has(key) || false,
-          delete: (key) => router.stateHandler?.delete(key) || false,
-          update: (updates) => router.stateHandler?.update(updates),
-          watch: (key, callback) => router.stateHandler?.watch(key, callback),
-          unwatch: (key, callback) => router.stateHandler?.unwatch(key, callback),
-          getAll: () => router.stateHandler?.getAll() || {}
+        // 인증 관련 (핵심 4개 메소드만)
+        isAuth: () => router.authManager?.isAuthenticated() || false,
+        logout: () => router.authManager ? router.navigateTo(router.authManager.logout()) : null,
+        getToken: () => router.authManager?.getAccessToken() || null,
+        setToken: (token, options) => router.authManager?.setAccessToken(token, options) || false,
+        // i18n 언어 관리
+        getLanguage: () => router.i18nManager?.getCurrentLanguage() || router.config.defaultLanguage || "ko",
+        setLanguage: (lang) => router.i18nManager?.setLanguage(lang),
+        // 로깅 및 에러 처리
+        log: (level, ...args) => {
+          if (router.errorHandler) {
+            router.errorHandler.log(level, `[${routeName}]`, ...args);
+          }
         },
         // 데이터 fetch (ApiHandler 래퍼)
-        async $fetchData(dataConfig = null) {
+        async fetchData(dataConfig = null) {
           const configToUse = dataConfig || script.dataURL;
           if (!configToUse) return null;
           this.$dataLoading = true;
@@ -2189,9 +2196,7 @@ ${template}`;
 var ErrorHandler = class {
   constructor(router, options = {}) {
     this.config = {
-      enableErrorReporting: options.enableErrorReporting !== false,
-      debug: options.debug || false,
-      logLevel: options.logLevel || (options.debug ? "debug" : "info"),
+      logLevel: options.logLevel || "info",
       environment: options.environment || "development"
     };
     this.router = router;
@@ -2221,9 +2226,7 @@ var ErrorHandler = class {
       errorMessage = "\uD398\uC774\uC9C0\uC5D0 \uC811\uADFC\uD560 \uAD8C\uD55C\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.";
     }
     this.debug("ErrorHandler", `\uC5D0\uB7EC \uCF54\uB4DC \uACB0\uC815: ${errorCode} (\uB77C\uC6B0\uD2B8: ${routeName})`);
-    if (this.config.enableErrorReporting) {
-      this.reportError(routeName, error, errorCode);
-    }
+    this.reportError(routeName, error, errorCode);
     try {
       if (errorCode === 404) {
         await this.load404Page();
@@ -2394,7 +2397,7 @@ var ErrorHandler = class {
     if (typeof level !== "string" || !this.logLevels.hasOwnProperty(level)) {
       args = [component, ...args];
       component = level;
-      level = this.config.debug ? "debug" : "info";
+      level = "info";
     }
     const currentLevelValue = this.logLevels[this.config.logLevel] || this.logLevels.info;
     const messageLevelValue = this.logLevels[level] || this.logLevels.info;
@@ -2635,6 +2638,9 @@ var ViewLogicRouter = class {
       i18nPath: "/i18n",
       // 다국어 파일 경로
       logLevel: "info",
+      apiBaseURL: "",
+      requestTimeout: 3e4,
+      uploadTimeout: 3e5,
       authEnabled: false,
       loginRoute: "login",
       protectedRoutes: [],
@@ -2643,8 +2649,7 @@ var ViewLogicRouter = class {
       checkAuthFunction: null,
       redirectAfterLogin: "home",
       authCookieName: "authToken",
-      authStorage: "localStorage",
-      authSkipValidation: false
+      authStorage: "localStorage"
     };
     const config = { ...defaults, ...options };
     config.srcPath = this.resolvePath(config.srcPath, config.basePath);
@@ -2653,49 +2658,42 @@ var ViewLogicRouter = class {
     return config;
   }
   /**
-   * 통합 경로 해결 - 서브폴더 배포 및 basePath 지원
+   * 두 경로를 안전하게 조합 및 정규화 (기본 유틸리티)
+   * @param {string} basePath - 기본 경로
+   * @param {string} relativePath - 상대 경로
+   * @returns {string} 조합된 경로 (예: '/examples' + '/about' → '/examples/about')
+   */
+  combinePaths(basePath, relativePath) {
+    if (!basePath || basePath === "/") {
+      return relativePath.replace(/\/+/g, "/");
+    }
+    const cleanBase = basePath.endsWith("/") ? basePath.slice(0, -1) : basePath;
+    const cleanRelative = relativePath.startsWith("/") ? relativePath : `/${relativePath}`;
+    const combined = `${cleanBase}${cleanRelative}`;
+    return combined.replace(/\/+/g, "/");
+  }
+  /**
+   * 상대 경로를 완전한 절대 URL로 변환 (파일 시스템 전용)
+   * @param {string} path - 변환할 경로
+   * @param {string} basePath - 기본 경로 (옵션)
+   * @returns {string} 완전한 절대 URL (예: 'http://localhost:3000/examples/about')
    */
   resolvePath(path, basePath = null) {
+    if (basePath === null) {
+      basePath = this.config?.basePath || "/";
+    }
     const currentOrigin = window.location.origin;
     if (path.startsWith("http")) {
       return path;
     }
     if (path.startsWith("/")) {
-      if (basePath && basePath !== "/") {
-        const cleanBasePath = basePath.endsWith("/") ? basePath.slice(0, -1) : basePath;
-        const cleanPath = path.startsWith("/") ? path : `/${path}`;
-        const fullPath = `${cleanBasePath}${cleanPath}`;
-        const fullUrl2 = `${currentOrigin}${fullPath}`;
-        return fullUrl2.replace(/([^:])\/{2,}/g, "$1/");
-      }
-      return `${currentOrigin}${path}`;
+      const combinedPath = this.combinePaths(basePath, path);
+      return `${currentOrigin}${combinedPath}`;
     }
     const currentPathname = window.location.pathname;
     const currentBase = currentPathname.endsWith("/") ? currentPathname : currentPathname.substring(0, currentPathname.lastIndexOf("/") + 1);
-    const resolvedPath = this.normalizePath(currentBase + path);
-    const fullUrl = `${currentOrigin}${resolvedPath}`;
-    return fullUrl.replace(/([^:])\/{2,}/g, "$1/");
-  }
-  /**
-   * URL 경로 정규화 (이중 슬래시 제거 및 ../, ./ 처리)
-   */
-  normalizePath(path) {
-    path = path.replace(/\/+/g, "/");
-    const parts = path.split("/").filter((part) => part !== "" && part !== ".");
-    const stack = [];
-    for (const part of parts) {
-      if (part === "..") {
-        if (stack.length > 0 && stack[stack.length - 1] !== "..") {
-          stack.pop();
-        } else if (!path.startsWith("/")) {
-          stack.push(part);
-        }
-      } else {
-        stack.push(part);
-      }
-    }
-    const normalized = "/" + stack.join("/");
-    return normalized === "/" ? "/" : normalized;
+    const resolvedPath = this.combinePaths(currentBase, path);
+    return `${currentOrigin}${resolvedPath}`;
   }
   /**
    * 로깅 래퍼 메서드
@@ -2936,31 +2934,17 @@ var ViewLogicRouter = class {
   updateURL(route, params = null) {
     const queryParams = params || this.queryManager?.getQueryParams() || {};
     const queryString = this.queryManager?.buildQueryString(queryParams) || "";
-    const buildURL = (route2, queryString2, isHash = true) => {
-      let base = route2 === "home" ? "/" : `/${route2}`;
-      if (!isHash && this.config.basePath && this.config.basePath !== "/") {
-        base = `${this.config.basePath}${base}`;
-      }
-      const url = queryString2 ? `${base}?${queryString2}` : base;
-      return isHash ? `#${url}` : url;
-    };
+    let base = route === "home" ? "/" : `/${route}`;
     if (this.config.mode === "hash") {
-      const newHash = buildURL(route, queryString);
+      const url = queryString ? `${base}?${queryString}` : base;
+      const newHash = `#${url}`;
       if (window.location.hash !== newHash) {
         window.location.hash = newHash;
       }
     } else {
-      const newPath = buildURL(route, queryString, false);
-      let expectedPath = route === "home" ? "/" : `/${route}`;
-      if (this.config.basePath && this.config.basePath !== "/") {
-        expectedPath = `${this.config.basePath}${expectedPath}`;
-      }
-      const isSameRoute = window.location.pathname === expectedPath;
-      if (isSameRoute) {
-        window.history.replaceState({}, "", newPath);
-      } else {
-        window.history.pushState({}, "", newPath);
-      }
+      base = this.combinePaths(this.config.basePath, base);
+      const url = queryString ? `${base}?${queryString}` : base;
+      window.history.pushState({}, "", url);
       this.handleRouteChange();
     }
   }