create-lumen 1.1.2 → 1.1.4

package/templates/conditional/icons/huge/component-based/src/pages/Home/Home.tsx

@@ -1,14 +1,14 @@
-import React from "react";
-import { Sun, Moon, Github } from "@hugeicons/react";
+import { HugeiconsIcon } from "@hugeicons/react";
+import { Sun01Icon, Moon01Icon, Github01Icon } from "@hugeicons/core-free-icons";
 import { Button } from "@/components/common";
 
 export function HomePage() {
   return (
     <div className="text-center">
       <div className="flex justify-center gap-4 mb-6">
-        <Sun className="w-8 h-8 text-yellow-500" />
-        <Moon className="w-8 h-8 text-blue-500" />
-        <Github className="w-8 h-8 text-gray-800" />
+        <HugeiconsIcon icon={Sun01Icon} className="w-8 h-8 text-yellow-500" />
+        <HugeiconsIcon icon={Moon01Icon} className="w-8 h-8 text-blue-500" />
+        <HugeiconsIcon icon={Github01Icon} className="w-8 h-8 text-gray-800" />
       </div>
       <h1 className="text-4xl font-bold text-gray-900 mb-4">Welcome to Lumen</h1>
       <p className="text-gray-600 mb-8">

package/templates/conditional/icons/huge/feature-based/src/features/home/pages/HomePage.jsx

@@ -1,14 +1,14 @@
-import React from "react";
-import { Sun, Moon, Github } from "@hugeicons/react";
+import { HugeiconsIcon } from "@hugeicons/react";
+import { Sun01Icon, Moon01Icon, Github01Icon } from "@hugeicons/core-free-icons";
 import { Button } from "@/components/ui";
 
 export function HomePage() {
   return (
     <div className="text-center">
       <div className="flex justify-center gap-4 mb-6">
-        <Sun className="w-8 h-8 text-yellow-500" />
-        <Moon className="w-8 h-8 text-blue-500" />
-        <Github className="w-8 h-8 text-gray-800" />
+        <HugeiconsIcon icon={Sun01Icon} className="w-8 h-8 text-yellow-500" />
+        <HugeiconsIcon icon={Moon01Icon} className="w-8 h-8 text-blue-500" />
+        <HugeiconsIcon icon={Github01Icon} className="w-8 h-8 text-gray-800" />
       </div>
       <h1 className="text-4xl font-bold text-gray-900 mb-4">Welcome to Lumen</h1>
       <p className="text-gray-600 mb-8">

package/templates/conditional/icons/huge/feature-based/src/features/home/pages/HomePage.tsx

@@ -1,14 +1,14 @@
-import React from "react";
-import { Sun, Moon, Github } from "@hugeicons/react";
+import { HugeiconsIcon } from "@hugeicons/react";
+import { Sun01Icon, Moon01Icon, Github01Icon } from "@hugeicons/core-free-icons";
 import { Button } from "@/components/ui";
 
 export function HomePage() {
   return (
     <div className="text-center">
       <div className="flex justify-center gap-4 mb-6">
-        <Sun className="w-8 h-8 text-yellow-500" />
-        <Moon className="w-8 h-8 text-blue-500" />
-        <Github className="w-8 h-8 text-gray-800" />
+        <HugeiconsIcon icon={Sun01Icon} className="w-8 h-8 text-yellow-500" />
+        <HugeiconsIcon icon={Moon01Icon} className="w-8 h-8 text-blue-500" />
+        <HugeiconsIcon icon={Github01Icon} className="w-8 h-8 text-gray-800" />
       </div>
       <h1 className="text-4xl font-bold text-gray-900 mb-4">Welcome to Lumen</h1>
       <p className="text-gray-600 mb-8">

package/templates/conditional/icons/lucide/component-based/src/pages/Home/Home.jsx

@@ -1,5 +1,4 @@
-import React from "react";
-import { Sun, Moon, Github } from "lucide-react";
+import { Sun, Moon, GitBranch } from "lucide-react";
 import { Button } from "@/components/common";
 
 export function HomePage() {
@@ -8,7 +7,7 @@ export function HomePage() {
       <div className="flex justify-center gap-4 mb-6">
         <Sun className="w-8 h-8 text-yellow-500" />
         <Moon className="w-8 h-8 text-blue-500" />
-        <Github className="w-8 h-8 text-gray-800" />
+        <GitBranch className="w-8 h-8 text-gray-800" />
       </div>
       <h1 className="text-4xl font-bold text-gray-900 mb-4">Welcome to Lumen</h1>
       <p className="text-gray-600 mb-8">

package/templates/conditional/icons/lucide/component-based/src/pages/Home/Home.tsx

@@ -1,5 +1,4 @@
-import React from "react";
-import { Sun, Moon, Github } from "lucide-react";
+import { Sun, Moon, GitBranch } from "lucide-react";
 import { Button } from "@/components/common";
 
 export function HomePage() {
@@ -8,7 +7,7 @@ export function HomePage() {
       <div className="flex justify-center gap-4 mb-6">
         <Sun className="w-8 h-8 text-yellow-500" />
         <Moon className="w-8 h-8 text-blue-500" />
-        <Github className="w-8 h-8 text-gray-800" />
+        <GitBranch className="w-8 h-8 text-gray-800" />
       </div>
       <h1 className="text-4xl font-bold text-gray-900 mb-4">Welcome to Lumen</h1>
       <p className="text-gray-600 mb-8">

package/templates/conditional/icons/lucide/feature-based/src/features/home/pages/HomePage.jsx

@@ -1,5 +1,4 @@
-import React from "react";
-import { Sun, Moon, Github } from "lucide-react";
+import { Sun, Moon, GitBranch } from "lucide-react";
 import { Button } from "@/components/ui";
 
 export function HomePage() {
@@ -8,7 +7,7 @@ export function HomePage() {
       <div className="flex justify-center gap-4 mb-6">
         <Sun className="w-8 h-8 text-yellow-500" />
         <Moon className="w-8 h-8 text-blue-500" />
-        <Github className="w-8 h-8 text-gray-800" />
+        <GitBranch className="w-8 h-8 text-gray-800" />
       </div>
       <h1 className="text-4xl font-bold text-gray-900 mb-4">Welcome to Lumen</h1>
       <p className="text-gray-600 mb-8">

package/templates/conditional/icons/lucide/feature-based/src/features/home/pages/HomePage.tsx

@@ -1,5 +1,4 @@
-import React from "react";
-import { Sun, Moon, Github } from "lucide-react";
+import { Sun, Moon, GitBranch } from "lucide-react";
 import { Button } from "@/components/ui";
 
 export function HomePage() {
@@ -8,7 +7,7 @@ export function HomePage() {
       <div className="flex justify-center gap-4 mb-6">
         <Sun className="w-8 h-8 text-yellow-500" />
         <Moon className="w-8 h-8 text-blue-500" />
-        <Github className="w-8 h-8 text-gray-800" />
+        <GitBranch className="w-8 h-8 text-gray-800" />
       </div>
       <h1 className="text-4xl font-bold text-gray-900 mb-4">Welcome to Lumen</h1>
       <p className="text-gray-600 mb-8">

package/templates/conditional/linting/eslint/eslint.config.js

@@ -4,11 +4,12 @@ import reactHooks from "eslint-plugin-react-hooks";
 import reactRefresh from "eslint-plugin-react-refresh";
 
 export default [
+  js.configs.recommended,
   { ignores: ["dist"] },
   {
     files: ["**/*.{js,jsx}"],
     languageOptions: {
-      ecmaVersion: 2020,
+      ecmaVersion: "latest",
       globals: globals.browser,
       parserOptions: {
         ecmaVersion: "latest",
@@ -28,4 +29,25 @@ export default [
       ],
     },
   },
-];
+  {
+    // Node-runtime files: Vite/Vitest/Jest/ESLint configs and CLI scripts.
+    files: [
+      "**/*.config.{js,cjs,mjs}",
+      "eslint.config.js",
+      "scripts/**/*.{js,mjs}",
+      "jest.setup.{js,mjs}",
+    ],
+    languageOptions: {
+      ecmaVersion: "latest",
+      globals: globals.node,
+    },
+  },
+  {
+    // Test files also see Jest globals (Vitest suites import explicitly).
+    files: ["**/*.test.{js,jsx}"],
+    languageOptions: {
+      ecmaVersion: "latest",
+      globals: { ...globals.browser, ...globals.jest },
+    },
+  },
+];

package/templates/conditional/linting/eslint/eslint.config.ts

@@ -10,7 +10,7 @@ export default tseslint.config(
     extends: [js.configs.recommended, ...tseslint.configs.recommended],
     files: ["**/*.{ts,tsx}"],
     languageOptions: {
-      ecmaVersion: 2020,
+      ecmaVersion: "latest",
       globals: globals.browser,
     },
     plugins: {
@@ -24,5 +24,28 @@ export default tseslint.config(
         { allowConstantExport: true },
       ],
     },
+  },
+  {
+    // Node-runtime files: Vite/Vitest/Jest/ESLint configs and CLI scripts.
+    extends: [...tseslint.configs.recommended],
+    files: [
+      "**/*.config.{ts,mts}",
+      "eslint.config.ts",
+      "scripts/**/*.{ts,mts}",
+      "jest.setup.ts",
+    ],
+    languageOptions: {
+      ecmaVersion: "latest",
+      globals: globals.node,
+    },
+  },
+  {
+    // Test files also see Jest globals (Vitest suites import explicitly).
+    extends: [...tseslint.configs.recommended],
+    files: ["**/*.test.{ts,tsx}"],
+    languageOptions: {
+      ecmaVersion: "latest",
+      globals: { ...globals.browser, ...globals.jest },
+    },
   }
-);
+);

package/templates/conditional/router/component-based/src/App.jsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { MainLayout } from "@/layouts/MainLayout";
 import { AppRoutes } from "@/routes";
 

package/templates/conditional/router/component-based/src/App.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { MainLayout } from "@/layouts/MainLayout";
 import { AppRoutes } from "@/routes";
 

package/templates/conditional/router/component-based/src/routes/index.jsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { BrowserRouter, Routes, Route } from "react-router-dom";
 import { HomePage } from "@/pages/Home";
 

package/templates/conditional/router/component-based/src/routes/index.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { BrowserRouter, Routes, Route } from "react-router-dom";
 import { HomePage } from "@/pages/Home";
 

package/templates/conditional/router/feature-based/src/app/App.jsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { AppRouter } from "./router";
 
 export default function App() {

package/templates/conditional/router/feature-based/src/app/App.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { AppRouter } from "./router";
 
 export default function App() {

package/templates/conditional/state/redux/component-based/src/context/StoreProvider.jsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { Provider } from "react-redux";
 import { store } from "@/store";
 

package/templates/conditional/state/redux/component-based/src/context/StoreProvider.tsx

@@ -1,7 +1,7 @@
-import React from "react";
+import type { ReactNode } from "react";
 import { Provider } from "react-redux";
 import { store } from "@/store";
 
-export function StoreProvider({ children }) {
+export function StoreProvider({ children }: { children: ReactNode }) {
   return <Provider store={store}>{children}</Provider>;
 }

package/templates/conditional/state/redux/component-based/src/pages/Home/counterSlice.ts

@@ -1,8 +1,14 @@
-import { createSlice } from "@reduxjs/toolkit";
+import { createSlice, type PayloadAction } from "@reduxjs/toolkit";
+
+interface CounterState {
+  value: number;
+}
+
+const initialState: CounterState = { value: 0 };
 
 const counterSlice = createSlice({
   name: "counter",
-  initialState: { value: 0 },
+  initialState,
   reducers: {
     increment: (state) => {
       state.value += 1;
@@ -10,7 +16,7 @@ const counterSlice = createSlice({
     decrement: (state) => {
       state.value -= 1;
     },
-    incrementByAmount: (state, action) => {
+    incrementByAmount: (state, action: PayloadAction<number>) => {
       state.value += action.payload;
     },
   },

package/templates/conditional/state/redux/component-based/src/store/hooks.ts

@@ -1,4 +1,6 @@
 import { useDispatch, useSelector } from "react-redux";
+import type { TypedUseSelectorHook } from "react-redux";
+import type { RootState, AppDispatch } from "./index";
 
-export const useAppDispatch = useDispatch;
-export const useAppSelector = useSelector;
+export const useAppDispatch: () => AppDispatch = useDispatch;
+export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;

package/templates/conditional/state/redux/component-based/src/store/index.ts

@@ -7,5 +7,5 @@ export const store = configureStore({
   },
 });
 
-export const RootState = store.getState;
-export const AppDispatch = store.dispatch;
+export type RootState = ReturnType<typeof store.getState>;
+export type AppDispatch = typeof store.dispatch;

package/templates/conditional/state/redux/feature-based/src/app/providers/StoreProvider.jsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { Provider } from "react-redux";
 import { store } from "@/stores";
 

package/templates/conditional/state/redux/feature-based/src/app/providers/StoreProvider.tsx

@@ -1,7 +1,7 @@
-import React from "react";
+import type { ReactNode } from "react";
 import { Provider } from "react-redux";
 import { store } from "@/stores";
 
-export function StoreProvider({ children }) {
+export function StoreProvider({ children }: { children: ReactNode }) {
   return <Provider store={store}>{children}</Provider>;
 }

package/templates/conditional/state/redux/feature-based/src/features/home/store/counterSlice.ts

@@ -1,8 +1,14 @@
-import { createSlice } from "@reduxjs/toolkit";
+import { createSlice, type PayloadAction } from "@reduxjs/toolkit";
+
+interface CounterState {
+  value: number;
+}
+
+const initialState: CounterState = { value: 0 };
 
 const counterSlice = createSlice({
   name: "counter",
-  initialState: { value: 0 },
+  initialState,
   reducers: {
     increment: (state) => {
       state.value += 1;
@@ -10,7 +16,7 @@ const counterSlice = createSlice({
     decrement: (state) => {
       state.value -= 1;
     },
-    incrementByAmount: (state, action) => {
+    incrementByAmount: (state, action: PayloadAction<number>) => {
       state.value += action.payload;
     },
   },

package/templates/conditional/state/redux/feature-based/src/stores/hooks.ts

@@ -1,4 +1,6 @@
 import { useDispatch, useSelector } from "react-redux";
+import type { TypedUseSelectorHook } from "react-redux";
+import type { RootState, AppDispatch } from "./index";
 
-export const useAppDispatch = useDispatch;
-export const useAppSelector = useSelector;
+export const useAppDispatch: () => AppDispatch = useDispatch;
+export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;

package/templates/conditional/state/redux/feature-based/src/stores/index.ts

@@ -7,5 +7,5 @@ export const store = configureStore({
   },
 });
 
-export const RootState = store.getState;
-export const AppDispatch = store.dispatch;
+export type RootState = ReturnType<typeof store.getState>;
+export type AppDispatch = typeof store.dispatch;

package/templates/conditional/state/zustand/component-based/src/store/useCounterStore.ts

@@ -1,6 +1,13 @@
 import { create } from "zustand";
 
-export const useCounterStore = create((set) => ({
+interface CounterState {
+  count: number;
+  increment: () => void;
+  decrement: () => void;
+  incrementByAmount: (amount: number) => void;
+}
+
+export const useCounterStore = create<CounterState>()((set) => ({
   count: 0,
   increment: () => set((state) => ({ count: state.count + 1 })),
   decrement: () => set((state) => ({ count: state.count - 1 })),

package/templates/conditional/state/zustand/feature-based/src/stores/useCounterStore.ts

@@ -1,6 +1,13 @@
 import { create } from "zustand";
 
-export const useCounterStore = create((set) => ({
+interface CounterState {
+  count: number;
+  increment: () => void;
+  decrement: () => void;
+  incrementByAmount: (amount: number) => void;
+}
+
+export const useCounterStore = create<CounterState>()((set) => ({
   count: 0,
   increment: () => set((state) => ({ count: state.count + 1 })),
   decrement: () => set((state) => ({ count: state.count - 1 })),

package/templates/conditional/testing/jest/babel.config.cjs

@@ -0,0 +1,7 @@
+module.exports = {
+  presets: [
+    ["@babel/preset-env", { targets: { node: "current" } }],
+    ["@babel/preset-react", { runtime: "automatic" }],
+    ["@babel/preset-typescript"],
+  ],
+};

package/templates/conditional/testing/jest/component-based/src/__tests__/App.test.jsx

@@ -0,0 +1,10 @@
+import { describe, it, expect } from "@jest/globals";
+import { render, screen } from "@testing-library/react";
+import App from "@/App";
+
+describe("App", () => {
+  it("renders without crashing", () => {
+    render(<App />);
+    expect(screen.getByText(/Welcome/i)).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/jest/component-based/src/__tests__/App.test.tsx

@@ -0,0 +1,11 @@
+import { describe, it, expect } from "@jest/globals";
+import { render, screen } from "@testing-library/react";
+import "@testing-library/jest-dom/jest-globals";
+import App from "@/App";
+
+describe("App", () => {
+  it("renders without crashing", () => {
+    render(<App />);
+    expect(screen.getByText(/Welcome/i)).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/jest/{src → feature-based/src}/__tests__/App.test.jsx

@@ -1,3 +1,4 @@
+import { describe, it, expect } from "@jest/globals";
 import { render, screen } from "@testing-library/react";
 import App from "@/app/App";
 
@@ -6,4 +7,4 @@ describe("App", () => {
     render(<App />);
     expect(screen.getByText(/Welcome/i)).toBeInTheDocument();
   });
-});
+});

package/templates/conditional/testing/jest/feature-based/src/__tests__/App.test.tsx

@@ -0,0 +1,11 @@
+import { describe, it, expect } from "@jest/globals";
+import { render, screen } from "@testing-library/react";
+import "@testing-library/jest-dom/jest-globals";
+import App from "@/app/App";
+
+describe("App", () => {
+  it("renders without crashing", () => {
+    render(<App />);
+    expect(screen.getByText(/Welcome/i)).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/jest/jest.config.js

@@ -1,5 +1,4 @@
-/** @type {import('jest').Config} */
-module.exports = {
+export default {
   testEnvironment: "jsdom",
   roots: ["<rootDir>/src"],
   setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
@@ -9,4 +8,4 @@ module.exports = {
   transform: {
     "^.+\\.jsx?$": "babel-jest",
   },
-};
+};

package/templates/conditional/testing/jest/jest.config.ts

@@ -1,6 +1,6 @@
-/** @type {import('ts-jest').JestConfigWithTsJest} */
-module.exports = {
-  preset: "ts-jest",
+import type { Config } from "jest";
+
+const config: Config = {
   testEnvironment: "jsdom",
   roots: ["<rootDir>/src"],
   setupFilesAfterEnv: ["<rootDir>/jest.setup.ts"],
@@ -8,6 +8,8 @@ module.exports = {
     "^@/(.*)$": "<rootDir>/src/$1",
   },
   transform: {
-    "^.+\\.tsx?$": "ts-jest",
+    "^.+\\.tsx?$": "babel-jest",
   },
 };
+
+export default config;

package/templates/conditional/testing/jest/jest.setup.js

@@ -1 +1,7 @@
 import "@testing-library/jest-dom";
+import { TextDecoder, TextEncoder } from "node:util";
+
+// react-router (and other modern libs) reference TextEncoder/TextDecoder at
+// module scope; jest's jsdom runner does not expose Node's globals by default.
+globalThis.TextEncoder = TextEncoder;
+globalThis.TextDecoder = TextDecoder;

package/templates/conditional/testing/jest/jest.setup.ts

@@ -1 +1,7 @@
 import "@testing-library/jest-dom";
+import { TextDecoder, TextEncoder } from "node:util";
+
+// react-router (and other modern libs) reference TextEncoder/TextDecoder at
+// module scope; jest's jsdom runner does not expose Node's globals by default.
+globalThis.TextEncoder = TextEncoder;
+globalThis.TextDecoder = TextDecoder;

package/templates/conditional/testing/vitest/component-based/src/__tests__/App.test.jsx

@@ -0,0 +1,10 @@
+import { render, screen } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+import App from "@/App";
+
+describe("App", () => {
+  it("renders without crashing", () => {
+    render(<App />);
+    expect(screen.getByText(/Welcome/i)).toBeInTheDocument();
+  });
+});

package/templates/conditional/testing/{jest → vitest/component-based}/src/__tests__/App.test.tsx

@@ -1,5 +1,6 @@
 import { render, screen } from "@testing-library/react";
-import App from "@/app/App";
+import { describe, it, expect } from "vitest";
+import App from "@/App";
 
 describe("App", () => {
   it("renders without crashing", () => {

package/templates/architectures/component-based/src/routes/index.jsx

@@ -1,11 +0,0 @@
-import React from "react";
-import { Routes, Route } from "react-router-dom";
-import { HomePage } from "@/pages/Home";
-
-export function AppRoutes() {
-  return (
-    <Routes>
-      <Route path="/" element={<HomePage />} />
-    </Routes>
-  );
-}

package/templates/architectures/component-based/src/routes/index.tsx

@@ -1,11 +0,0 @@
-import React from "react";
-import { Routes, Route } from "react-router-dom";
-import { HomePage } from "@/pages/Home";
-
-export function AppRoutes() {
-  return (
-    <Routes>
-      <Route path="/" element={<HomePage />} />
-    </Routes>
-  );
-}