@qlover/create-app 0.7.8 → 0.7.9

package/CHANGELOG.md

@@ -1,5 +1,35 @@
 # @qlover/create-app
 
+## 0.7.9
+
+### Patch Changes
+
+#### ✨ Features
+
+- **next-app:** enhance home page internationalization and SEO support ([54d7714](https://github.com/qlover/fe-base/commit/54d77146f26ce132ddd20edace52a1a10eb03149)) ([#508](https://github.com/qlover/fe-base/pull/508))
+  - Added PAGE_HOME_KEYWORDS constant to improve SEO with relevant keywords for the home page.
+  - Created HomeI18nInterface to manage internationalization for the home page, incorporating keywords and welcome messages.
+  - Updated English and Chinese localization files to include new keywords for the home page, enhancing multilingual support.
+  - Refactored Home component to utilize the new i18n structure for better localization handling.
+
+  These changes aim to improve the user experience by providing comprehensive localization and SEO enhancements for the home page.
+
+- **next-app:** enhance login components and improve styling consistency ([59b8b85](https://github.com/qlover/fe-base/commit/59b8b85179e78f29f1eca5b8e7e375b6b8c660eb)) ([#508](https://github.com/qlover/fe-base/pull/508))
+  - Updated LoginForm component to use new border color variable for improved styling consistency.
+  - Simplified LocaleLink components in LoginForm for cleaner code and better readability.
+  - Refactored LoginPage to remove unnecessary elements, streamlining the layout.
+  - Enhanced CSS variables in page.css for better color management across the application.
+
+  These changes aim to improve the user interface and maintain a consistent design across the login components.
+
+- **next-app:** update scripts, enhance theme support, and improve styling ([aebcdfa](https://github.com/qlover/fe-base/commit/aebcdfaeb5bae706ac96dc410056f3064eb1e8e9)) ([#508](https://github.com/qlover/fe-base/pull/508))
+  - Updated package.json scripts to specify ports for development and production environments.
+  - Added new CSS variables for hover states and improved theme management in various CSS files.
+  - Enhanced the LanguageSwitcher and ThemeSwitcher components to utilize dropdowns for better user experience.
+  - Refactored BaseLayout to include a background color for the main content area.
+
+  These changes aim to improve the application's usability and maintainability by enhancing the theme management and user interface components.
+
 ## 0.7.8
 
 ### Patch Changes

package/dist/index.cjs

@@ -8,4 +8,4 @@ ${t}`,dn=Object.getOwnPropertyDescriptor(Function.prototype,"toString"),_n=Objec
 `))this.#e+=Math.max(1,Math.ceil(Ye(D,{countAnsiEscapeCodes:!0})/t))}get isEnabled(){return this.#a&&!this.#F}set isEnabled(t){if(typeof t!="boolean")throw new TypeError("The `isEnabled` option must be a boolean");this.#a=t}get isSilent(){return this.#F}set isSilent(t){if(typeof t!="boolean")throw new TypeError("The `isSilent` option must be a boolean");this.#F=t}frame(){let t=Date.now();(this.#i===-1||t-this.#c>=this.interval)&&(this.#i=++this.#i%this.#D.frames.length,this.#c=t);let{frames:r}=this.#D,u=r[this.#i];this.color&&(u=d[this.color](u));let i=typeof this.#s=="string"&&this.#s!==""?this.#s+" ":"",D=typeof this.text=="string"?" "+this.text:"",o=typeof this.#o=="string"&&this.#o!==""?" "+this.#o:"";return i+u+D+o}clear(){if(!this.#a||!this.#u.isTTY)return this;this.#u.cursorTo(0);for(let t=0;t<this.#n;t++)t>0&&this.#u.moveCursor(0,-1),this.#u.clearLine(1);return(this.#l||this.lastIndent!==this.#l)&&this.#u.cursorTo(this.#l),this.lastIndent=this.#l,this.#n=0,this}render(){return this.#F?this:(this.clear(),this.#u.write(this.frame()),this.#n=this.#e,this)}start(t){return t&&(this.text=t),this.#F?this:this.#a?this.isSpinning?this:(this.#t.hideCursor&&$e.hide(this.#u),this.#t.discardStdin&&V.default.stdin.isTTY&&(this.#r=!0,Je.start()),this.render(),this.#f=setInterval(this.render.bind(this),this.interval),this):(this.text&&this.#u.write(`- ${this.text}
 `),this)}stop(){return this.#a?(clearInterval(this.#f),this.#f=void 0,this.#i=0,this.clear(),this.#t.hideCursor&&$e.show(this.#u),this.#t.discardStdin&&V.default.stdin.isTTY&&this.#r&&(Je.stop(),this.#r=!1),this):this}succeed(t){return this.stopAndPersist({symbol:H.success,text:t})}fail(t){return this.stopAndPersist({symbol:H.error,text:t})}warn(t){return this.stopAndPersist({symbol:H.warning,text:t})}info(t){return this.stopAndPersist({symbol:H.info,text:t})}stopAndPersist(t={}){if(this.#F)return this;let r=t.prefixText??this.#s,u=this.#E(r," "),i=t.symbol??" ",D=t.text??this.text,s=typeof D=="string"?(i?" ":"")+D:"",a=t.suffixText??this.#o,f=this.#g(a," "),p=u+i+s+f+`
 `;return this.stop(),this.#u.write(p),this}};function tr(e){return new Ze(e)}async function rr(e,t){let r=typeof e=="function",u=typeof e.then=="function";if(!r&&!u)throw new TypeError("Parameter `action` must be a Function or a Promise");let{successText:i,failText:D}=typeof t=="object"?t:{successText:void 0,failText:void 0},o=tr(t).start();try{let a=await(r?e(o):e);return o.succeed(i===void 0?void 0:typeof i=="string"?i:i(a)),a}catch(s){throw o.fail(D===void 0?void 0:typeof D=="string"?D:D(s)),s}}var HD=require("fs");var P=require("path"),me=require("fs"),cr=h(lr(),1),Dt=require("fs");var de=require("fs"),X=class{static ensureDir(t){(0,de.existsSync)(t)||(0,de.mkdirSync)(t,{recursive:!0})}};var{copyFile:rs,stat:us}=Dt.promises,_e=class e{constructor(t,r=e.IGNORE_FILE){this.ignoreTargetPath=t;this.ignoreFile=r}static IGNORE_FILE=".gitignore.template";getIg(t=this.ignoreTargetPath){let r=(0,P.join)(t,this.ignoreFile);if(!(0,me.existsSync)(r))return;let D=(0,me.readFileSync)(r,"utf8").split(`
-`).map(o=>o.trim()).filter(o=>o&&!o.startsWith("#"));return(0,cr.default)().add(D)}async copyFiles(t,r,u,i){let D=await Dt.promises.readdir(t);await Promise.all(D.map(async o=>{let s=(0,P.join)(t,o),a=(0,P.join)(r,o);if(u&&u.ignores(o))return;if(X.ensureDir((0,P.dirname)(a)),(await us(s)).isDirectory())await this.copyFiles(s,a,u,i);else{if(i&&await i(s,a))return;await rs(s,a)}}))}copyPaths({sourcePath:t,targetPath:r,copyCallback:u}){X.ensureDir(r);let i=this.getIg();return this.copyFiles(t,r,i,u)}};var L=require("fs"),kD=h(LD(),1),xe=class{constructor(){}isJSONFilePath(t){return t.endsWith(".json")||t.endsWith(".json.template")}isTemplateFilePath(t){return t.endsWith(".template")}getRealTemplateFilePath(t){return t.replace(".template","")}readFile(t){return(0,L.readFileSync)(t,"utf-8")}readJSONFile(t){return JSON.parse(this.readFile(t))}writeFile(t,r){(0,L.writeFileSync)(this.getRealTemplateFilePath(t),r,{encoding:"utf-8"})}replaceFile(t,r){let u=this.readFile(t);return Object.keys(r).forEach(i=>{let D=r[i];u=u.replace(new RegExp(`\\[TPL:${i}\\]`,"g"),typeof D=="string"?D:JSON.stringify(D))}),u}mergeJSONFile(t,r){let u=this.readJSONFile(t),i=(0,kD.default)(r,u);this.writeFile(t,JSON.stringify(i,null,2))}composeConfigFile(t,r,u){if(this.isTemplateFilePath(r)){let i=this.replaceFile(r,t);if(this.isJSONFilePath(r)&&this.isJSONFilePath(u)){let D=this.getRealTemplateFilePath(u);return(0,L.existsSync)(D)?(this.mergeJSONFile(D,JSON.parse(i)),!0):(this.writeFile(D,i),!0)}return this.writeFile(u,i),!0}return!1}};var $D=["pack-app"],ye=class{ora;context;subPackages;copyer;compose;constructor(t){let r=t.options?.templateRootPath;if(!r)throw new Error("template path not exit");if(!(0,HD.existsSync)(r))throw new Error("template path not exit");this.ora=rr,this.context=new UD.FeScriptContext(t),this.subPackages=["node-lib","react-app"],this.copyer=new _e((0,v.join)(this.context.options.configsRootPath,"_common")),this.compose=new xe}get logger(){return this.context.logger}async steps(t){try{return await WD.default.prompt(t)}catch(r){throw r.isTtyError,this.logger.error(r),r}}async action({label:t,task:r}){let u=r();u instanceof Promise||(u=Promise.resolve(u));let i=t;return this.ora(u,i),u}isPackageTemplate(t){return $D.includes(t)}async getGeneratorContext(){let t=Ot(this.subPackages,$D),r=await this.steps(t);if(this.isPackageTemplate(r.template)){let u=wt(this.subPackages),i=await this.steps(u);Object.assign(r,i)}return r.targetPath=(0,v.join)(process.cwd(),r.projectName),r.releasePath=r.releasePath||"src",r}async generate(){let t=await this.getGeneratorContext();if(this.logger.debug("context is:",t,this.context.options.templateRootPath),t.subPackages){await this.action({label:"Generate Directories(subPackages)",task:async()=>{await this.generateTemplateDir(t),await this.generateSubPackages(t),await this.generateConfigs(t,t.targetPath,"_common")}});return}await this.action({label:"Generate Directory",task:async()=>{await this.generateTemplateDir(t),await this.generateConfigs(t,t.targetPath,"_common"),await this.generateConfigs(t,t.targetPath,t.template)}})}async generateConfigs(t,r,u){let i=(s,a)=>(this.logger.debug("copyCallback",s,a),this.compose.composeConfigFile(t,s,a)),{configsRootPath:D,config:o}=this.context.options;if(!o){this.logger.debug("no copy config files");return}await this.copyer.copyPaths({sourcePath:(0,v.join)(D,u),targetPath:r,copyCallback:i})}generateTemplateDir(t){return this.copyer.copyPaths({sourcePath:(0,v.join)(this.context.options.templateRootPath,t.template),targetPath:t.targetPath})}async generateSubPackages(t){let{packagesNames:r="packages",subPackages:u=[],targetPath:i=""}=t,{templateRootPath:D}=this.context.options;for(let o of u){let s=(0,v.join)(D,o),a=(0,v.join)(i,r,o);this.logger.debug("copy sub package",s,a),await this.copyer.copyPaths({sourcePath:s,targetPath:a})}}};var bt={name:"@qlover/create-app",version:"0.7.8",description:"Create a new app with a single command",private:!1,type:"module",files:["dist","package.json","README.md","CHANGELOG.md"],bin:{"create-app":"dist/index.js"},scripts:{build:"tsup","create:app":"node ./dist/index.js"},repository:{type:"git",url:"git+https://github.com/qlover/fe-base.git",directory:"packages/create-app"},homepage:"https://github.com/qlover/fe-base#readme",keywords:["create-app","fe-scripts","scripts"],author:"qlover",license:"ISC",publishConfig:{access:"public"},devDependencies:{"@qlover/logger":"workspace:*",ignore:"^7.0.3",lodash:"^4.17.21",ora:"^8.1.1"},dependencies:{"@qlover/scripts-context":"workspace:*",commander:"^13.1.0",inquirer:"^12.3.2"}};function Ul(){let e=new YD.Command;return e.version(bt.version,"-v, --version","Show version").description(bt.description).option("-d, --dry-run","Do not touch or write anything, but show the commands").option("-V, --verbose","Show more information").option("--config","Copy config files (default: true)",!0).option("--no-config","Do not copy config files"),e.parse(),e.opts()}async function Wl(){let{dryRun:e,verbose:t,...r}=Ul(),u=(0,vt.resolve)("./templates"),i=(0,vt.resolve)("./configs");(0,xt.existsSync)(u)||(console.error("Template is empty!"),process.exit(1)),(0,xt.existsSync)(i)||(console.error("Configs is empty!"),process.exit(1)),await new ye({dryRun:e,verbose:t,options:{...r,templateRootPath:u,configsRootPath:i}}).generate()}Wl().catch(e=>{console.error(e),process.exit(1)});
+`).map(o=>o.trim()).filter(o=>o&&!o.startsWith("#"));return(0,cr.default)().add(D)}async copyFiles(t,r,u,i){let D=await Dt.promises.readdir(t);await Promise.all(D.map(async o=>{let s=(0,P.join)(t,o),a=(0,P.join)(r,o);if(u&&u.ignores(o))return;if(X.ensureDir((0,P.dirname)(a)),(await us(s)).isDirectory())await this.copyFiles(s,a,u,i);else{if(i&&await i(s,a))return;await rs(s,a)}}))}copyPaths({sourcePath:t,targetPath:r,copyCallback:u}){X.ensureDir(r);let i=this.getIg();return this.copyFiles(t,r,i,u)}};var L=require("fs"),kD=h(LD(),1),xe=class{constructor(){}isJSONFilePath(t){return t.endsWith(".json")||t.endsWith(".json.template")}isTemplateFilePath(t){return t.endsWith(".template")}getRealTemplateFilePath(t){return t.replace(".template","")}readFile(t){return(0,L.readFileSync)(t,"utf-8")}readJSONFile(t){return JSON.parse(this.readFile(t))}writeFile(t,r){(0,L.writeFileSync)(this.getRealTemplateFilePath(t),r,{encoding:"utf-8"})}replaceFile(t,r){let u=this.readFile(t);return Object.keys(r).forEach(i=>{let D=r[i];u=u.replace(new RegExp(`\\[TPL:${i}\\]`,"g"),typeof D=="string"?D:JSON.stringify(D))}),u}mergeJSONFile(t,r){let u=this.readJSONFile(t),i=(0,kD.default)(r,u);this.writeFile(t,JSON.stringify(i,null,2))}composeConfigFile(t,r,u){if(this.isTemplateFilePath(r)){let i=this.replaceFile(r,t);if(this.isJSONFilePath(r)&&this.isJSONFilePath(u)){let D=this.getRealTemplateFilePath(u);return(0,L.existsSync)(D)?(this.mergeJSONFile(D,JSON.parse(i)),!0):(this.writeFile(D,i),!0)}return this.writeFile(u,i),!0}return!1}};var $D=["pack-app"],ye=class{ora;context;subPackages;copyer;compose;constructor(t){let r=t.options?.templateRootPath;if(!r)throw new Error("template path not exit");if(!(0,HD.existsSync)(r))throw new Error("template path not exit");this.ora=rr,this.context=new UD.FeScriptContext(t),this.subPackages=["node-lib","react-app"],this.copyer=new _e((0,v.join)(this.context.options.configsRootPath,"_common")),this.compose=new xe}get logger(){return this.context.logger}async steps(t){try{return await WD.default.prompt(t)}catch(r){throw r.isTtyError,this.logger.error(r),r}}async action({label:t,task:r}){let u=r();u instanceof Promise||(u=Promise.resolve(u));let i=t;return this.ora(u,i),u}isPackageTemplate(t){return $D.includes(t)}async getGeneratorContext(){let t=Ot(this.subPackages,$D),r=await this.steps(t);if(this.isPackageTemplate(r.template)){let u=wt(this.subPackages),i=await this.steps(u);Object.assign(r,i)}return r.targetPath=(0,v.join)(process.cwd(),r.projectName),r.releasePath=r.releasePath||"src",r}async generate(){let t=await this.getGeneratorContext();if(this.logger.debug("context is:",t,this.context.options.templateRootPath),t.subPackages){await this.action({label:"Generate Directories(subPackages)",task:async()=>{await this.generateTemplateDir(t),await this.generateSubPackages(t),await this.generateConfigs(t,t.targetPath,"_common")}});return}await this.action({label:"Generate Directory",task:async()=>{await this.generateTemplateDir(t),await this.generateConfigs(t,t.targetPath,"_common"),await this.generateConfigs(t,t.targetPath,t.template)}})}async generateConfigs(t,r,u){let i=(s,a)=>(this.logger.debug("copyCallback",s,a),this.compose.composeConfigFile(t,s,a)),{configsRootPath:D,config:o}=this.context.options;if(!o){this.logger.debug("no copy config files");return}await this.copyer.copyPaths({sourcePath:(0,v.join)(D,u),targetPath:r,copyCallback:i})}generateTemplateDir(t){return this.copyer.copyPaths({sourcePath:(0,v.join)(this.context.options.templateRootPath,t.template),targetPath:t.targetPath})}async generateSubPackages(t){let{packagesNames:r="packages",subPackages:u=[],targetPath:i=""}=t,{templateRootPath:D}=this.context.options;for(let o of u){let s=(0,v.join)(D,o),a=(0,v.join)(i,r,o);this.logger.debug("copy sub package",s,a),await this.copyer.copyPaths({sourcePath:s,targetPath:a})}}};var bt={name:"@qlover/create-app",version:"0.7.9",description:"Create a new app with a single command",private:!1,type:"module",files:["dist","package.json","README.md","CHANGELOG.md"],bin:{"create-app":"dist/index.js"},scripts:{build:"tsup","create:app":"node ./dist/index.js"},repository:{type:"git",url:"git+https://github.com/qlover/fe-base.git",directory:"packages/create-app"},homepage:"https://github.com/qlover/fe-base#readme",keywords:["create-app","fe-scripts","scripts"],author:"qlover",license:"ISC",publishConfig:{access:"public"},devDependencies:{"@qlover/logger":"workspace:*",ignore:"^7.0.3",lodash:"^4.17.21",ora:"^8.1.1"},dependencies:{"@qlover/scripts-context":"workspace:*",commander:"^13.1.0",inquirer:"^12.3.2"}};function Ul(){let e=new YD.Command;return e.version(bt.version,"-v, --version","Show version").description(bt.description).option("-d, --dry-run","Do not touch or write anything, but show the commands").option("-V, --verbose","Show more information").option("--config","Copy config files (default: true)",!0).option("--no-config","Do not copy config files"),e.parse(),e.opts()}async function Wl(){let{dryRun:e,verbose:t,...r}=Ul(),u=(0,vt.resolve)("./templates"),i=(0,vt.resolve)("./configs");(0,xt.existsSync)(u)||(console.error("Template is empty!"),process.exit(1)),(0,xt.existsSync)(i)||(console.error("Configs is empty!"),process.exit(1)),await new ye({dryRun:e,verbose:t,options:{...r,templateRootPath:u,configsRootPath:i}}).generate()}Wl().catch(e=>{console.error(e),process.exit(1)});

package/dist/index.js

@@ -8,4 +8,4 @@ ${t}`,cn=Object.getOwnPropertyDescriptor(Function.prototype,"toString"),fn=Objec
 `))this.#e+=Math.max(1,Math.ceil(Le(D,{countAnsiEscapeCodes:!0})/t))}get isEnabled(){return this.#a&&!this.#F}set isEnabled(t){if(typeof t!="boolean")throw new TypeError("The `isEnabled` option must be a boolean");this.#a=t}get isSilent(){return this.#F}set isSilent(t){if(typeof t!="boolean")throw new TypeError("The `isSilent` option must be a boolean");this.#F=t}frame(){let t=Date.now();(this.#i===-1||t-this.#c>=this.interval)&&(this.#i=++this.#i%this.#D.frames.length,this.#c=t);let{frames:r}=this.#D,u=r[this.#i];this.color&&(u=E[this.color](u));let i=typeof this.#s=="string"&&this.#s!==""?this.#s+" ":"",D=typeof this.text=="string"?" "+this.text:"",o=typeof this.#o=="string"&&this.#o!==""?" "+this.#o:"";return i+u+D+o}clear(){if(!this.#a||!this.#u.isTTY)return this;this.#u.cursorTo(0);for(let t=0;t<this.#n;t++)t>0&&this.#u.moveCursor(0,-1),this.#u.clearLine(1);return(this.#l||this.lastIndent!==this.#l)&&this.#u.cursorTo(this.#l),this.lastIndent=this.#l,this.#n=0,this}render(){return this.#F?this:(this.clear(),this.#u.write(this.frame()),this.#n=this.#e,this)}start(t){return t&&(this.text=t),this.#F?this:this.#a?this.isSpinning?this:(this.#t.hideCursor&&je.hide(this.#u),this.#t.discardStdin&&ce.stdin.isTTY&&(this.#r=!0,We.start()),this.render(),this.#f=setInterval(this.render.bind(this),this.interval),this):(this.text&&this.#u.write(`- ${this.text}
 `),this)}stop(){return this.#a?(clearInterval(this.#f),this.#f=void 0,this.#i=0,this.clear(),this.#t.hideCursor&&je.show(this.#u),this.#t.discardStdin&&ce.stdin.isTTY&&this.#r&&(We.stop(),this.#r=!1),this):this}succeed(t){return this.stopAndPersist({symbol:k.success,text:t})}fail(t){return this.stopAndPersist({symbol:k.error,text:t})}warn(t){return this.stopAndPersist({symbol:k.warning,text:t})}info(t){return this.stopAndPersist({symbol:k.info,text:t})}stopAndPersist(t={}){if(this.#F)return this;let r=t.prefixText??this.#s,u=this.#E(r," "),i=t.symbol??" ",D=t.text??this.text,s=typeof D=="string"?(i?" ":"")+D:"",a=t.suffixText??this.#o,f=this.#g(a," "),p=u+i+s+f+`
 `;return this.stop(),this.#u.write(p),this}};function zt(e){return new He(e)}async function Kt(e,t){let r=typeof e=="function",u=typeof e.then=="function";if(!r&&!u)throw new TypeError("Parameter `action` must be a Function or a Promise");let{successText:i,failText:D}=typeof t=="object"?t:{successText:void 0,failText:void 0},o=zt(t).start();try{let a=await(r?e(o):e);return o.succeed(i===void 0?void 0:typeof i=="string"?i:i(a)),a}catch(s){throw o.fail(D===void 0?void 0:typeof D=="string"?D:D(s)),s}}import{existsSync as Hl}from"fs";var Dr=ue(ir(),1);import{dirname as Jn,join as Ze}from"path";import{existsSync as Zn,readFileSync as Qn}from"fs";import{promises as nr}from"fs";import{existsSync as Kn,mkdirSync as Xn}from"fs";var H=class{static ensureDir(t){Kn(t)||Xn(t,{recursive:!0})}};var{copyFile:es,stat:ts}=nr,Ce=class e{constructor(t,r=e.IGNORE_FILE){this.ignoreTargetPath=t;this.ignoreFile=r}static IGNORE_FILE=".gitignore.template";getIg(t=this.ignoreTargetPath){let r=Ze(t,this.ignoreFile);if(!Zn(r))return;let D=Qn(r,"utf8").split(`
