pejay-ui 1.2.2 → 1.3.0

package/templates/scripts/setup.bat

@@ -0,0 +1,284 @@
+@echo off
+setlocal enabledelayedexpansion
+
+:: ─────────────────────────────────────────
+:: Project name
+:: ─────────────────────────────────────────
+set /p projectName="Enter project name: "
+
+if exist "%projectName%" (
+    echo Project '%projectName%' already exists. Exiting.
+    exit /b 1
+)
+
+echo Initializing vite project '%projectName%'...
+call npm create vite@latest %projectName% -- --template react-ts
+if errorlevel 1 (
+    echo Failed to create vite project. Exiting.
+    exit /b 1
+)
+
+cd %projectName%
+
+:: ─────────────────────────────────────────
+:: Package selection (y/n per package)
+:: ─────────────────────────────────────────
+echo.
+echo Select packages to install (y/n):
+echo.
+
+set "packages="
+
+call :ask "@reduxjs/toolkit"
+call :ask "@tailwindcss/vite"
+call :ask "clsx"
+call :ask "date-fns"
+call :ask "dayjs"
+call :ask "@floating-ui/react"
+call :ask "lucide-react"
+call :ask "react-hook-form"
+call :ask "react-redux"
+call :ask "react-router-dom"
+call :ask "tailwind-merge"
+call :ask "tailwindcss"
+call :ask "@tanstack/react-query"
+call :ask "zod"
+call :ask "zustand"
+
+if not "!packages!"=="" (
+    echo.
+    echo Installing base dependencies...
+    call npm install
+    echo Installing selected packages: !packages!
+    call npm install !packages!
+) else (
+    echo No packages selected, skipping...
+)
+
+:: ─────────────────────────────────────────
+:: Environment variables
+:: ─────────────────────────────────────────
+echo.
+echo Creating environment variables...
+
+type nul > .env
+
+(
+    echo VITE_HOST=0.0.0.0
+    echo VITE_PORT=3030
+    echo #VITE_API_URL=
+) > .env.development
+
+(
+    echo VITE_HOST=0.0.0.0
+    echo VITE_PORT=3031
+    echo #VITE_API_URL=
+) > .env.staging
+
+(
+    echo VITE_HOST=0.0.0.0
+    echo VITE_PORT=3032
+    echo #VITE_API_URL=
+) > .env.production
+
+:: ─────────────────────────────────────────
+:: Update package.json scripts via Node
+:: ─────────────────────────────────────────
+echo.
+echo Updating scripts section in package.json...
+
+node -e ^
+"const fs = require('fs');" ^
+"const pkg = JSON.parse(fs.readFileSync('package.json', 'utf8'));" ^
+"pkg.scripts = { lint: 'eslint .', preview: 'vite preview', dev: 'vite', stage: 'vite --mode staging', build: 'vite build', 'build-stage': 'vite build --mode staging' };" ^
+"fs.writeFileSync('package.json', JSON.stringify(pkg, null, 2));"
+
+:: ─────────────────────────────────────────
+:: vite.config.ts
+:: ─────────────────────────────────────────
+echo.
+echo Setting up vite config...
+
+(
+    echo import { defineConfig, loadEnv } from 'vite';
+    echo import react from '@vitejs/plugin-react';
+    echo import tailwindcss from '@tailwindcss/vite';
+    echo import path from 'path';
+    echo.
+    echo export default defineConfig(({ mode }) =^> {
+    echo   const env = loadEnv(mode, process.cwd(), ''^);
+    echo   return {
+    echo     plugins: [react(^), tailwindcss(^)],
+    echo     resolve: {
+    echo       alias: {
+    echo         '@': path.resolve(__dirname, './src'^),
+    echo       },
+    echo     },
+    echo     server: {
+    echo       host: '0.0.0.0',
+    echo       port: Number(env.VITE_PORT^),
+    echo     },
+    echo   };
+    echo }^);
+) > vite.config.ts
+
+:: ─────────────────────────────────────────
+:: tsconfig.app.json
+:: ─────────────────────────────────────────
+echo.
+echo Setting up tsconfig paths...
+
+(
+    echo {
+    echo   "compilerOptions": {
+    echo     "baseUrl": ".",
+    echo     "paths": { "@/*": ["src/*"] },
+    echo     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    echo     "target": "es2023",
+    echo     "lib": ["ES2023", "DOM"],
+    echo     "module": "esnext",
+    echo     "types": ["vite/client"],
+    echo     "skipLibCheck": true,
+    echo     "moduleResolution": "bundler",
+    echo     "allowImportingTsExtensions": true,
+    echo     "verbatimModuleSyntax": true,
+    echo     "moduleDetection": "force",
+    echo     "noEmit": true,
+    echo     "jsx": "react-jsx",
+    echo     "noUnusedLocals": true,
+    echo     "noUnusedParameters": true,
+    echo     "erasableSyntaxOnly": true,
+    echo     "noFallthroughCasesInSwitch": true
+    echo   },
+    echo   "include": ["src"]
+    echo }
+) > tsconfig.app.json
+
+:: ─────────────────────────────────────────
+:: tailwind.config.ts
+:: ─────────────────────────────────────────
+echo.
+echo Setting up tailwind config...
+
+(
+    echo /** @type {import('tailwindcss'^).Config} */
+    echo export default {
+    echo   content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
+    echo   theme: {
+    echo     extend: {},
+    echo   },
+    echo   plugins: [],
+    echo };
+) > tailwind.config.ts
+
+:: ─────────────────────────────────────────
+:: README + .gitignore
+:: ─────────────────────────────────────────
+echo.
+echo Formatting README.md and .gitignore...
+
+type nul > README.md
+
+(
+    echo.
+    echo .env
+    echo .env.*
+    echo .sixth*
+) >> .gitignore
+
+:: ─────────────────────────────────────────
+:: src directory structure
+:: ─────────────────────────────────────────
+echo.
+echo Setting up src directory...
+
+cd src
+
+del /f /q App.css index.css 2>nul
+
+(
+    echo import { createRoot } from 'react-dom/client';
+    echo import '../style/index.css';
+    echo import App from './App.tsx';
+    echo.
+    echo createRoot(document.getElementById('root'^)!^).render(^<App /^>^);
+) > main.tsx
+
+(
+    echo export default function App(^) {
+    echo   return ^<^>app file loaded^<^/^>;
+    echo }
+) > App.tsx
+
+mkdir style
+(echo @import "tailwindcss";) > style\index.css
+
+mkdir components
+mkdir components\base
+type nul > components\base\index.ts
+mkdir components\global
+type nul > components\global\index.ts
+
+mkdir hooks
+type nul > hooks\index.ts
+
+mkdir lib
+type nul > lib\index.ts
+
+mkdir routes
+type nul > routes\index.ts
+mkdir routes\dashboard
+type nul > routes\dashboard\index.ts
+mkdir routes\dashboard\components
+type nul > routes\dashboard\components\index.ts
+mkdir routes\dashboard\hooks
+type nul > routes\dashboard\hooks\index.ts
+mkdir routes\auth
+type nul > routes\auth\index.ts
+mkdir routes\auth\components
+type nul > routes\auth\components\index.ts
+mkdir routes\auth\hooks
+type nul > routes\auth\hooks\index.ts
+
+mkdir router
+mkdir router\guards
+type nul > router\guards\guard.public.ts
+type nul > router\guards\guard.private.ts
+mkdir router\layout
+type nul > router\layout\layout.public.ts
+type nul > router\layout\layout.main.ts
+type nul > router\layout\layout.auth.ts
+type nul > router\index.ts
+
+mkdir providers
+type nul > providers\index.ts
+type nul > providers\app.provider.ts
+
+mkdir services
+type nul > services\index.ts
+mkdir services\dashboard
+mkdir services\auth
+
+mkdir store
+type nul > store\index.ts
+
+mkdir utils
+type nul > utils\index.ts
+
+cd ..
+
+echo.
+echo Project '%projectName%' setup complete!
+endlocal
+exit /b 0
+
+:: ─────────────────────────────────────────
+:: Helper: ask y/n for a package
+:: ─────────────────────────────────────────
+:ask
+set "pkg=%~1"
+set /p "ans=  Install %pkg%? (y/n): "
+if /i "!ans!"=="y" (
+    set "packages=!packages! %pkg%"
+)
+exit /b 0

