viewlogic 1.0.0 → 1.0.2

package/dist/viewlogic-router.min.js

@@ -49,5 +49,5 @@ ${r}`),a}async createVueComponent(e){let t=`component_${e}`,r=this.router.cacheM
                     </button>
                 </div>
             </div>
-        `;r.innerHTML=a,this.info("ErrorHandler",`Fallback error page displayed for ${e}`)}reportError(e,t,r){let a={route:e,errorCode:r,errorMessage:t.message,stack:t.stack,url:window.location.href,userAgent:navigator.userAgent,timestamp:new Date().toISOString(),routerConfig:{environment:this.router.config.environment,mode:this.router.config.mode}};this.error("ErrorHandler","\uB77C\uC6B0\uD130 \uC5D0\uB7EC \uB9AC\uD3EC\uD2B8:",a)}async createVueComponent(e){if(this.router.routeLoader)return await this.router.routeLoader.createVueComponent(e);throw new Error("RouteLoader not available")}async renderComponentWithTransition(e,t){if(this.router.renderComponentWithTransition)return await this.router.renderComponentWithTransition(e,t);throw new Error("Render function not available")}log(e,t,...r){(typeof e!="string"||!this.logLevels.hasOwnProperty(e))&&(r=[t,...r],t=e,e=this.config.debug?"debug":"info");let a=this.logLevels[this.config.logLevel]||this.logLevels.info,o=this.logLevels[e]||this.logLevels.info;if(o>a||this.config.environment==="production"&&o>this.logLevels.warn)return;let i=t?`[${t}]`:"[ViewLogic]",n=new Date().toISOString().substring(11,23);switch(e){case"error":console.error(`${n} ${i}`,...r);break;case"warn":console.warn(`${n} ${i}`,...r);break;case"info":console.info(`${n} ${i}`,...r);break;case"debug":console.log(`${n} ${i}`,...r);break;default:console.log(`${n} ${i}`,...r)}}error(e,...t){this.log("error",e,...t)}warn(e,...t){this.log("warn",e,...t)}info(e,...t){this.log("info",e,...t)}debug(e,...t){this.log("debug",e,...t)}destroy(){this.router=null,this.info("ErrorHandler","ErrorHandler destroyed")}};var w=class{constructor(e=null,t={}){this.config={basePath:t.basePath||"/src/components",debug:t.debug||!1,environment:t.environment||"development",...t},this.router=e,this.loadingPromises=new Map,this.unifiedComponents=null}log(e,...t){this.router?.errorHandler&&this.router.errorHandler.log(e,"ComponentLoader",...t)}async loadComponent(e){if(!e||typeof e!="string")throw new Error("Component name must be a non-empty string");if(this.loadingPromises.has(e))return this.loadingPromises.get(e);let t=this._loadComponentFromFile(e);this.loadingPromises.set(e,t);try{return await t}catch(r){throw r}finally{this.loadingPromises.delete(e)}}async _loadComponentFromFile(e){let t=`${this.config.basePath}/${e}.js`;try{let a=(await import(t)).default;if(!a)throw new Error(`Component '${e}' has no default export`);return a.name||(a.name=e),this.log("debug",`Component '${e}' loaded successfully`),a}catch(r){throw this.log("error",`Failed to load component '${e}':`,r),new Error(`Component '${e}' not found: ${r.message}`)}}clearComponents(){this.loadingPromises.clear(),this.unifiedComponents=null,this.log("debug","All components cleared")}async loadAllComponents(){return this.unifiedComponents?(this.log("debug","Using existing unified components"),this.unifiedComponents):this.config.environment==="production"?await this._loadProductionComponents():await this._loadDevelopmentComponents()}async _loadProductionComponents(){try{let e=`${this.config.routesPath}/_components.js`;this.log("info","[PRODUCTION] Loading unified components from:",e);let t=await import(e);if(typeof t.registerComponents=="function")return this.unifiedComponents=t.components||{},this.log("info",`[PRODUCTION] Unified components loaded: ${Object.keys(this.unifiedComponents).length} components`),this.unifiedComponents;throw new Error("registerComponents function not found in components module")}catch(e){return this.log("warn","[PRODUCTION] Failed to load unified components:",e.message),this.unifiedComponents={},{}}}async _loadDevelopmentComponents(){let e=this._getComponentNames(),t={};this.log("info",`[DEVELOPMENT] Loading individual components: ${e.join(", ")}`);for(let r of e)try{let a=await this.loadComponent(r);a&&(t[r]=a)}catch(a){this.log("warn",`[DEVELOPMENT] Failed to load component ${r}:`,a.message)}return this.unifiedComponents=t,this.log("info",`[DEVELOPMENT] Individual components loaded: ${Object.keys(t).length} components`),t}_getComponentNames(){return Array.isArray(this.config.componentNames)&&this.config.componentNames.length>0?[...this.config.componentNames]:["Button","Modal","Card","Toast","Input","Tabs","Checkbox","Alert","DynamicInclude","HtmlInclude"]}dispose(){this.clearComponents(),this.log("debug","ComponentLoader disposed"),this.router=null}};var C=class{constructor(e={}){this.version=e.version||"1.0.0",this.config=this._buildConfig(e),this.currentHash="",this.currentVueApp=null,this.previousVueApp=null,this.componentLoader=null,this.transitionInProgress=!1,this.isReady=!1,this.readyPromise=null,this._boundHandleRouteChange=this.handleRouteChange.bind(this),this.readyPromise=this.initialize()}_buildConfig(e){return{...{basePath:"/src",mode:"hash",cacheMode:"memory",cacheTTL:3e5,maxCacheSize:50,useLayout:!0,defaultLayout:"default",environment:"development",routesPath:"/routes",enableErrorReporting:!0,useComponents:!0,componentNames:["Button","Modal","Card","Toast","Input","Tabs","Checkbox","Alert","DynamicInclude","HtmlInclude"],useI18n:!0,defaultLanguage:"ko",logLevel:"info",authEnabled:!1,loginRoute:"login",protectedRoutes:[],protectedPrefixes:[],publicRoutes:["login","register","home"],checkAuthFunction:null,redirectAfterLogin:"home",authCookieName:"authToken",authFallbackCookieNames:["accessToken","token","jwt"],authStorage:"cookie",authCookieOptions:{},authSkipValidation:!1,enableParameterValidation:!0,maxParameterLength:1e3,maxParameterCount:50,maxArraySize:100,allowedKeyPattern:/^[a-zA-Z0-9_-]+$/,logSecurityWarnings:!0},...e}}log(e,...t){this.errorHandler&&this.errorHandler.log(e,"Router",...t)}async initialize(){try{this.cacheManager=new m(this,this.config),this.routeLoader=new y(this,this.config),this.queryManager=new p(this,this.config),this.errorHandler=new b(this,this.config),this.config.useI18n&&(this.i18nManager=new d(this,this.config),this.i18nManager.initPromise&&await this.i18nManager.initPromise),this.config.authEnabled&&(this.authManager=new f(this,this.config)),this.config.useComponents&&(this.componentLoader=new w(this,{...this.config,basePath:this.config.basePath+"/components",cache:!0,componentNames:this.config.componentNames}),await this.componentLoader.loadAllComponents()),this.isReady=!0,this.init()}catch(e){this.log("error","Router initialization failed:",e),this.isReady=!0,this.init()}}async waitForReady(){return this.isReady?!0:(this.readyPromise&&await this.readyPromise,this.isReady)}init(){let e=this.config.mode==="hash";window.addEventListener(e?"hashchange":"popstate",this._boundHandleRouteChange);let t=()=>{e&&!window.location.hash?window.location.hash="#/":!e&&window.location.pathname==="/"?this.navigateTo("home"):this.handleRouteChange()};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",t):requestAnimationFrame(t)}handleRouteChange(){let{route:e,queryParams:t}=this._parseCurrentLocation();this.queryManager?.setCurrentQueryParams(t),(e!==this.currentHash||this.queryManager?.hasQueryParamsChanged(t))&&(this.currentHash=e,this.loadRoute(e))}_parseCurrentLocation(){if(this.config.mode==="hash"){let e=window.location.hash.slice(1)||"/",[t,r]=e.split("?"),a="home";return t&&t!=="/"&&(a=t.startsWith("/")?t.slice(1):t),{route:a||"home",queryParams:this.queryManager?.parseQueryString(r||window.location.search.slice(1))||{}}}else return{route:window.location.pathname.slice(1)||"home",queryParams:this.queryManager?.parseQueryString(window.location.search.slice(1))||{}}}async loadRoute(e){if(!this.transitionInProgress)try{if(this.transitionInProgress=!0,!(this.authManager?await this.authManager.checkAuthentication(e):{allowed:!0,reason:"auth_disabled"}).allowed){if(this.authManager){this.authManager.emitAuthEvent("auth_required",{originalRoute:e,loginRoute:this.config.loginRoute});let i=e!==this.config.loginRoute?`${this.config.loginRoute}?redirect=${encodeURIComponent(e)}`:this.config.loginRoute;this.navigateTo(i)}return}if(!document.getElementById("app"))throw new Error("App element not found");let o=await this.routeLoader.createVueComponent(e);await this.renderComponentWithTransition(o,e)}catch(r){this.log("error",`Route loading failed [${e}]:`,r.message),this.errorHandler?await this.errorHandler.handleRouteError(e,r):console.error("[Router] No error handler available")}finally{this.transitionInProgress=!1}}async renderComponentWithTransition(e,t){let r=document.getElementById("app");if(!r)return;let a=document.createElement("div");a.className="page-container page-entered",a.id=`page-${t}-${Date.now()}`,r.querySelectorAll(".page-container").forEach(s=>{s.classList.remove("page-entered"),s.classList.add("page-exiting")}),r.appendChild(a),this.config.environment==="development"&&e._style&&this.applyStyle(e._style,t);let{createApp:i}=Vue,n=i(e);n.config.globalProperties.$router={navigateTo:(s,l)=>this.navigateTo(s,l),getCurrentRoute:()=>this.getCurrentRoute(),getQueryParams:()=>this.queryManager?.getQueryParams()||{},getQueryParam:s=>this.queryManager?.getQueryParam(s),setQueryParams:(s,l)=>this.queryManager?.setQueryParams(s,l),removeQueryParams:s=>this.queryManager?.removeQueryParams(s),currentRoute:this.currentHash,currentQuery:this.queryManager?.getQueryParams()||{}},n.mount(`#${a.id}`),requestAnimationFrame(()=>{this.cleanupPreviousPages(),this.transitionInProgress=!1}),this.currentVueApp&&(this.previousVueApp=this.currentVueApp),this.currentVueApp=n}cleanupPreviousPages(){let e=document.getElementById("app");if(!e)return;let t=document.createDocumentFragment();if(e.querySelectorAll(".page-container.page-exiting").forEach(a=>a.remove()),this.previousVueApp){try{this.previousVueApp.unmount()}catch{}this.previousVueApp=null}e.querySelector(".loading")?.remove()}applyStyle(e,t){let r=document.querySelector(`style[data-route="${t}"]`);if(r&&r.remove(),e){let a=document.createElement("style");a.textContent=e,a.setAttribute("data-route",t),document.head.appendChild(a)}}navigateTo(e,t=null){typeof e=="object"&&(t=e.params||null,e=e.route),e!==this.currentHash&&this.queryManager&&this.queryManager.clearQueryParams(),this.updateURL(e,t)}getCurrentRoute(){return this.currentHash}updateURL(e,t=null){let r=t||this.queryManager?.getQueryParams()||{},a=this.queryManager?.buildQueryString(r)||"",o=(i,n,s=!0)=>{let l=i==="home"?"/":`/${i}`,h=n?`${l}?${n}`:l;return s?`#${h}`:h};if(this.config.mode==="hash"){let i=o(e,a);window.location.hash!==i&&(window.location.hash=i)}else{let i=o(e,a,!1);window.location.pathname===(e==="home"?"/":`/${e}`)?window.history.replaceState({},"",i):window.history.pushState({},"",i),this.handleRouteChange()}}destroy(){window.removeEventListener(this.config.mode==="hash"?"hashchange":"popstate",this._boundHandleRouteChange),this.currentVueApp&&(this.currentVueApp.unmount(),this.currentVueApp=null),this.previousVueApp&&(this.previousVueApp.unmount(),this.previousVueApp=null),Object.values(this).forEach(t=>{t&&typeof t.destroy=="function"&&t.destroy()}),this.cacheManager?.clearAll();let e=document.getElementById("app");e&&(e.innerHTML=""),this.log("info","Router destroyed")}};export{C as ViewLogicRouter};
+        `;r.innerHTML=a,this.info("ErrorHandler",`Fallback error page displayed for ${e}`)}reportError(e,t,r){let a={route:e,errorCode:r,errorMessage:t.message,stack:t.stack,url:window.location.href,userAgent:navigator.userAgent,timestamp:new Date().toISOString(),routerConfig:{environment:this.router.config.environment,mode:this.router.config.mode}};this.error("ErrorHandler","\uB77C\uC6B0\uD130 \uC5D0\uB7EC \uB9AC\uD3EC\uD2B8:",a)}async createVueComponent(e){if(this.router.routeLoader)return await this.router.routeLoader.createVueComponent(e);throw new Error("RouteLoader not available")}async renderComponentWithTransition(e,t){if(this.router.renderComponentWithTransition)return await this.router.renderComponentWithTransition(e,t);throw new Error("Render function not available")}log(e,t,...r){(typeof e!="string"||!this.logLevels.hasOwnProperty(e))&&(r=[t,...r],t=e,e=this.config.debug?"debug":"info");let a=this.logLevels[this.config.logLevel]||this.logLevels.info,o=this.logLevels[e]||this.logLevels.info;if(o>a||this.config.environment==="production"&&o>this.logLevels.warn)return;let i=t?`[${t}]`:"[ViewLogic]",n=new Date().toISOString().substring(11,23);switch(e){case"error":console.error(`${n} ${i}`,...r);break;case"warn":console.warn(`${n} ${i}`,...r);break;case"info":console.info(`${n} ${i}`,...r);break;case"debug":console.log(`${n} ${i}`,...r);break;default:console.log(`${n} ${i}`,...r)}}error(e,...t){this.log("error",e,...t)}warn(e,...t){this.log("warn",e,...t)}info(e,...t){this.log("info",e,...t)}debug(e,...t){this.log("debug",e,...t)}destroy(){this.router=null,this.info("ErrorHandler","ErrorHandler destroyed")}};var w=class{constructor(e=null,t={}){this.config={basePath:t.basePath||"/src/components",debug:t.debug||!1,environment:t.environment||"development",...t},this.router=e,this.loadingPromises=new Map,this.unifiedComponents=null}log(e,...t){this.router?.errorHandler&&this.router.errorHandler.log(e,"ComponentLoader",...t)}async loadComponent(e){if(!e||typeof e!="string")throw new Error("Component name must be a non-empty string");if(this.loadingPromises.has(e))return this.loadingPromises.get(e);let t=this._loadComponentFromFile(e);this.loadingPromises.set(e,t);try{return await t}catch(r){throw r}finally{this.loadingPromises.delete(e)}}async _loadComponentFromFile(e){let t=`${this.config.basePath}/${e}.js`;try{let a=(await import(t)).default;if(!a)throw new Error(`Component '${e}' has no default export`);return a.name||(a.name=e),this.log("debug",`Component '${e}' loaded successfully`),a}catch(r){throw this.log("error",`Failed to load component '${e}':`,r),new Error(`Component '${e}' not found: ${r.message}`)}}clearComponents(){this.loadingPromises.clear(),this.unifiedComponents=null,this.log("debug","All components cleared")}async loadAllComponents(){return this.unifiedComponents?(this.log("debug","Using existing unified components"),this.unifiedComponents):this.config.environment==="production"?await this._loadProductionComponents():await this._loadDevelopmentComponents()}async _loadProductionComponents(){try{let e=`${this.config.routesPath}/_components.js`;this.log("info","[PRODUCTION] Loading unified components from:",e);let t=await import(e);if(typeof t.registerComponents=="function")return this.unifiedComponents=t.components||{},this.log("info",`[PRODUCTION] Unified components loaded: ${Object.keys(this.unifiedComponents).length} components`),this.unifiedComponents;throw new Error("registerComponents function not found in components module")}catch(e){return this.log("warn","[PRODUCTION] Failed to load unified components:",e.message),this.unifiedComponents={},{}}}async _loadDevelopmentComponents(){let e=this._getComponentNames(),t={};this.log("info",`[DEVELOPMENT] Loading individual components: ${e.join(", ")}`);for(let r of e)try{let a=await this.loadComponent(r);a&&(t[r]=a)}catch(a){this.log("warn",`[DEVELOPMENT] Failed to load component ${r}:`,a.message)}return this.unifiedComponents=t,this.log("info",`[DEVELOPMENT] Individual components loaded: ${Object.keys(t).length} components`),t}_getComponentNames(){return Array.isArray(this.config.componentNames)&&this.config.componentNames.length>0?[...this.config.componentNames]:["Button","Modal","Card","Toast","Input","Tabs","Checkbox","Alert","DynamicInclude","HtmlInclude"]}dispose(){this.clearComponents(),this.log("debug","ComponentLoader disposed"),this.router=null}};var C=class{constructor(e={}){this.version=e.version||"1.0.0",this.config=this._buildConfig(e),this.currentHash="",this.currentVueApp=null,this.previousVueApp=null,this.componentLoader=null,this.transitionInProgress=!1,this.isReady=!1,this.readyPromise=null,this._boundHandleRouteChange=this.handleRouteChange.bind(this),this.readyPromise=this.initialize()}_buildConfig(e){return{...{basePath:"/src",mode:"hash",cacheMode:"memory",cacheTTL:3e5,maxCacheSize:50,useLayout:!0,defaultLayout:"default",environment:"development",routesPath:"/routes",enableErrorReporting:!0,useComponents:!0,componentNames:["Button","Modal","Card","Toast","Input","Tabs","Checkbox","Alert","DynamicInclude","HtmlInclude"],useI18n:!0,defaultLanguage:"ko",logLevel:"info",authEnabled:!1,loginRoute:"login",protectedRoutes:[],protectedPrefixes:[],publicRoutes:["login","register","home"],checkAuthFunction:null,redirectAfterLogin:"home",authCookieName:"authToken",authFallbackCookieNames:["accessToken","token","jwt"],authStorage:"cookie",authCookieOptions:{},authSkipValidation:!1,enableParameterValidation:!0,maxParameterLength:1e3,maxParameterCount:50,maxArraySize:100,allowedKeyPattern:/^[a-zA-Z0-9_-]+$/,logSecurityWarnings:!0},...e}}log(e,...t){this.errorHandler&&this.errorHandler.log(e,"Router",...t)}async initialize(){try{if(this.cacheManager=new m(this,this.config),this.routeLoader=new y(this,this.config),this.queryManager=new p(this,this.config),this.errorHandler=new b(this,this.config),this.config.useI18n&&(this.i18nManager=new d(this,this.config),this.i18nManager.initPromise&&await this.i18nManager.initPromise),this.config.authEnabled&&(this.authManager=new f(this,this.config)),this.config.useComponents){let t=`${window.location.origin}${this.config.basePath}/components`;this.componentLoader=new w(this,{...this.config,basePath:t,cache:!0,componentNames:this.config.componentNames}),await this.componentLoader.loadAllComponents()}this.isReady=!0,this.init()}catch(e){this.log("error","Router initialization failed:",e),this.isReady=!0,this.init()}}async waitForReady(){return this.isReady?!0:(this.readyPromise&&await this.readyPromise,this.isReady)}init(){let e=this.config.mode==="hash";window.addEventListener(e?"hashchange":"popstate",this._boundHandleRouteChange);let t=()=>{e&&!window.location.hash?window.location.hash="#/":!e&&window.location.pathname==="/"?this.navigateTo("home"):this.handleRouteChange()};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",t):requestAnimationFrame(t)}handleRouteChange(){let{route:e,queryParams:t}=this._parseCurrentLocation();this.queryManager?.setCurrentQueryParams(t),(e!==this.currentHash||this.queryManager?.hasQueryParamsChanged(t))&&(this.currentHash=e,this.loadRoute(e))}_parseCurrentLocation(){if(this.config.mode==="hash"){let e=window.location.hash.slice(1)||"/",[t,r]=e.split("?"),a="home";return t&&t!=="/"&&(a=t.startsWith("/")?t.slice(1):t),{route:a||"home",queryParams:this.queryManager?.parseQueryString(r||window.location.search.slice(1))||{}}}else return{route:window.location.pathname.slice(1)||"home",queryParams:this.queryManager?.parseQueryString(window.location.search.slice(1))||{}}}async loadRoute(e){if(!this.transitionInProgress)try{if(this.transitionInProgress=!0,!(this.authManager?await this.authManager.checkAuthentication(e):{allowed:!0,reason:"auth_disabled"}).allowed){if(this.authManager){this.authManager.emitAuthEvent("auth_required",{originalRoute:e,loginRoute:this.config.loginRoute});let i=e!==this.config.loginRoute?`${this.config.loginRoute}?redirect=${encodeURIComponent(e)}`:this.config.loginRoute;this.navigateTo(i)}return}if(!document.getElementById("app"))throw new Error("App element not found");let o=await this.routeLoader.createVueComponent(e);await this.renderComponentWithTransition(o,e)}catch(r){this.log("error",`Route loading failed [${e}]:`,r.message),this.errorHandler?await this.errorHandler.handleRouteError(e,r):console.error("[Router] No error handler available")}finally{this.transitionInProgress=!1}}async renderComponentWithTransition(e,t){let r=document.getElementById("app");if(!r)return;let a=document.createElement("div");a.className="page-container page-entered",a.id=`page-${t}-${Date.now()}`,r.querySelectorAll(".page-container").forEach(s=>{s.classList.remove("page-entered"),s.classList.add("page-exiting")}),r.appendChild(a),this.config.environment==="development"&&e._style&&this.applyStyle(e._style,t);let{createApp:i}=Vue,n=i(e);n.config.globalProperties.$router={navigateTo:(s,l)=>this.navigateTo(s,l),getCurrentRoute:()=>this.getCurrentRoute(),getQueryParams:()=>this.queryManager?.getQueryParams()||{},getQueryParam:s=>this.queryManager?.getQueryParam(s),setQueryParams:(s,l)=>this.queryManager?.setQueryParams(s,l),removeQueryParams:s=>this.queryManager?.removeQueryParams(s),currentRoute:this.currentHash,currentQuery:this.queryManager?.getQueryParams()||{}},n.mount(`#${a.id}`),requestAnimationFrame(()=>{this.cleanupPreviousPages(),this.transitionInProgress=!1}),this.currentVueApp&&(this.previousVueApp=this.currentVueApp),this.currentVueApp=n}cleanupPreviousPages(){let e=document.getElementById("app");if(!e)return;let t=document.createDocumentFragment();if(e.querySelectorAll(".page-container.page-exiting").forEach(a=>a.remove()),this.previousVueApp){try{this.previousVueApp.unmount()}catch{}this.previousVueApp=null}e.querySelector(".loading")?.remove()}applyStyle(e,t){let r=document.querySelector(`style[data-route="${t}"]`);if(r&&r.remove(),e){let a=document.createElement("style");a.textContent=e,a.setAttribute("data-route",t),document.head.appendChild(a)}}navigateTo(e,t=null){typeof e=="object"&&(t=e.params||null,e=e.route),e!==this.currentHash&&this.queryManager&&this.queryManager.clearQueryParams(),this.updateURL(e,t)}getCurrentRoute(){return this.currentHash}updateURL(e,t=null){let r=t||this.queryManager?.getQueryParams()||{},a=this.queryManager?.buildQueryString(r)||"",o=(i,n,s=!0)=>{let l=i==="home"?"/":`/${i}`,h=n?`${l}?${n}`:l;return s?`#${h}`:h};if(this.config.mode==="hash"){let i=o(e,a);window.location.hash!==i&&(window.location.hash=i)}else{let i=o(e,a,!1);window.location.pathname===(e==="home"?"/":`/${e}`)?window.history.replaceState({},"",i):window.history.pushState({},"",i),this.handleRouteChange()}}destroy(){window.removeEventListener(this.config.mode==="hash"?"hashchange":"popstate",this._boundHandleRouteChange),this.currentVueApp&&(this.currentVueApp.unmount(),this.currentVueApp=null),this.previousVueApp&&(this.previousVueApp.unmount(),this.previousVueApp=null),Object.values(this).forEach(t=>{t&&typeof t.destroy=="function"&&t.destroy()}),this.cacheManager?.clearAll();let e=document.getElementById("app");e&&(e.innerHTML=""),this.log("info","Router destroyed")}};export{C as ViewLogicRouter};
 //# sourceMappingURL=viewlogic-router.min.js.map