-`).map(o=>o.trim()).filter(o=>o&&!o.startsWith("#"));return(0,Dr.default)().add(D)}async copyFiles(t,r,u,i){let D=await nr.readdir(t);await Promise.all(D.map(async o=>{let s=Ze(t,o),a=Ze(r,o);if(u&&u.ignores(o))return;if(H.ensureDir(Jn(a)),(await ts(s)).isDirectory())await this.copyFiles(s,a,u,i);else{if(i&&await i(s,a))return;await es(s,a)}}))}copyPaths({sourcePath:t,targetPath:r,copyCallback:u}){H.ensureDir(r);let i=this.getIg();return this.copyFiles(t,r,i,u)}};var ID=ue(qD(),1);import{readFileSync as Ll,writeFileSync as kl,existsSync as $l}from"fs";var me=class{constructor(){}isJSONFilePath(t){return t.endsWith(".json")||t.endsWith(".json.template")}isTemplateFilePath(t){return t.endsWith(".template")}getRealTemplateFilePath(t){return t.replace(".template","")}readFile(t){return Ll(t,"utf-8")}readJSONFile(t){return JSON.parse(this.readFile(t))}writeFile(t,r){kl(this.getRealTemplateFilePath(t),r,{encoding:"utf-8"})}replaceFile(t,r){let u=this.readFile(t);return Object.keys(r).forEach(i=>{let D=r[i];u=u.replace(new RegExp(`\\[TPL:${i}\\]`,"g"),typeof D=="string"?D:JSON.stringify(D))}),u}mergeJSONFile(t,r){let u=this.readJSONFile(t),i=(0,ID.default)(r,u);this.writeFile(t,JSON.stringify(i,null,2))}composeConfigFile(t,r,u){if(this.isTemplateFilePath(r)){let i=this.replaceFile(r,t);if(this.isJSONFilePath(r)&&this.isJSONFilePath(u)){let D=this.getRealTemplateFilePath(u);return $l(D)?(this.mergeJSONFile(D,JSON.parse(i)),!0):(this.writeFile(D,i),!0)}return this.writeFile(u,i),!0}return!1}};var jD=["pack-app"],Be=class{ora;context;subPackages;copyer;compose;constructor(t){let r=t.options?.templateRootPath;if(!r)throw new Error("template path not exit");if(!Hl(r))throw new Error("template path not exit");this.ora=Kt,this.context=new Ul(t),this.subPackages=["node-lib","react-app"],this.copyer=new Ce(N(this.context.options.configsRootPath,"_common")),this.compose=new me}get logger(){return this.context.logger}async steps(t){try{return await Wl.prompt(t)}catch(r){throw r.isTtyError,this.logger.error(r),r}}async action({label:t,task:r}){let u=r();u instanceof Promise||(u=Promise.resolve(u));let i=t;return this.ora(u,i),u}isPackageTemplate(t){return jD.includes(t)}async getGeneratorContext(){let t=_t(this.subPackages,jD),r=await this.steps(t);if(this.isPackageTemplate(r.template)){let u=mt(this.subPackages),i=await this.steps(u);Object.assign(r,i)}return r.targetPath=N(process.cwd(),r.projectName),r.releasePath=r.releasePath||"src",r}async generate(){let t=await this.getGeneratorContext();if(this.logger.debug("context is:",t,this.context.options.templateRootPath),t.subPackages){await this.action({label:"Generate Directories(subPackages)",task:async()=>{await this.generateTemplateDir(t),await this.generateSubPackages(t),await this.generateConfigs(t,t.targetPath,"_common")}});return}await this.action({label:"Generate Directory",task:async()=>{await this.generateTemplateDir(t),await this.generateConfigs(t,t.targetPath,"_common"),await this.generateConfigs(t,t.targetPath,t.template)}})}async generateConfigs(t,r,u){let i=(s,a)=>(this.logger.debug("copyCallback",s,a),this.compose.composeConfigFile(t,s,a)),{configsRootPath:D,config:o}=this.context.options;if(!o){this.logger.debug("no copy config files");return}await this.copyer.copyPaths({sourcePath:N(D,u),targetPath:r,copyCallback:i})}generateTemplateDir(t){return this.copyer.copyPaths({sourcePath:N(this.context.options.templateRootPath,t.template),targetPath:t.targetPath})}async generateSubPackages(t){let{packagesNames:r="packages",subPackages:u=[],targetPath:i=""}=t,{templateRootPath:D}=this.context.options;for(let o of u){let s=N(D,o),a=N(i,r,o);this.logger.debug("copy sub package",s,a),await this.copyer.copyPaths({sourcePath:s,targetPath:a})}}};var Et={name:"@qlover/create-app",version:"0.7.8",description:"Create a new app with a single command",private:!1,type:"module",files:["dist","package.json","README.md","CHANGELOG.md"],bin:{"create-app":"dist/index.js"},scripts:{build:"tsup","create:app":"node ./dist/index.js"},repository:{type:"git",url:"git+https://github.com/qlover/fe-base.git",directory:"packages/create-app"},homepage:"https://github.com/qlover/fe-base#readme",keywords:["create-app","fe-scripts","scripts"],author:"qlover",license:"ISC",publishConfig:{access:"public"},devDependencies:{"@qlover/logger":"workspace:*",ignore:"^7.0.3",lodash:"^4.17.21",ora:"^8.1.1"},dependencies:{"@qlover/scripts-context":"workspace:*",commander:"^13.1.0",inquirer:"^12.3.2"}};function zl(){let e=new Vl;return e.version(Et.version,"-v, --version","Show version").description(Et.description).option("-d, --dry-run","Do not touch or write anything, but show the commands").option("-V, --verbose","Show more information").option("--config","Copy config files (default: true)",!0).option("--no-config","Do not copy config files"),e.parse(),e.opts()}async function Kl(){let{dryRun:e,verbose:t,...r}=zl(),u=ND("./templates"),i=ND("./configs");GD(u)||(console.error("Template is empty!"),process.exit(1)),GD(i)||(console.error("Configs is empty!"),process.exit(1)),await new Be({dryRun:e,verbose:t,options:{...r,templateRootPath:u,configsRootPath:i}}).generate()}Kl().catch(e=>{console.error(e),process.exit(1)});
+`).map(o=>o.trim()).filter(o=>o&&!o.startsWith("#"));return(0,Dr.default)().add(D)}async copyFiles(t,r,u,i){let D=await nr.readdir(t);await Promise.all(D.map(async o=>{let s=Ze(t,o),a=Ze(r,o);if(u&&u.ignores(o))return;if(H.ensureDir(Jn(a)),(await ts(s)).isDirectory())await this.copyFiles(s,a,u,i);else{if(i&&await i(s,a))return;await es(s,a)}}))}copyPaths({sourcePath:t,targetPath:r,copyCallback:u}){H.ensureDir(r);let i=this.getIg();return this.copyFiles(t,r,i,u)}};var ID=ue(qD(),1);import{readFileSync as Ll,writeFileSync as kl,existsSync as $l}from"fs";var me=class{constructor(){}isJSONFilePath(t){return t.endsWith(".json")||t.endsWith(".json.template")}isTemplateFilePath(t){return t.endsWith(".template")}getRealTemplateFilePath(t){return t.replace(".template","")}readFile(t){return Ll(t,"utf-8")}readJSONFile(t){return JSON.parse(this.readFile(t))}writeFile(t,r){kl(this.getRealTemplateFilePath(t),r,{encoding:"utf-8"})}replaceFile(t,r){let u=this.readFile(t);return Object.keys(r).forEach(i=>{let D=r[i];u=u.replace(new RegExp(`\\[TPL:${i}\\]`,"g"),typeof D=="string"?D:JSON.stringify(D))}),u}mergeJSONFile(t,r){let u=this.readJSONFile(t),i=(0,ID.default)(r,u);this.writeFile(t,JSON.stringify(i,null,2))}composeConfigFile(t,r,u){if(this.isTemplateFilePath(r)){let i=this.replaceFile(r,t);if(this.isJSONFilePath(r)&&this.isJSONFilePath(u)){let D=this.getRealTemplateFilePath(u);return $l(D)?(this.mergeJSONFile(D,JSON.parse(i)),!0):(this.writeFile(D,i),!0)}return this.writeFile(u,i),!0}return!1}};var jD=["pack-app"],Be=class{ora;context;subPackages;copyer;compose;constructor(t){let r=t.options?.templateRootPath;if(!r)throw new Error("template path not exit");if(!Hl(r))throw new Error("template path not exit");this.ora=Kt,this.context=new Ul(t),this.subPackages=["node-lib","react-app"],this.copyer=new Ce(N(this.context.options.configsRootPath,"_common")),this.compose=new me}get logger(){return this.context.logger}async steps(t){try{return await Wl.prompt(t)}catch(r){throw r.isTtyError,this.logger.error(r),r}}async action({label:t,task:r}){let u=r();u instanceof Promise||(u=Promise.resolve(u));let i=t;return this.ora(u,i),u}isPackageTemplate(t){return jD.includes(t)}async getGeneratorContext(){let t=_t(this.subPackages,jD),r=await this.steps(t);if(this.isPackageTemplate(r.template)){let u=mt(this.subPackages),i=await this.steps(u);Object.assign(r,i)}return r.targetPath=N(process.cwd(),r.projectName),r.releasePath=r.releasePath||"src",r}async generate(){let t=await this.getGeneratorContext();if(this.logger.debug("context is:",t,this.context.options.templateRootPath),t.subPackages){await this.action({label:"Generate Directories(subPackages)",task:async()=>{await this.generateTemplateDir(t),await this.generateSubPackages(t),await this.generateConfigs(t,t.targetPath,"_common")}});return}await this.action({label:"Generate Directory",task:async()=>{await this.generateTemplateDir(t),await this.generateConfigs(t,t.targetPath,"_common"),await this.generateConfigs(t,t.targetPath,t.template)}})}async generateConfigs(t,r,u){let i=(s,a)=>(this.logger.debug("copyCallback",s,a),this.compose.composeConfigFile(t,s,a)),{configsRootPath:D,config:o}=this.context.options;if(!o){this.logger.debug("no copy config files");return}await this.copyer.copyPaths({sourcePath:N(D,u),targetPath:r,copyCallback:i})}generateTemplateDir(t){return this.copyer.copyPaths({sourcePath:N(this.context.options.templateRootPath,t.template),targetPath:t.targetPath})}async generateSubPackages(t){let{packagesNames:r="packages",subPackages:u=[],targetPath:i=""}=t,{templateRootPath:D}=this.context.options;for(let o of u){let s=N(D,o),a=N(i,r,o);this.logger.debug("copy sub package",s,a),await this.copyer.copyPaths({sourcePath:s,targetPath:a})}}};var Et={name:"@qlover/create-app",version:"0.7.9",description:"Create a new app with a single command",private:!1,type:"module",files:["dist","package.json","README.md","CHANGELOG.md"],bin:{"create-app":"dist/index.js"},scripts:{build:"tsup","create:app":"node ./dist/index.js"},repository:{type:"git",url:"git+https://github.com/qlover/fe-base.git",directory:"packages/create-app"},homepage:"https://github.com/qlover/fe-base#readme",keywords:["create-app","fe-scripts","scripts"],author:"qlover",license:"ISC",publishConfig:{access:"public"},devDependencies:{"@qlover/logger":"workspace:*",ignore:"^7.0.3",lodash:"^4.17.21",ora:"^8.1.1"},dependencies:{"@qlover/scripts-context":"workspace:*",commander:"^13.1.0",inquirer:"^12.3.2"}};function zl(){let e=new Vl;return e.version(Et.version,"-v, --version","Show version").description(Et.description).option("-d, --dry-run","Do not touch or write anything, but show the commands").option("-V, --verbose","Show more information").option("--config","Copy config files (default: true)",!0).option("--no-config","Do not copy config files"),e.parse(),e.opts()}async function Kl(){let{dryRun:e,verbose:t,...r}=zl(),u=ND("./templates"),i=ND("./configs");GD(u)||(console.error("Template is empty!"),process.exit(1)),GD(i)||(console.error("Configs is empty!"),process.exit(1)),await new Be({dryRun:e,verbose:t,options:{...r,templateRootPath:u,configsRootPath:i}}).generate()}Kl().catch(e=>{console.error(e),process.exit(1)});

