slicejs-web-framework 3.2.3 → 3.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (117) hide show
  1. package/.opencode/opencode.json +13 -13
  2. package/LICENSE +21 -21
  3. package/README.md +97 -174
  4. package/Slice/Components/Structural/ContextManager/ContextManager.js +369 -369
  5. package/Slice/Components/Structural/ContextManager/ContextManagerDebugger.js +420 -297
  6. package/Slice/Components/Structural/Controller/Controller.js +1131 -1131
  7. package/Slice/Components/Structural/Debugger/Debugger.html +72 -72
  8. package/Slice/Components/Structural/Debugger/Debugger.js +1497 -1547
  9. package/Slice/Components/Structural/EventManager/EventManager.js +338 -338
  10. package/Slice/Components/Structural/EventManager/EventManagerDebugger.js +476 -361
  11. package/Slice/Components/Structural/Logger/Log.js +10 -10
  12. package/Slice/Components/Structural/Logger/Logger.js +146 -146
  13. package/Slice/Components/Structural/Router/Router.js +752 -721
  14. package/Slice/Components/Structural/StylesManager/StylesManager.js +78 -78
  15. package/Slice/Components/Structural/StylesManager/ThemeManager/ThemeManager.js +84 -84
  16. package/Slice/Slice.js +542 -542
  17. package/Slice/tests/build-bundled-component-without-category.test.js +103 -103
  18. package/Slice/tests/build-js-only-visual-components.test.js +144 -144
  19. package/Slice/tests/bundle-v2-runtime-contract.test.js +728 -728
  20. package/Slice/tests/public-env-runtime-accessors.test.js +44 -44
  21. package/Slice/tests/router-loading-finally.test.js +68 -68
  22. package/api/index.js +286 -286
  23. package/api/middleware/securityMiddleware.js +252 -252
  24. package/api/tests/public-env-resolver.test.js +193 -193
  25. package/api/utils/publicEnvResolver.js +117 -117
  26. package/package.json +40 -38
  27. package/sliceConfig.schema.json +109 -109
  28. package/src/App/index.html +16 -22
  29. package/src/App/index.js +20 -23
  30. package/src/App/style.css +11 -40
  31. package/src/Components/AppComponents/AboutSection/AboutSection.css +9 -0
  32. package/src/Components/AppComponents/AboutSection/AboutSection.html +8 -0
  33. package/src/Components/AppComponents/AboutSection/AboutSection.js +12 -0
  34. package/src/Components/AppComponents/AppShell/AppShell.css +10 -0
  35. package/src/Components/AppComponents/AppShell/AppShell.html +4 -0
  36. package/src/Components/AppComponents/AppShell/AppShell.js +36 -0
  37. package/src/Components/AppComponents/HomeSection/HomeSection.css +20 -0
  38. package/src/Components/AppComponents/HomeSection/HomeSection.html +10 -0
  39. package/src/Components/AppComponents/HomeSection/HomeSection.js +19 -0
  40. package/src/Components/Service/FetchManager/FetchManager.js +133 -133
  41. package/src/Components/Service/IndexedDbManager/IndexedDbManager.js +141 -141
  42. package/src/Components/Service/LocalStorageManager/LocalStorageManager.js +45 -45
  43. package/src/Components/Visual/Button/Button.css +47 -47
  44. package/src/Components/Visual/Button/Button.html +5 -5
  45. package/src/Components/Visual/Button/Button.js +92 -92
  46. package/src/Components/Visual/Card/Card.css +68 -68
  47. package/src/Components/Visual/Card/Card.html +7 -7
  48. package/src/Components/Visual/Card/Card.js +107 -107
  49. package/src/Components/Visual/Checkbox/Checkbox.css +87 -87
  50. package/src/Components/Visual/Checkbox/Checkbox.html +8 -8
  51. package/src/Components/Visual/Checkbox/Checkbox.js +86 -86
  52. package/src/Components/Visual/CodeVisualizer/CodeVisualizer.css +129 -129
  53. package/src/Components/Visual/CodeVisualizer/CodeVisualizer.html +3 -3
  54. package/src/Components/Visual/CodeVisualizer/CodeVisualizer.js +262 -262
  55. package/src/Components/Visual/Details/Details.css +70 -70
  56. package/src/Components/Visual/Details/Details.html +9 -9
  57. package/src/Components/Visual/Details/Details.js +76 -76
  58. package/src/Components/Visual/DropDown/DropDown.css +60 -60
  59. package/src/Components/Visual/DropDown/DropDown.html +5 -5
  60. package/src/Components/Visual/DropDown/DropDown.js +63 -63
  61. package/src/Components/Visual/Grid/Grid.css +7 -7
  62. package/src/Components/Visual/Grid/Grid.html +1 -1
  63. package/src/Components/Visual/Grid/Grid.js +57 -57
  64. package/src/Components/Visual/Icon/Icon.css +510 -510
  65. package/src/Components/Visual/Icon/Icon.js +89 -89
  66. package/src/Components/Visual/Icon/slc.json +554 -554
  67. package/src/Components/Visual/Icon/slc.styl +507 -507
  68. package/src/Components/Visual/Icon/slc.svg +1485 -1485
  69. package/src/Components/Visual/Icon/slc.symbol.svg +1058 -1058
  70. package/src/Components/Visual/Input/Input.css +91 -91
  71. package/src/Components/Visual/Input/Input.html +4 -4
  72. package/src/Components/Visual/Input/Input.js +215 -215
  73. package/src/Components/Visual/Layout/Layout.js +49 -49
  74. package/src/Components/Visual/Link/Link.css +8 -8
  75. package/src/Components/Visual/Link/Link.html +1 -1
  76. package/src/Components/Visual/Link/Link.js +63 -63
  77. package/src/Components/Visual/Loading/Loading.css +56 -56
  78. package/src/Components/Visual/Loading/Loading.html +83 -83
  79. package/src/Components/Visual/Loading/Loading.js +38 -38
  80. package/src/Components/Visual/MultiRoute/MultiRoute.js +100 -93
  81. package/src/Components/Visual/Navbar/Navbar.css +115 -115
  82. package/src/Components/Visual/Navbar/Navbar.html +44 -44
  83. package/src/Components/Visual/Navbar/Navbar.js +141 -141
  84. package/src/Components/Visual/NotFound/NotFound.css +116 -116
  85. package/src/Components/Visual/NotFound/NotFound.html +23 -23
  86. package/src/Components/Visual/NotFound/NotFound.js +16 -16
  87. package/src/Components/Visual/Route/Route.js +93 -93
  88. package/src/Components/Visual/Select/Select.css +84 -84
  89. package/src/Components/Visual/Select/Select.html +8 -8
  90. package/src/Components/Visual/Select/Select.js +195 -195
  91. package/src/Components/Visual/Switch/Switch.css +76 -76
  92. package/src/Components/Visual/Switch/Switch.html +8 -8
  93. package/src/Components/Visual/Switch/Switch.js +102 -102
  94. package/src/Components/Visual/TreeItem/TreeItem.css +36 -36
  95. package/src/Components/Visual/TreeItem/TreeItem.html +1 -1
  96. package/src/Components/Visual/TreeItem/TreeItem.js +126 -126
  97. package/src/Components/Visual/TreeView/TreeView.css +8 -8
  98. package/src/Components/Visual/TreeView/TreeView.html +1 -1
  99. package/src/Components/Visual/TreeView/TreeView.js +48 -48
  100. package/src/Components/components.js +15 -27
  101. package/src/Styles/sliceStyles.css +34 -34
  102. package/src/Themes/Dark.css +42 -42
  103. package/src/Themes/Light.css +31 -31
  104. package/src/Themes/Slice.css +47 -47
  105. package/src/routes.js +9 -15
  106. package/src/sliceConfig.json +74 -73
  107. package/types/index.d.ts +207 -207
  108. package/Slice/Components/Structural/Debugger/Debugger.css +0 -620
  109. package/src/Components/AppComponents/HomePage/HomePage.css +0 -201
  110. package/src/Components/AppComponents/HomePage/HomePage.html +0 -37
  111. package/src/Components/AppComponents/HomePage/HomePage.js +0 -210
  112. package/src/Components/AppComponents/Playground/Playground.css +0 -12
  113. package/src/Components/AppComponents/Playground/Playground.html +0 -0
  114. package/src/Components/AppComponents/Playground/Playground.js +0 -111
  115. package/src/images/Slice.js-logo.png +0 -0
  116. package/src/images/im2/Slice.js-logo.png +0 -0
  117. package/src/testing.js +0 -888