package/templates/scripts/setup.ps1

@@ -0,0 +1,318 @@
+$ErrorActionPreference = "Stop"
+
+function Show-MultiSelect {
+    param([string[]]$Options, [string]$Title)
+
+    $selected = @($false) * $Options.Length
+    $cursor = 0
+
+    while ($true) {
+        Clear-Host
+        Write-Host $Title
+
+        for ($i = 0; $i -lt $Options.Length; $i++) {
+            $checkbox = if ($selected[$i]) { "[x]" } else { "[ ]" }
+            if ($i -eq $cursor) {
+                Write-Host " > $checkbox $($Options[$i])" -ForegroundColor Cyan
+            } else {
+                Write-Host "   $checkbox $($Options[$i])"
+            }
+        }
+
+        $key = $host.UI.RawUI.ReadKey("NoEcho,IncludeKeyDown")
+
+        switch ($key.VirtualKeyCode) {
+            38 { if ($cursor -gt 0) { $cursor-- } }
+            40 { if ($cursor -lt $Options.Length - 1) { $cursor++ } }
+            32 { $selected[$cursor] = !$selected[$cursor] }
+            13 {
+                $result = @()
+                for ($i = 0; $i -lt $Options.Length; $i++) {
+                    if ($selected[$i]) { $result += $Options[$i] }
+                }
+                Clear-Host
+                return $result
+            }
+        }
+    }
+}
+
+# rest of your script below...
+<#
+   The following command prompts for the project name
+#>
+
+Write-Output "Enter project name:"
+$projectName = Read-Host
+
+if (Test-Path $projectName) {
+    Write-Output "Project '$projectName' already exists. Exiting."
+    exit 1
+}
+
+Write-Output "Initializing vite project '$projectName' " 
+npm create vite@latest $projectName -- --template react-ts
+
+Set-Location $projectName
+
+<#
+   The following command installs all the required dependencies
+#>
+
+Write-Output "Installing dependencies"
+
+
+$availablePackages = @(
+    "@reduxjs/toolkit",
+    "@tailwindcss/vite",
+    "clsx",
+    "date-fns",
+    "dayjs",
+    "floating-ui",
+    "lucide-react",
+    "react-form-hook",
+    "react-redux",
+    "react-router-dom",
+    "tailwind-merge",
+    "tailwindcss",
+    "tanstack-query",
+    "zod",
+    "zustand"
+)
+
+$selectedPackages = Show-MultiSelect -Options $availablePackages -Title "Select packages to install (SPACE to toggle, ENTER to confirm):"
+
+if ($selectedPackages.Count -gt 0) {
+    npm install
+    npm install $selectedPackages
+} else {
+    Write-Output "No packages selected, skipping..."
+}
+
+<#
+   The following command creates environment variables
+#>
+
+Write-Output "Creating environment variables"
+Set-Content ".env" ""
+
+Set-Content ".env.development" @"
+VITE_HOST=0.0.0.0
+VITE_PORT=3030
+#VITE_API_URL=
+"@
+
+Set-Content ".env.staging" @"
+VITE_HOST=0.0.0.0
+VITE_PORT=3031
+#VITE_API_URL=
+"@
+
+Set-Content ".env.production" @"
+VITE_HOST=0.0.0.0
+VITE_PORT=3032
+#VITE_API_URL=
+"@
+
+<#
+   The following command updates the scripts section of package.json
+#>
+
+Write-Output "Updating scripts section"
+$pkg = Get-Content "package.json" -Raw | ConvertFrom-Json
+
+$pkg.scripts = [ordered]@{
+    lint          = "eslint ."
+    preview       = "vite preview"
+    dev           = "vite"
+    stage         = "vite --mode staging"
+    build         = "vite build"
+    "build-stage" = "vite build --mode staging"
+}
+
+$pkg | ConvertTo-Json -Depth 10 | Set-Content "package.json"
+
+<#
+   The following command sets up the vite config
+#>
+
+Write-Output "Setting up vite config"
+Set-Content "vite.config.ts" @'
+import { defineConfig, loadEnv } from 'vite';
+import react from '@vitejs/plugin-react';
+import tailwindcss from '@tailwindcss/vite';
+import path from 'path';
+
+export default defineConfig(({ mode }) => {
+  const env = loadEnv(mode, process.cwd(), '');
+  return {
+    plugins: [react(), tailwindcss()],
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, './src'),
+      },
+    },
+    server: {
+      host: '0.0.0.0',
+      port: Number(env.VITE_PORT),
+    },
+  };
+});
+'@
+
+<#
+   The following command sets up the tsconfig paths
+#>
+
+Write-Output "Setting up tsconfig paths"
+Set-Content "tsconfig.app.json" @'
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["src/*"]
+    },
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "es2023",
+    "lib": ["ES2023", "DOM"],
+    "module": "esnext",
+    "types": ["vite/client"],
+    "skipLibCheck": true,  
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",  
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "include": ["src"]
+}
+'@
+
+<#
+   The following command sets up the tailwind config
+#>
+
+Write-Output "Setting up tailwind config"
+Set-Content "tailwind.config.ts" @'
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+};
+'@
+
+<#
+   The following command formats README.md and .gitignore
+#>
+
+Write-Output "Formatting README.md and .gitignore"
+Clear-Content "README.md"
+Add-Content ".gitignore" @"
+.env
+.env.*
+.sixth*
+"@
+
+<#
+   The following command sets up the src directory
+#>
+
+Write-Output "Setting up src directory"
+Set-Location src
+
+<#
+   The following command sets up the main.tsx and App.tsx files
+#>
+
+Write-Output "Setting up main.tsx and App.tsx files"
+Remove-Item "App.css", "index.css" -Force
+Clear-Content "main.tsx", "App.tsx"
+
+Set-Content "main.tsx" @'
+import { createRoot } from 'react-dom/client';
+import '../style/index.css';
+import App from './App.tsx';
+
+createRoot(document.getElementById('root')!).render(<App />);
+'@
+
+Set-Content "App.tsx" @'
+export default function App() {
+  return <>app file loaded</>;
+}
+'@
+
+<#
+   The following command sets up all directories and files
+#>
+
+Write-Output "Creating directories and files"
+
+mkdir style
+Set-Content "style/index.css" @'
+@import "tailwindcss";
+'@
+
+mkdir components
+mkdir components/base
+Set-Content "components/base/index.ts" ""
+mkdir components/global
+Set-Content "components/global/index.ts" ""
+
+mkdir hooks
+Set-Content "hooks/index.ts" ""
+
+mkdir lib
+Set-Content "lib/index.ts" ""
+
+mkdir routes
+Set-Content "routes/index.ts" ""
+mkdir routes/dashboard
+Set-Content "routes/dashboard/index.ts" ""
+mkdir routes/dashboard/components
+Set-Content "routes/dashboard/components/index.ts" ""
+mkdir routes/dashboard/hooks
+Set-Content "routes/dashboard/hooks/index.ts" ""
+mkdir routes/auth
+Set-Content "routes/auth/index.ts" ""
+mkdir routes/auth/components
+Set-Content "routes/auth/components/index.ts" ""
+mkdir routes/auth/hooks
+Set-Content "routes/auth/hooks/index.ts" ""
+
+mkdir router
+mkdir router/guards
+Set-Content "router/guards/guard.public.ts" ""
+Set-Content "router/guards/guard.private.ts" ""
+mkdir router/layout
+Set-Content "router/layout/layout.public.ts" ""
+Set-Content "router/layout/layout.main.ts" ""
+Set-Content "router/layout/layout.auth.ts" ""
+Set-Content "router/index.ts" ""
+
+mkdir providers
+Set-Content "providers/index.ts" ""
+Set-Content "providers/app.provider.ts" ""
+
+mkdir services
+Set-Content "services/index.ts" ""
+mkdir services/dashboard
+mkdir services/auth
+
+mkdir store
+Set-Content "store/index.ts" ""
+
+mkdir utils
+Set-Content "utils/index.ts" ""
+
+Set-Location ..
+
+Write-Output "✅ Project '$projectName' setup complete!"