package/dist/templates/next-app/config/Identifier/page.home.ts

@@ -12,6 +12,13 @@ export const PAGE_HOME_TITLE = 'page__home__title';
  */
 export const PAGE_HOME_DESCRIPTION = 'page__home__description';
 
+/**
+ * @description Home page keywords
+ * @localZh 现代前端实用库, 实用工具, 组件
+ * @localEn Modern frontend utility library, practical tools, components
+ */
+export const PAGE_HOME_KEYWORDS = 'page__home__keywords';
+
 /**
  * @description Home page welcome message
  * @localZh 欢迎来到主页

package/dist/templates/next-app/config/i18n/HomeI18n .ts

@@ -0,0 +1,22 @@
+import * as i18nKeys from '../Identifier/page.home';
+
+/**
+ * Home page i18n interface
+ *
+ * @description
+ * - welcome: welcome message
+ */
+export type HomeI18nInterface = typeof homeI18n;
+
+export const homeI18n = Object.freeze({
+  // basic meta properties
+  title: i18nKeys.PAGE_HOME_TITLE,
+  description: i18nKeys.PAGE_HOME_DESCRIPTION,
+  content: i18nKeys.PAGE_HOME_DESCRIPTION,
+  keywords: i18nKeys.PAGE_HOME_KEYWORDS,
+
+  welcome: i18nKeys.HOME_WELCOME,
+  getStartedTitle: i18nKeys.HOME_GET_STARTED_TITLE,
+  getStartedDescription: i18nKeys.HOME_GET_STARTED_DESCRIPTION,
+  getStartedButton: i18nKeys.HOME_GET_STARTED_BUTTON
+});