package/api/index.js CHANGED
@@ -1,286 +1,286 @@
1
- // api/index.js - Seguridad automática sin configuración
2
- import express from 'express';
3
- import path from 'path';
4
- import fs from 'fs';
5
- import { fileURLToPath } from 'url';
6
- import { dirname } from 'path';
7
- import {
8
- securityMiddleware,
9
- sliceFrameworkProtection,
10
- suspiciousRequestLogger
11
- } from './middleware/securityMiddleware.js';
12
- import { createPublicEnvProvider } from './utils/publicEnvResolver.js';
13
-
14
- const __filename = fileURLToPath(import.meta.url);
15
- const __dirname = dirname(__filename);
16
- import sliceConfig from '../src/sliceConfig.json' with { type: 'json' };
17
-
18
- let server;
19
- const app = express();
20
-
21
- // Parsear argumentos de línea de comandos
22
- const args = process.argv.slice(2);
23
-
24
- const runMode = process.env.NODE_ENV === 'production' ? 'production' : 'development';
25
- const folderDeployed = runMode === 'production' ? 'dist' : 'src';
26
- const publicEnvProvider = createPublicEnvProvider({
27
- mode: runMode,
28
- envFilePath: path.join(__dirname, '..', '.env')
29
- });
30
-
31
- // Obtener puerto desde process.env.PORT con fallback a sliceConfig.json
32
- const PORT = process.env.PORT || sliceConfig.server?.port || 3001;
33
-
34
- // ==============================================
35
- // MIDDLEWARES DE SEGURIDAD (APLICAR PRIMERO)
36
- // ==============================================
37
-
38
- // 1. Logger de peticiones sospechosas (solo observación, no bloquea)
39
- app.use(suspiciousRequestLogger());
40
-
41
- // 2. Protección del framework - TOTALMENTE AUTOMÁTICA
42
- // Detecta automáticamente el dominio desde los headers
43
- // Funciona en localhost, IP, y cualquier dominio
44
- app.use(sliceFrameworkProtection());
45
-
46
- // 3. Middleware de seguridad general
47
- app.use(securityMiddleware({
48
- allowedExtensions: [
49
- '.js', '.css', '.html', '.json',
50
- '.svg', '.png', '.jpg', '.jpeg', '.gif',
51
- '.woff', '.woff2', '.ttf', '.ico'
52
- ],
53
- blockedPaths: [
54
- '/node_modules',
55
- '/package.json',
56
- '/package-lock.json',
57
- '/.env',
58
- '/.git',
59
- '/api/middleware'
60
- ],
61
- allowPublicAssets: true
62
- }));
63
-
64
- // ==============================================
65
- // MIDDLEWARES DE APLICACIÓN
66
- // ==============================================
67
-
68
- // Middleware global para archivos JavaScript con MIME types correctos
69
- app.use((req, res, next) => {
70
- if (req.path.endsWith('.js')) {
71
- // Forzar headers correctos para TODOS los archivos .js
72
- res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
73
- }
74
- next();
75
- });
76
-
77
- // Middleware para parsear JSON y formularios
78
- app.use(express.json());
79
- app.use(express.urlencoded({ extended: true }));
80
-
81
- // Configurar headers de CORS
82
- app.use((req, res, next) => {
83
- res.header('Access-Control-Allow-Origin', '*');
84
- res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
85
- res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization');
86
-
87
- if (req.method === 'OPTIONS') {
88
- res.sendStatus(200);
89
- } else {
90
- next();
91
- }
92
- });
93
-
94
- // ==============================================
95
- // RUNTIME MODE ENDPOINT
96
- // ==============================================
97
-
98
- app.get('/slice-env.json', (req, res) => {
99
- const payload = publicEnvProvider.getPayload();
100
- res.setHeader('Cache-Control', 'no-store');
101
- res.setHeader('Pragma', 'no-cache');
102
- res.setHeader('Expires', '0');
103
- res.json(payload);
104
- });
105
-
106
- // ==============================================
107
- // ARCHIVOS ESTÁTICOS (DESPUÉS DE SEGURIDAD)
108
- // ==============================================
109
-
110
- if (runMode === 'production') {
111
- app.get('/Slice/Slice.js', (req, res) => {
112
- const slicePath = path.join(__dirname, '..', 'node_modules', 'slicejs-web-framework', 'Slice', 'Slice.js');
113
- if (fs.existsSync(slicePath)) {
114
- res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
115
- return res.send(fs.readFileSync(slicePath, 'utf8'));
116
- }
117
- return res.status(404).send('Slice.js not found');
118
- });
119
-
120
- app.use('/Slice', (req, res) => res.status(404).send('Not found'));
121
- app.use('/Components', (req, res) => res.status(404).send('Not found'));
122
- }
123
-
124
- // Middleware personalizado para archivos de bundles con MIME types correctos
125
- // ⚠️ DEBE IR ANTES del middleware general para tener prioridad
126
- app.use('/bundles/', (req, res, next) => {
127
- // Solo procesar archivos .js
128
- if (req.path.endsWith('.js')) {
129
- const filePath = path.join(__dirname, `../${folderDeployed}`, 'bundles', req.path);
130
- console.log(`📂 Processing bundle: ${req.path} -> ${filePath}`);
131
-
132
- // Verificar que el archivo existe
133
- if (fs.existsSync(filePath)) {
134
- try {
135
- // Leer y servir el archivo con headers correctos
136
- const fileContent = fs.readFileSync(filePath, 'utf8');
137
- res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
138
- res.setHeader('Cache-Control', 'no-cache, no-store, must-revalidate'); // No cachear para permitir actualizaciones en tiempo real
139
- res.setHeader('Pragma', 'no-cache');
140
- res.setHeader('Expires', '0');
141
- console.log(`✅ Serving bundle: ${req.path} (${fileContent.length} bytes, ${Buffer.byteLength(fileContent, 'utf8')} bytes UTF-8)`);
142
- return res.send(fileContent);
143
- } catch (error) {
144
- console.log(`❌ Error reading bundle file: ${error.message}`);
145
- return res.status(500).send('Error reading bundle file');
146
- }
147
- } else {
148
- console.log(`❌ Bundle file not found: ${filePath}`);
149
- return res.status(404).send('Bundle file not found');
150
- }
151
- }
152
-
153
- // Para archivos no .js, continuar con el middleware estático normal
154
- next();
155
- });
156
-
157
- // Servir otros archivos de bundles (JSON, CSS, etc.) con el middleware estático normal
158
- app.use('/bundles/', express.static(path.join(__dirname, `../${folderDeployed}`, 'bundles')));
159
- console.log(`📦 Serving bundles from /${folderDeployed}/bundles`);
160
-
161
- // Servir framework Slice.js (solo development)
162
- if (runMode === 'development') {
163
- app.use('/Slice/', express.static(path.join(__dirname, '..', 'node_modules', 'slicejs-web-framework', 'Slice')));
164
- }
165
-
166
- // Servir archivos estáticos del proyecto con allowlist
167
- const publicFolders = Array.isArray(sliceConfig.publicFolders) ? sliceConfig.publicFolders : [];
168
- const normalizedPublicFolders = publicFolders
169
- .filter((entry) => typeof entry === 'string')
170
- .map((entry) => entry.trim())
171
- .filter((entry) => entry.length > 0)
172
- .map((entry) => (entry.startsWith('/') ? entry : `/${entry}`));
173
-
174
- if (runMode === 'development') {
175
- app.use(express.static(path.join(__dirname, `../${folderDeployed}`)));
176
- } else {
177
- app.use('/App', express.static(path.join(__dirname, `../${folderDeployed}`, 'App')));
178
- app.get('/manifest.json', (req, res) => {
179
- const manifestPath = path.join(__dirname, `../${folderDeployed}`, 'manifest.json');
180
- if (fs.existsSync(manifestPath)) {
181
- res.setHeader('Content-Type', 'application/json; charset=utf-8');
182
- return res.send(fs.readFileSync(manifestPath, 'utf8'));
183
- }
184
- return res.status(404).send('manifest.json not found');
185
- });
186
- app.get('/service-worker.js', (req, res) => {
187
- const workerPath = path.join(__dirname, `../${folderDeployed}`, 'service-worker.js');
188
- if (fs.existsSync(workerPath)) {
189
- res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
190
- return res.send(fs.readFileSync(workerPath, 'utf8'));
191
- }
192
- return res.status(404).send('service-worker.js not found');
193
- });
194
- app.get('/routes.js', (req, res) => {
195
- const routesPath = path.join(__dirname, `../${folderDeployed}`, 'routes.js');
196
- if (fs.existsSync(routesPath)) {
197
- res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
198
- return res.send(fs.readFileSync(routesPath, 'utf8'));
199
- }
200
- return res.status(404).send('routes.js not found');
201
- });
202
- app.get('/sliceConfig.json', (req, res) => {
203
- const configPath = path.join(__dirname, `../${folderDeployed}`, 'sliceConfig.json');
204
- if (fs.existsSync(configPath)) {
205
- res.setHeader('Content-Type', 'application/json; charset=utf-8');
206
- return res.send(fs.readFileSync(configPath, 'utf8'));
207
- }
208
- return res.status(404).send('sliceConfig.json not found');
209
- });
210
- for (const folder of normalizedPublicFolders) {
211
- app.use(folder, express.static(path.join(__dirname, `../${folderDeployed}`, folder)));
212
- }
213
- app.use('/bundles/', express.static(path.join(__dirname, `../${folderDeployed}`, 'bundles')));
214
- app.use('/dist/', express.static(path.join(__dirname, '..', 'dist')));
215
- }
216
-
217
- // ==============================================
218
- // RUTAS DE API
219
- // ==============================================
220
-
221
- // Ruta de ejemplo para API
222
- app.get('/api/status', (req, res) => {
223
- res.json({
224
- status: 'ok',
225
- mode: runMode,
226
- folder: folderDeployed,
227
- timestamp: new Date().toISOString(),
228
- framework: 'Slice.js',
229
- version: '2.0.0',
230
- security: {
231
- enabled: true,
232
- mode: 'automatic',
233
- description: 'Zero-config security - works with any domain'
234
- }
235
- });
236
- });
237
-
238
-
239
- // ==============================================
240
- // SPA FALLBACK
241
- // ==============================================
242
-
243
- // SPA fallback - servir index.html para rutas no encontradas
244
- app.get('*', (req, res) => {
245
- const indexPath = path.join(__dirname, `../${folderDeployed}`, "App", 'index.html');
246
- res.sendFile(indexPath, (err) => {
247
- if (err) {
248
- res.status(404).send(`
249
- <h1>404 - Page Not Found</h1>
250
- <p>The requested file could not be found in /${folderDeployed}</p>
251
- <p>Make sure you've run the appropriate build command:</p>
252
- <ul>
253
- <li>For development: Files should be in /src</li>
254
- <li>For production: Run "npm run slice:build" first</li>
255
- </ul>
256
- `);
257
- }
258
- });
259
- });
260
-
261
- // ==============================================
262
- // INICIO DEL SERVIDOR
263
- // ==============================================
264
-
265
- function startServer() {
266
- server = app.listen(PORT, () => {
267
- console.log(`🔒 Security middleware: active (zero-config, automatic)`);
268
- console.log(`🚀 Slice.js server running on port ${PORT}`);
269
- });
270
- }
271
-
272
- // Manejar cierre del proceso
273
- process.on('SIGINT', () => {
274
- console.log('\n🛑 Slice server stopped');
275
- process.exit(0);
276
- });
277
-
278
- process.on('SIGTERM', () => {
279
- console.log('\n🛑 Server terminated');
280
- process.exit(0);
281
- });
282
-
283
- // Iniciar servidor
284
- startServer();
285
-
286
- export default app;
1
+ // api/index.js - Seguridad automática sin configuración
2
+ import express from 'express';
3
+ import path from 'path';
4
+ import fs from 'fs';
5
+ import { fileURLToPath } from 'url';
6
+ import { dirname } from 'path';
7
+ import {
8
+ securityMiddleware,
9
+ sliceFrameworkProtection,
10
+ suspiciousRequestLogger
11
+ } from './middleware/securityMiddleware.js';
12
+ import { createPublicEnvProvider } from './utils/publicEnvResolver.js';
13
+
14
+ const __filename = fileURLToPath(import.meta.url);
15
+ const __dirname = dirname(__filename);
16
+ import sliceConfig from '../src/sliceConfig.json' with { type: 'json' };
17
+
18
+ let server;
19
+ const app = express();
20
+
21
+ // Parsear argumentos de línea de comandos
22
+ const args = process.argv.slice(2);
23
+
24
+ const runMode = process.env.NODE_ENV === 'production' ? 'production' : 'development';
25
+ const folderDeployed = runMode === 'production' ? 'dist' : 'src';
26
+ const publicEnvProvider = createPublicEnvProvider({
27
+ mode: runMode,
28
+ envFilePath: path.join(__dirname, '..', '.env')
29
+ });
30
+
31
+ // Obtener puerto desde process.env.PORT con fallback a sliceConfig.json
32
+ const PORT = process.env.PORT || sliceConfig.server?.port || 3001;
33
+
34
+ // ==============================================
35
+ // MIDDLEWARES DE SEGURIDAD (APLICAR PRIMERO)
36
+ // ==============================================
37
+
38
+ // 1. Logger de peticiones sospechosas (solo observación, no bloquea)
39
+ app.use(suspiciousRequestLogger());
40
+
41
+ // 2. Protección del framework - TOTALMENTE AUTOMÁTICA
42
+ // Detecta automáticamente el dominio desde los headers
43
+ // Funciona en localhost, IP, y cualquier dominio
44
+ app.use(sliceFrameworkProtection());
45
+
46
+ // 3. Middleware de seguridad general
47
+ app.use(securityMiddleware({
48
+ allowedExtensions: [
49
+ '.js', '.css', '.html', '.json',
50
+ '.svg', '.png', '.jpg', '.jpeg', '.gif',
51
+ '.woff', '.woff2', '.ttf', '.ico'
52
+ ],
53
+ blockedPaths: [
54
+ '/node_modules',
55
+ '/package.json',
56
+ '/package-lock.json',
57
+ '/.env',
58
+ '/.git',
59
+ '/api/middleware'
60
+ ],
61
+ allowPublicAssets: true
62
+ }));
63
+
64
+ // ==============================================
65
+ // MIDDLEWARES DE APLICACIÓN
66
+ // ==============================================
67
+
68
+ // Middleware global para archivos JavaScript con MIME types correctos
69
+ app.use((req, res, next) => {
70
+ if (req.path.endsWith('.js')) {
71
+ // Forzar headers correctos para TODOS los archivos .js
72
+ res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
73
+ }
74
+ next();
75
+ });
76
+
77
+ // Middleware para parsear JSON y formularios
78
+ app.use(express.json());
79
+ app.use(express.urlencoded({ extended: true }));
80
+
81
+ // Configurar headers de CORS
82
+ app.use((req, res, next) => {
83
+ res.header('Access-Control-Allow-Origin', '*');
84
+ res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
85
+ res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization');
86
+
87
+ if (req.method === 'OPTIONS') {
88
+ res.sendStatus(200);
89
+ } else {
90
+ next();
91
+ }
92
+ });
93
+
94
+ // ==============================================
95
+ // RUNTIME MODE ENDPOINT
96
+ // ==============================================
97
+
98
+ app.get('/slice-env.json', (req, res) => {
99
+ const payload = publicEnvProvider.getPayload();
100
+ res.setHeader('Cache-Control', 'no-store');
101
+ res.setHeader('Pragma', 'no-cache');
102
+ res.setHeader('Expires', '0');
103
+ res.json(payload);
104
+ });
105
+
106
+ // ==============================================
107
+ // ARCHIVOS ESTÁTICOS (DESPUÉS DE SEGURIDAD)
108
+ // ==============================================
109
+
110
+ if (runMode === 'production') {
111
+ app.get('/Slice/Slice.js', (req, res) => {
112
+ const slicePath = path.join(__dirname, '..', 'node_modules', 'slicejs-web-framework', 'Slice', 'Slice.js');
113
+ if (fs.existsSync(slicePath)) {
114
+ res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
115
+ return res.send(fs.readFileSync(slicePath, 'utf8'));
116
+ }
117
+ return res.status(404).send('Slice.js not found');
118
+ });
119
+
120
+ app.use('/Slice', (req, res) => res.status(404).send('Not found'));
121
+ app.use('/Components', (req, res) => res.status(404).send('Not found'));
122
+ }
123
+
124
+ // Middleware personalizado para archivos de bundles con MIME types correctos
125
+ // ⚠️ DEBE IR ANTES del middleware general para tener prioridad
126
+ app.use('/bundles/', (req, res, next) => {
127
+ // Solo procesar archivos .js
128
+ if (req.path.endsWith('.js')) {
129
+ const filePath = path.join(__dirname, `../${folderDeployed}`, 'bundles', req.path);
130
+ console.log(`📂 Processing bundle: ${req.path} -> ${filePath}`);
131
+
132
+ // Verificar que el archivo existe
133
+ if (fs.existsSync(filePath)) {
134
+ try {
135
+ // Leer y servir el archivo con headers correctos
136
+ const fileContent = fs.readFileSync(filePath, 'utf8');
137
+ res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
138
+ res.setHeader('Cache-Control', 'no-cache, no-store, must-revalidate'); // No cachear para permitir actualizaciones en tiempo real
139
+ res.setHeader('Pragma', 'no-cache');
140
+ res.setHeader('Expires', '0');
141
+ console.log(`✅ Serving bundle: ${req.path} (${fileContent.length} bytes, ${Buffer.byteLength(fileContent, 'utf8')} bytes UTF-8)`);
142
+ return res.send(fileContent);
143
+ } catch (error) {
144
+ console.log(`❌ Error reading bundle file: ${error.message}`);
145
+ return res.status(500).send('Error reading bundle file');
146
+ }
147
+ } else {
148
+ console.log(`❌ Bundle file not found: ${filePath}`);
149
+ return res.status(404).send('Bundle file not found');
150
+ }
151
+ }
152
+
153
+ // Para archivos no .js, continuar con el middleware estático normal
154
+ next();
155
+ });
156
+
157
+ // Servir otros archivos de bundles (JSON, CSS, etc.) con el middleware estático normal
158
+ app.use('/bundles/', express.static(path.join(__dirname, `../${folderDeployed}`, 'bundles')));
159
+ console.log(`📦 Serving bundles from /${folderDeployed}/bundles`);
160
+
161
+ // Servir framework Slice.js (solo development)
162
+ if (runMode === 'development') {
163
+ app.use('/Slice/', express.static(path.join(__dirname, '..', 'node_modules', 'slicejs-web-framework', 'Slice')));
164
+ }
165
+
166
+ // Servir archivos estáticos del proyecto con allowlist
167
+ const publicFolders = Array.isArray(sliceConfig.publicFolders) ? sliceConfig.publicFolders : [];
168
+ const normalizedPublicFolders = publicFolders
169
+ .filter((entry) => typeof entry === 'string')
170
+ .map((entry) => entry.trim())
171
+ .filter((entry) => entry.length > 0)
172
+ .map((entry) => (entry.startsWith('/') ? entry : `/${entry}`));
173
+
174
+ if (runMode === 'development') {
175
+ app.use(express.static(path.join(__dirname, `../${folderDeployed}`)));
176
+ } else {
177
+ app.use('/App', express.static(path.join(__dirname, `../${folderDeployed}`, 'App')));
178
+ app.get('/manifest.json', (req, res) => {
179
+ const manifestPath = path.join(__dirname, `../${folderDeployed}`, 'manifest.json');
180
+ if (fs.existsSync(manifestPath)) {
181
+ res.setHeader('Content-Type', 'application/json; charset=utf-8');
182
+ return res.send(fs.readFileSync(manifestPath, 'utf8'));
183
+ }
184
+ return res.status(404).send('manifest.json not found');
185
+ });
186
+ app.get('/service-worker.js', (req, res) => {
187
+ const workerPath = path.join(__dirname, `../${folderDeployed}`, 'service-worker.js');
188
+ if (fs.existsSync(workerPath)) {
189
+ res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
190
+ return res.send(fs.readFileSync(workerPath, 'utf8'));
191
+ }
192
+ return res.status(404).send('service-worker.js not found');
193
+ });
194
+ app.get('/routes.js', (req, res) => {
195
+ const routesPath = path.join(__dirname, `../${folderDeployed}`, 'routes.js');
196
+ if (fs.existsSync(routesPath)) {
197
+ res.setHeader('Content-Type', 'application/javascript; charset=utf-8');
198
+ return res.send(fs.readFileSync(routesPath, 'utf8'));
199
+ }
200
+ return res.status(404).send('routes.js not found');
201
+ });
202
+ app.get('/sliceConfig.json', (req, res) => {
203
+ const configPath = path.join(__dirname, `../${folderDeployed}`, 'sliceConfig.json');
204
+ if (fs.existsSync(configPath)) {
205
+ res.setHeader('Content-Type', 'application/json; charset=utf-8');
206
+ return res.send(fs.readFileSync(configPath, 'utf8'));
207
+ }
208
+ return res.status(404).send('sliceConfig.json not found');
209
+ });
210
+ for (const folder of normalizedPublicFolders) {
211
+ app.use(folder, express.static(path.join(__dirname, `../${folderDeployed}`, folder)));
212
+ }
213
+ app.use('/bundles/', express.static(path.join(__dirname, `../${folderDeployed}`, 'bundles')));
214
+ app.use('/dist/', express.static(path.join(__dirname, '..', 'dist')));
215
+ }
216
+
217
+ // ==============================================
218
+ // RUTAS DE API
219
+ // ==============================================
220
+
221
+ // Ruta de ejemplo para API
222
+ app.get('/api/status', (req, res) => {
223
+ res.json({
224
+ status: 'ok',
225
+ mode: runMode,
226
+ folder: folderDeployed,
227
+ timestamp: new Date().toISOString(),
228
+ framework: 'Slice.js',
229
+ version: '2.0.0',
230
+ security: {
231
+ enabled: true,
232
+ mode: 'automatic',
233
+ description: 'Zero-config security - works with any domain'
234
+ }
235
+ });
236
+ });
237
+
238
+
239
+ // ==============================================
240
+ // SPA FALLBACK
241
+ // ==============================================
242
+
243
+ // SPA fallback - servir index.html para rutas no encontradas
244
+ app.get('*', (req, res) => {
245
+ const indexPath = path.join(__dirname, `../${folderDeployed}`, "App", 'index.html');
246
+ res.sendFile(indexPath, (err) => {
247
+ if (err) {
248
+ res.status(404).send(`
249
+ <h1>404 - Page Not Found</h1>
250
+ <p>The requested file could not be found in /${folderDeployed}</p>
251
+ <p>Make sure you've run the appropriate build command:</p>
252
+ <ul>
253
+ <li>For development: Files should be in /src</li>
254
+ <li>For production: Run "npm run slice:build" first</li>
255
+ </ul>
256
+ `);
257
+ }
258
+ });
259
+ });
260
+
261
+ // ==============================================
262
+ // INICIO DEL SERVIDOR
263
+ // ==============================================
264
+
265
+ function startServer() {
266
+ server = app.listen(PORT, () => {
267
+ console.log(`🔒 Security middleware: active (zero-config, automatic)`);
268
+ console.log(`🚀 Slice.js server running on port ${PORT}`);
269
+ });
270
+ }
271
+
272
+ // Manejar cierre del proceso
273
+ process.on('SIGINT', () => {
274
+ console.log('\n🛑 Slice server stopped');
275
+ process.exit(0);
276
+ });
277
+
278
+ process.on('SIGTERM', () => {
279
+ console.log('\n🛑 Server terminated');
280
+ process.exit(0);
281
+ });
282
+
283
+ // Iniciar servidor
284
+ startServer();
285
+
286
+ export default app;