package/dist/templates/next-app/config/theme.ts

@@ -20,4 +20,5 @@ export const themeConfig = {
   } as ThemeConfig
 } as const;
 
+export type SupportedTheme = (typeof themeConfig.supportedThemes)[number];
 export type CommonThemeConfig = typeof themeConfig;

package/dist/templates/next-app/package.json

@@ -3,13 +3,13 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "cross-env APP_ENV=localhost next dev --turbopack",
-    "dev:staging": "cross-env APP_ENV=staging next dev --turbopack",
-    "dev:prod": "cross-env APP_ENV=production next dev --turbopack",
+    "dev": "cross-env APP_ENV=localhost next dev --turbopack --port 3100",
+    "dev:staging": "cross-env APP_ENV=staging next dev --turbopack --port 3100",
+    "dev:prod": "cross-env APP_ENV=production next dev --turbopack --port 3100",
     "build": "cross-env APP_ENV=localhost next build --turbopack",
     "build:staging": "cross-env APP_ENV=staging next build --turbopack",
     "build:prod": "cross-env APP_ENV=production next build --turbopack",
-    "start": "next start",
+    "start": "next start --port 3101",
     "lint": "eslint .",
     "lint:fix": "eslint . --ext .ts,.tsx --fix",
     "format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,css,scss,md}\"",

package/dist/templates/next-app/public/locales/en.json

@@ -180,5 +180,6 @@
   "page__request__stop_api_catch": "Stop API Catch Result",
   "page__login__content": "Login Page Content",
   "page__login__keywords": "Login Page Keywords",
-  "err__server__auth__error": "Server auth error"
+  "err__server__auth__error": "Server auth error",
+  "page__home__keywords": "Modern frontend utility library, practical tools, components"
 }

package/dist/templates/next-app/public/locales/zh.json

@@ -180,5 +180,6 @@
   "page__request__stop_api_catch": "停止 API 捕获结果",
   "page__login__content": "登录页面内容",
   "page__login__keywords": "登录页面关键词",
-  "err__server__auth__error": "服务器认证错误"
+  "err__server__auth__error": "服务器认证错误",
+  "page__home__keywords": "现代前端实用库, 实用工具, 组件"
 }

package/dist/templates/next-app/src/app/[locale]/layout.tsx

@@ -2,7 +2,6 @@ import { NextIntlClientProvider } from 'next-intl';
 import { themeConfig } from '@config/theme';
 import { PageParams } from '@/base/cases/PageParams';
 import type { PageLayoutProps } from '@/base/types/PageProps';
-import { BaseHeader } from '@/uikit/components/BaseHeader';
 import { ComboProvider } from '@/uikit/components/ComboProvider';
 import '@/styles/css/index.css';
 
@@ -19,12 +18,7 @@ export default async function RootLayout({
     <html data-testid="RootLayout" lang={locale} suppressHydrationWarning>
       <body>
         <NextIntlClientProvider locale={locale} messages={messages}>
-          <ComboProvider themeConfig={themeConfig}>
-            <div className="flex flex-col min-h-screen">
-              <BaseHeader showLogoutButton />
-              <div className="flex flex-col">{children}</div>
-            </div>
-          </ComboProvider>
+          <ComboProvider themeConfig={themeConfig}>{children}</ComboProvider>
         </NextIntlClientProvider>
       </body>
     </html>

package/dist/templates/next-app/src/app/[locale]/login/LoginForm.tsx

@@ -47,7 +47,7 @@ export function LoginForm(props: { tt: LoginI18nInterface }) {
           prefix={<UserOutlined className="text-text-tertiary" />}
           placeholder={tt.email}
           title={tt.emailTitle}
-          className="h-12 text-base bg-secondary border-border"
+          className="h-12 text-base bg-secondary border-c-border"
           autoComplete="off"
         />
       </Form.Item>
@@ -66,11 +66,7 @@ export function LoginForm(props: { tt: LoginI18nInterface }) {
       </Form.Item>
 
       <div className="flex justify-end">
-        <LocaleLink
-          href="#"
-          className="text-brand hover:text-brand-hover"
-          title={tt.forgotPasswordTitle}
-        >
+        <LocaleLink href="#" title={tt.forgotPasswordTitle}>
           {tt.forgotPassword}
         </LocaleLink>
       </div>
@@ -101,11 +97,7 @@ export function LoginForm(props: { tt: LoginI18nInterface }) {
 
       <div className="text-center mt-6">
         <span className="text-text-tertiary">{tt.noAccount} </span>
-        <LocaleLink
-          href="/register"
-          className="text-brand hover:text-brand-hover"
-          title={tt.createAccountTitle}
-        >
+        <LocaleLink href="/register" title={tt.createAccountTitle}>
           {tt.createAccount}
         </LocaleLink>
       </div>

package/dist/templates/next-app/src/app/[locale]/login/page.tsx

@@ -5,6 +5,7 @@ import { ServerAuth } from '@/base/cases/ServerAuth';
 import type { PageParamsProps } from '@/base/types/PageProps';
 import { BootstrapServer } from '@/core/bootstraps/BootstrapServer';
 import { redirect } from '@/i18n/routing';
+import { BaseLayout } from '@/uikit/components/BaseLayout';
 import { FeatureItem } from './FeatureItem';
 import { LoginForm } from './LoginForm';
 import type { Metadata } from 'next';
@@ -29,9 +30,7 @@ export async function generateMetadata({
 }): Promise<Metadata> {
   const pageParams = new PageParams(await params);
 
-  const tt = await pageParams.getI18nInterface(loginI18n);
-
-  return tt;
+  return await pageParams.getI18nInterface(loginI18n);
 }
 
 export default async function LoginPage(props: PageParamsProps) {
@@ -51,18 +50,11 @@ export default async function LoginPage(props: PageParamsProps) {
   const tt = await pageParams.getI18nInterface(loginI18n);
 
   return (
-    <div
+    <BaseLayout
       data-testid="LoginPage"
-      className="flex text-xs1 bg-primary min-h-screen"
+      className="text-xs1 bg-primary flex flex-col min-h-screen"
     >
-      {/* Left side - Brand section */}
       <div className="hidden lg:flex bg-secondary lg:w-1/2 p-12 flex-col">
-        <div className="flex items-center gap-3 mb-12">
-          <div className="w-10 h-10 bg-brand rounded-lg"></div>
-          <span className="text-2xl font-semibold text-text">
-            {'AppConfig.appName'}
-          </span>
-        </div>
         <h1 className="text-4xl font-bold text-text mb-4">{tt.welcome}</h1>
         <p className="text-text-secondary text-lg mb-8">{tt.subtitle}</p>
         <div className="space-y-4">
@@ -72,7 +64,6 @@ export default async function LoginPage(props: PageParamsProps) {
         </div>
       </div>
 
-      {/* Right side - Login form */}
       <div className="w-full lg:w-1/2 p-8 sm:p-12 flex items-center justify-center">
         <div className="w-full max-w-[420px]">
           <h2 className="text-2xl font-semibold mb-2 text-text">{tt.title}</h2>
@@ -81,6 +72,6 @@ export default async function LoginPage(props: PageParamsProps) {
           <LoginForm tt={tt} />
         </div>
       </div>
-    </div>
+    </BaseLayout>
   );
 }

package/dist/templates/next-app/src/app/[locale]/page.tsx

@@ -1,119 +1,111 @@
-import Image from 'next/image';
-import { PageParams } from '@/base/cases/PageParams';
+import { Button } from 'antd';
+import { i18nConfig } from '@config/i18n';
+import { homeI18n } from '@config/i18n/HomeI18n ';
+import { PageParams, type PageParamsType } from '@/base/cases/PageParams';
 import { ServerAuth } from '@/base/cases/ServerAuth';
 import type { PageParamsProps } from '@/base/types/PageProps';
 import { BootstrapServer } from '@/core/bootstraps/BootstrapServer';
 import { redirect } from '@/i18n/routing';
+import { BaseLayout } from '@/uikit/components/BaseLayout';
+import type { Metadata } from 'next';
+
+// const navigationItems = [
+//   {
+//     href: '/identifier',
+//     titleKey: 'HOME_IDENTIFIER',
+//     descriptionKey: 'HOME_IDENTIFIER_DESCRIPTION'
+//   }
+// ];
+
+// Generate static params for all supported locales (used for SSG)
+export async function generateStaticParams() {
+  // Return one entry for each supported locale
+  return i18nConfig.supportedLngs.map((locale) => ({ locale }));
+}
+
+// Allow Next.js to statically generate this page if possible (default behavior)
+export const dynamic = 'auto'; // Enable static generation when possible, fallback to dynamic if needed
+
+// Optional: Use revalidate if you want ISR (Incremental Static Regeneration)
+// export const revalidate = 3600; // Rebuild every hour (optional)
+
+// Generate localized SEO metadata per locale (Next.js 15+ best practice)
+export async function generateMetadata({
+  params
+}: {
+  params: Promise<PageParamsType>;
+}): Promise<Metadata> {
+  const pageParams = new PageParams(await params);
+  return await pageParams.getI18nInterface(homeI18n);
+}
 
 export default async function Home({ params }: PageParamsProps) {
   const server = new BootstrapServer();
   const pageParams = new PageParams(await params!);
   const locale = pageParams.getLocale();
+  const tt = await pageParams.getI18nInterface(homeI18n);
 
   if (!(await new ServerAuth(server).hasAuth())) {
     return redirect({ href: '/login', locale });
   }
 
   return (
-    <div
-      data-testid="Home"
-      className="font-sans grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20"
-    >
-      <main className="flex flex-col gap-[32px] row-start-2 items-center sm:items-start">
-        <Image
-          className="dark:invert"
-          src="/next.svg"
-          alt="Next.js logo"
-          width={180}
-          height={38}
-          priority
-        />
-        <ol className="font-mono list-inside list-decimal text-sm/6 text-center sm:text-left">
-          <li className="mb-2 tracking-[-.01em]">
-            Get started by editing{' '}
-            <code className="bg-black/[.05] dark:bg-white/[.06] font-mono font-semibold px-1 py-0.5 rounded">
-              src/app/page.tsx
-            </code>
-            .
-          </li>
-          <li className="tracking-[-.01em]">
-            Save and see your changes instantly.
-          </li>
-        </ol>
+    <BaseLayout data-testid="HomePage">
+      {/* Hero Section */}
+      <section className="py-16 px-4">
+        <div className="max-w-4xl mx-auto text-center">
+          <h1 className="text-4xl md:text-5xl font-bold mb-6 text-text">
+            {tt.welcome}
+          </h1>
+          <p className="text-xl text-text-secondary mb-8">{tt.description}</p>
+        </div>
+      </section>
+
+      {/* Navigation Grid */}
+      <section className="max-w-6xl mx-auto px-4 py-12">
+        <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
+          {/* {navigationItems.map((item) => (
+            <LocaleLink
+              data-testid={`HomePage-navigation-${item.href}`}
+              key={item.href}
+              title={item.titleKey}
+              className={clsx(
+              href={item.href}
+                'block rounded-lg p-6',
+                'bg-secondary',
+                'border border-border',
+                'hover:bg-elevated',
+                'transition-colors duration-200'
+              )}
+            >
+              <h3 className={`text-xl font-semibold mb-3 text-text`}>
+                {t(item.titleKey)}
+              </h3>
+              <p className="text-text-secondary mb-4">
+                {t(item.descriptionKey)}
+              </p>
+              <Button type="primary" className="w-full">
+                {t(i18nKeys.HOME_EXPLORE)}
+              </Button>
+            </LocaleLink>
+          ))} */}
+        </div>
+      </section>
 
-        <div className="flex gap-4 items-center flex-col sm:flex-row">
-          <a
-            className="rounded-full border border-solid border-transparent transition-colors flex items-center justify-center bg-foreground text-background gap-2 hover:bg-[#383838] dark:hover:bg-[#ccc] font-medium text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 sm:w-auto"
-            href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <Image
-              className="dark:invert"
-              src="/vercel.svg"
-              alt="Vercel logomark"
-              width={20}
-              height={20}
-            />
-            Deploy now
-          </a>
-          <a
-            className="rounded-full border border-solid border-black/[.08] dark:border-white/[.145] transition-colors flex items-center justify-center hover:bg-[#f2f2f2] dark:hover:bg-[#1a1a1a] hover:border-transparent font-medium text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 w-full sm:w-auto md:w-[158px]"
-            href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            Read our docs
-          </a>
+      {/* Call to Action Section */}
+      <section className="py-16 px-4 bg-elevated">
+        <div className="max-w-4xl mx-auto text-center">
+          <h2 className="text-3xl font-bold mb-4 text-text">
+            {tt.getStartedTitle}
+          </h2>
+          <p className="text-lg text-text-secondary mb-8">
+            {tt.getStartedDescription}
+          </p>
+          <Button type="primary" size="large" className="px-8">
+            {tt.getStartedButton}
+          </Button>
         </div>
-      </main>
-      <footer className="row-start-3 flex gap-[24px] flex-wrap items-center justify-center">
-        <a
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
-          href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image
-            aria-hidden
-            src="/file.svg"
-            alt="File icon"
-            width={16}
-            height={16}
-          />
-          Learn
-        </a>
-        <a
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
-          href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image
-            aria-hidden
-            src="/window.svg"
-            alt="Window icon"
-            width={16}
-            height={16}
-          />
-          Examples
-        </a>
-        <a
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
-          href="https://nextjs.org?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image
-            aria-hidden
-            src="/globe.svg"
-            alt="Globe icon"
-            width={16}
-            height={16}
-          />
-          Go to nextjs.org →
-        </a>
-      </footer>
-    </div>
+      </section>
+    </BaseLayout>
   );
 }

package/dist/templates/next-app/src/styles/css/antd-themes/_default.css

@@ -236,4 +236,16 @@ html,
     --fe-message-info-color: var(--fe-color-primary);
     --fe-message-loading-color: var(--fe-color-primary);
   }
+
+  .ant-dropdown-css-var {
+    /* Control Variables - Default Theme */
+    --fe-control-outline-width: 2px;
+    --fe-control-interactive-size: 16px;
+    --fe-control-item-bg-hover: rgba(0, 0, 0, 0.04);
+    --fe-control-item-bg-active: #e6f4ff;
+    --fe-control-item-bg-active-hover: #bae0ff;
+    --fe-control-item-bg-active-disabled: rgba(0, 0, 0, 0.15);
+    --fe-control-tmp-outline: rgba(0, 0, 0, 0.02);
+    --fe-control-outline: rgba(96, 165, 250, 0.1); /* blue-400 with 0.1 opacity */
+  }
 }

package/dist/templates/next-app/src/styles/css/antd-themes/dark.css

@@ -175,4 +175,30 @@
       0.85
     ); /* 确保文字在深色背景上清晰可见 */
   }
+  .ant-dropdown-css-var {
+    /* Control Variables - Dark Theme */
+    --fe-control-outline-width: 2px;
+    --fe-control-interactive-size: 16px;
+    --fe-control-item-bg-hover: rgba(255, 255, 255, 0.08);
+    --fe-control-item-bg-active: rgba(
+      96,
+      165,
+      250,
+      0.2
+    ); /* blue-400 with 0.2 opacity */
+    --fe-control-item-bg-active-hover: rgba(
+      96,
+      165,
+      250,
+      0.3
+    ); /* blue-400 with 0.3 opacity */
+    --fe-control-item-bg-active-disabled: rgba(255, 255, 255, 0.15);
+    --fe-control-tmp-outline: rgba(255, 255, 255, 0.02);
+    --fe-control-outline: rgba(
+      96,
+      165,
+      250,
+      0.1
+    ); /* blue-400 with 0.1 opacity */
+  }
 }

package/dist/templates/next-app/src/styles/css/antd-themes/pink.css

@@ -201,4 +201,20 @@
       0 9px 28px 8px rgba(244, 114, 182, 0.05);
     --fe-modal-mask-bg: rgba(244, 114, 182, 0.45);
   }
+  .ant-dropdown-css-var {
+    /* Control Variables - Pink Theme */
+    --fe-control-outline-width: 2px;
+    --fe-control-interactive-size: 16px;
+    --fe-control-item-bg-hover: rgba(0, 0, 0, 0.04);
+    --fe-control-item-bg-active: #fce7f3; /* pink-100 */
+    --fe-control-item-bg-active-hover: #fbcfe8; /* pink-200 */
+    --fe-control-item-bg-active-disabled: rgba(0, 0, 0, 0.15);
+    --fe-control-tmp-outline: rgba(0, 0, 0, 0.02);
+    --fe-control-outline: rgba(
+      244,
+      114,
+      182,
+      0.1
+    ); /* pink-400 with 0.1 opacity */
+  }
 }

package/dist/templates/next-app/src/styles/css/page.css

@@ -11,9 +11,10 @@
   --color-secondary: rgba(var(--color-bg-secondary));
   --color-elevated: rgba(var(--color-bg-elevated));
   --color-text: rgba(var(--text-primary));
+  --color-text-hover: rgba(var(--text-primary-hover));
   --color-text-secondary: rgba(var(--text-secondary));
   --color-text-tertiary: rgba(var(--text-tertiary));
-  --color-border: rgba(var(--color-border));
-  --color-brand: rgba(var(--color-brand));
-  --color-brand-hover: rgba(var(--color-brand-hover));
+  --color-c-border: rgba(var(--color-border));
+  --color-c-brand: rgba(var(--color-brand));
+  --color-c-brand-hover: rgba(var(--color-brand-hover));
 }

package/dist/templates/next-app/src/styles/css/themes/_default.css

@@ -8,6 +8,7 @@
 
     /* 文字颜色 */
     --text-primary: 15 23 42; /* slate-900 */
+    --text-primary-hover: 100 116 139; /* slate-500 */
     --text-secondary: 71 85 105; /* slate-600 */
     --text-tertiary: 100 116 139; /* slate-500 */
 

package/dist/templates/next-app/src/styles/css/themes/dark.css

@@ -8,6 +8,7 @@
 
     /* 文字颜色 */
     --text-primary: 255 255 255;
+    --text-primary-hover: 148 163 184; /* slate-400 */
     --text-secondary: 148 163 184; /* slate-400 */
     --text-tertiary: 100 116 139; /* slate-500 */
 

package/dist/templates/next-app/src/styles/css/themes/pink.css

@@ -8,6 +8,7 @@
 
     /* 文字颜色 */
     --text-primary: 190 18 60; /* rose-700 */
+    --text-primary-hover: 244 63 94; /* rose-500 */
     --text-secondary: 225 29 72; /* rose-600 */
     --text-tertiary: 244 63 94; /* rose-500 */
 

package/dist/templates/next-app/src/uikit/components/BaseHeader.tsx

@@ -10,10 +10,12 @@ import { ThemeSwitcher } from './ThemeSwitcher';
 export function BaseHeader(props: { showLogoutButton?: boolean }) {
   const { showLogoutButton } = props;
   const appConfig = useIOC(IOCIdentifier.AppConfig);
+  const i18nService = useIOC(IOCIdentifier.I18nServiceInterface);
+
   return (
     <header
-      data-testid="base-header"
-      className="h-14 bg-secondary border-b border-border sticky top-0 z-50"
+      data-testid="BaseHeader"
+      className="h-14 bg-secondary border-b border-c-border sticky top-0 z-50"
     >
       <div className="flex items-center justify-between h-full px-4 mx-auto max-w-7xl">
         <div className="flex items-center">
@@ -21,12 +23,6 @@ export function BaseHeader(props: { showLogoutButton?: boolean }) {
             href="/"
             className="flex items-center hover:opacity-80 transition-opacity"
           >
-            {/* <img
-              data-testid="base-header-logo"
-              src={IOC(PublicAssetsPath).getPath('/logo.svg')}
-              alt="logo"
-              className="h-8 w-auto"
-            /> */}
             <span
               data-testid="base-header-app-name"
               className="ml-2 text-lg font-semibold text-text"
@@ -35,10 +31,9 @@ export function BaseHeader(props: { showLogoutButton?: boolean }) {
             </span>
           </Link>
         </div>
-        <div className="flex items-center gap-4">
-          <LanguageSwitcher />
+        <div className="flex items-center gap-2">
+          <LanguageSwitcher i18nService={i18nService} />
           <ThemeSwitcher />
-
           {showLogoutButton && <LogoutButton />}
         </div>
       </div>

package/dist/templates/next-app/src/uikit/components/BaseLayout.tsx

@@ -0,0 +1,27 @@
+import { BaseHeader } from './BaseHeader';
+import type { HTMLAttributes } from 'react';
+
+export interface BaseLayoutProps extends HTMLAttributes<HTMLDivElement> {
+  showLogoutButton?: boolean;
+  mainProps?: HTMLAttributes<HTMLElement>;
+}
+
+export function BaseLayout({
+  children,
+  showLogoutButton,
+  mainProps,
+  ...props
+}: BaseLayoutProps) {
+  return (
+    <div
+      data-testid="BaseLayout"
+      className="flex flex-col min-h-screen"
+      {...props}
+    >
+      <BaseHeader showLogoutButton={showLogoutButton} />
+      <main className="flex flex-1 flex-col bg-primary" {...mainProps}>
+        {children}
+      </main>
+    </div>
+  );
+}

package/dist/templates/next-app/src/uikit/components/LanguageSwitcher.tsx

@@ -1,24 +1,38 @@
 'use client';
 
-import { Select } from 'antd';
+import { TranslationOutlined } from '@ant-design/icons';
+import { Dropdown } from 'antd';
 import { useLocale } from 'next-intl';
-import { useCallback } from 'react';
+import { useCallback, useMemo } from 'react';
 import { i18nConfig } from '@config/i18n';
-import { IOCIdentifier } from '@config/IOCIdentifier';
-import type { I18nServiceLocale } from '@/base/port/I18nServiceInterface';
+import type {
+  I18nServiceInterface,
+  I18nServiceLocale
+} from '@/base/port/I18nServiceInterface';
 import { usePathname, useRouter } from '@/i18n/routing';
-import { useIOC } from '../hook/useIOC';
-import { useStore } from '../hook/useStore';
 import type { LocaleType } from '@config/i18n';
+import type { ItemType } from 'antd/es/menu/interface';
 
-export function LanguageSwitcher() {
-  const i18nService = useIOC(IOCIdentifier.I18nServiceInterface);
-  const { loading } = useStore(i18nService);
+export function LanguageSwitcher(props: { i18nService: I18nServiceInterface }) {
+  const { i18nService } = props;
   const pathname = usePathname(); // current pathname, aware of i18n
 
   const router = useRouter(); // i18n-aware router instance
   const currentLocale = useLocale() as LocaleType; // currently active locale
 
+  const options: ItemType[] = useMemo(() => {
+    return i18nConfig.supportedLngs.map(
+      (lang) =>
+        ({
+          type: 'item',
+          key: lang,
+          value: lang,
+          label:
+            i18nConfig.localeNames[lang as keyof typeof i18nConfig.localeNames]
+        }) as ItemType
+    );
+  }, []);
+
   const handleLanguageChange = useCallback(
     async (value: string) => {
       // Set a persistent cookie with the user's preferred locale (valid for 1 year)
@@ -35,18 +49,32 @@ export function LanguageSwitcher() {
     [i18nService, pathname, router]
   );
 
+  const nextLocale = useMemo(() => {
+    const targetIndex = i18nConfig.supportedLngs.indexOf(currentLocale) + 1;
+    return i18nConfig.supportedLngs[
+      targetIndex % i18nConfig.supportedLngs.length
+    ];
+  }, [currentLocale]);
+
   return (
-    <Select
-      data-testid="LanguageSwitcher"
-      loading={loading}
-      value={currentLocale}
-      onChange={handleLanguageChange}
-      options={i18nConfig.supportedLngs.map((lang) => ({
-        value: lang,
-        label:
-          i18nConfig.localeNames[lang as keyof typeof i18nConfig.localeNames]
-      }))}
-      className="w-24"
-    />
+    <Dropdown
+      data-testid="LanguageSwitcherDropdown"
+      trigger={['hover']}
+      menu={{
+        selectedKeys: [currentLocale],
+        items: options,
+        onClick: ({ key }) => {
+          handleLanguageChange(key);
+        }
+      }}
+    >
+      <span
+        data-testid="LanguageSwitcher"
+        className="text-text hover:text-text-hover cursor-pointer text-lg transition-colors"
+        onClick={() => handleLanguageChange(nextLocale)}
+      >
+        <TranslationOutlined />
+      </span>
+    </Dropdown>
   );
 }

package/dist/templates/next-app/src/uikit/components/ThemeSwitcher.tsx

@@ -1,73 +1,84 @@
 'use client';
 
 import {
-  BulbOutlined,
-  BulbFilled,
   HeartFilled,
-  HeartOutlined,
-  DesktopOutlined
+  SettingOutlined,
+  SunOutlined,
+  MoonOutlined,
+  SettingFilled,
+  SunFilled,
+  MoonFilled,
+  HeartOutlined
 } from '@ant-design/icons';
-import { Select } from 'antd';
+import { Dropdown } from 'antd';
 import { clsx } from 'clsx';
 import { useTheme } from 'next-themes';
-import { themeConfig } from '@config/theme';
+import { useMemo } from 'react';
+import { type SupportedTheme, themeConfig } from '@config/theme';
 import { useMountedClient } from '../hook/useMountedClient';
+import type { ItemType } from 'antd/es/menu/interface';
 
 const { supportedThemes } = themeConfig;
 
+const defaultTheme = supportedThemes[0] || 'system';
+const themesList = ['system', ...supportedThemes];
+
 const colorMap: Record<
   string,
-  { i18nkey: string; colors: string[]; icons: React.ElementType[] }
+  {
+    i18nkey: string;
+    selectedColor: string;
+    normalColor: string;
+    Icon: React.ElementType;
+    SelectedIcon: React.ElementType;
+    TriggerIcon: React.ElementType;
+  }
 > = {
   system: {
     i18nkey: 'System',
-    colors: ['text-text', 'text-text-secondary'],
-    icons: [DesktopOutlined, DesktopOutlined]
+    selectedColor: 'text-text',
+    normalColor: 'text-text-secondary',
+    Icon: SettingOutlined,
+    SelectedIcon: SettingFilled,
+    TriggerIcon: SettingOutlined
   },
   light: {
     i18nkey: 'Light',
-    colors: ['text-text', 'text-text-secondary'],
-    icons: [BulbFilled, BulbOutlined]
+    selectedColor: 'text-text',
+    normalColor: 'text-text-secondary',
+    Icon: SunOutlined,
+    SelectedIcon: SunFilled,
+    TriggerIcon: SunOutlined
   },
   dark: {
     i18nkey: 'Dark',
-    colors: ['text-[#9333ea]', 'text-[#a855f7]'],
-    icons: [BulbFilled, BulbOutlined]
+    selectedColor: 'text-[#9333ea]',
+    normalColor: 'text-[#a855f7]',
+    Icon: MoonOutlined,
+    SelectedIcon: MoonFilled,
+    TriggerIcon: MoonOutlined
   },
   pink: {
     i18nkey: 'Pink',
-    colors: ['text-[#f472b6]', 'text-[#ec4899]'],
-    icons: [HeartFilled, HeartOutlined]
+    selectedColor: 'text-[#f472b6]',
+    normalColor: 'text-[#ec4899]',
+    Icon: HeartOutlined,
+    SelectedIcon: HeartFilled,
+    TriggerIcon: HeartOutlined
   }
 };
 
 export function ThemeSwitcher() {
-  const { theme, resolvedTheme, setTheme } = useTheme();
+  const { theme: currentTheme, resolvedTheme, setTheme } = useTheme();
   const mounted = useMountedClient();
 
-  // 如果组件未挂载，返回空的 Select 以避免闪烁
-  if (!mounted) {
-    return (
-      <Select
-        data-testid="ThemeSwitcher"
-        loading
-        value="system"
-        options={[]}
-        style={{ width: 120 }}
-        className="min-w-40 max-w-full"
-        disabled
-      />
-    );
-  }
-
-  const themeOptions = ['system', ...supportedThemes!].map((themeName) => {
-    const { i18nkey, colors, icons } = colorMap[themeName] || colorMap.light;
-    const [currentColor, normalColor] = colors;
-    const [CurrentIcon, NormalIcon] = icons;
+  const themeOptions = themesList.map((themeName) => {
+    const { i18nkey, selectedColor, normalColor, Icon, SelectedIcon } =
+      colorMap[themeName] || colorMap.light;
 
     const isCurrentTheme =
-      theme === themeName ||
-      (themeName === resolvedTheme && theme === 'system');
+      currentTheme === themeName ||
+      (themeName === resolvedTheme && currentTheme === 'system');
 
     return {
       key: themeName,
@@ -76,24 +87,57 @@ export function ThemeSwitcher() {
         <div
           className={clsx(
             'flex items-center gap-2',
-            isCurrentTheme ? currentColor : normalColor
+            isCurrentTheme ? selectedColor : normalColor
           )}
         >
-          {isCurrentTheme ? <CurrentIcon /> : <NormalIcon />}
+          {isCurrentTheme ? <SelectedIcon /> : <Icon />}
           <span>{i18nkey}</span>
         </div>
       )
-    };
+    } as ItemType;
   });
 
+  const nextTheme = useMemo(() => {
+    if (!currentTheme) {
+      return defaultTheme;
+    }
+    const targetIndex =
+      supportedThemes.indexOf(currentTheme as SupportedTheme) + 1;
+    return supportedThemes[targetIndex % supportedThemes.length];
+  }, [currentTheme]);
+
+  const TriggerIcon = colorMap[currentTheme || defaultTheme].TriggerIcon;
+
+  if (!mounted) {
+    return (
+      <span
+        data-testid="ThemeSwitcher"
+        className="text-text hover:text-text-hover cursor-pointer text-lg transition-colors"
+      >
+        <SettingOutlined />
+      </span>
+    );
+  }
+
   return (
-    <Select
-      data-testid="ThemeSwitcher"
-      value={theme}
-      onChange={setTheme}
-      options={themeOptions}
-      style={{ width: 120 }}
-      className="min-w-40 max-w-full"
-    />
+    <Dropdown
+      data-testid="ThemeSwitcherDropdown"
+      trigger={['hover']}
+      menu={{
+        items: themeOptions,
+        selectedKeys: [currentTheme!],
+        onClick: ({ key }) => {
+          setTheme(key);
+        }
+      }}
+    >
+      <span
+        data-testid="ThemeSwitcher"
+        className="text-text hover:text-text-hover cursor-pointer text-lg transition-colors"
+        onClick={() => setTheme(nextTheme)}
+      >
+        <TriggerIcon />
+      </span>
+    </Dropdown>
   );
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qlover/create-app",
-  "version": "0.7.8",
+  "version": "0.7.9",
   "description": "Create a new app with a single command",
   "private": false,
   "type": "module",