slicejs-web-framework 3.2.2 → 3.2.3

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 (107) hide show
  1. package/.opencode/opencode.json +14 -0
  2. package/LICENSE +21 -21
  3. package/README.md +174 -174
  4. package/Slice/Components/Structural/ContextManager/ContextManager.js +369 -369
  5. package/Slice/Components/Structural/ContextManager/ContextManagerDebugger.js +297 -297
  6. package/Slice/Components/Structural/Controller/Controller.js +1138 -1129
  7. package/Slice/Components/Structural/Controller/allowedValuesValidation.js +52 -0
  8. package/Slice/Components/Structural/Debugger/Debugger.css +619 -619
  9. package/Slice/Components/Structural/Debugger/Debugger.html +72 -72
  10. package/Slice/Components/Structural/Debugger/Debugger.js +1547 -1547
  11. package/Slice/Components/Structural/EventManager/EventManager.js +338 -338
  12. package/Slice/Components/Structural/EventManager/EventManagerDebugger.js +361 -361
  13. package/Slice/Components/Structural/Logger/Log.js +10 -10
  14. package/Slice/Components/Structural/Logger/Logger.js +146 -146
  15. package/Slice/Components/Structural/Router/Router.js +721 -721
  16. package/Slice/Components/Structural/StylesManager/StylesManager.js +78 -78
  17. package/Slice/Components/Structural/StylesManager/ThemeManager/ThemeManager.js +84 -84
  18. package/Slice/Slice.js +542 -542
  19. package/Slice/tests/build-bundled-component-without-category.test.js +103 -103
  20. package/Slice/tests/build-js-only-visual-components.test.js +144 -144
  21. package/Slice/tests/bundle-v2-runtime-contract.test.js +728 -728
  22. package/Slice/tests/props-allowed-values-validation.test.js +119 -0
  23. package/Slice/tests/public-env-runtime-accessors.test.js +44 -44
  24. package/Slice/tests/router-loading-finally.test.js +68 -68
  25. package/api/index.js +286 -286
  26. package/api/middleware/securityMiddleware.js +252 -252
  27. package/api/tests/public-env-resolver.test.js +193 -193
  28. package/api/utils/publicEnvResolver.js +117 -117
  29. package/package.json +38 -38
  30. package/sliceConfig.schema.json +109 -109
  31. package/src/App/index.html +22 -22
  32. package/src/App/index.js +23 -23
  33. package/src/App/style.css +40 -40
  34. package/src/Components/AppComponents/HomePage/HomePage.css +201 -201
  35. package/src/Components/AppComponents/HomePage/HomePage.html +37 -37
  36. package/src/Components/AppComponents/HomePage/HomePage.js +210 -210
  37. package/src/Components/AppComponents/Playground/Playground.css +11 -11
  38. package/src/Components/AppComponents/Playground/Playground.js +111 -111
  39. package/src/Components/Service/FetchManager/FetchManager.js +133 -133
  40. package/src/Components/Service/IndexedDbManager/IndexedDbManager.js +141 -141
  41. package/src/Components/Service/LocalStorageManager/LocalStorageManager.js +45 -45
  42. package/src/Components/Visual/Button/Button.css +47 -47
  43. package/src/Components/Visual/Button/Button.html +5 -5
  44. package/src/Components/Visual/Button/Button.js +92 -92
  45. package/src/Components/Visual/Card/Card.css +68 -68
  46. package/src/Components/Visual/Card/Card.html +7 -7
  47. package/src/Components/Visual/Card/Card.js +107 -107
  48. package/src/Components/Visual/Checkbox/Checkbox.css +87 -87
  49. package/src/Components/Visual/Checkbox/Checkbox.html +8 -8
  50. package/src/Components/Visual/Checkbox/Checkbox.js +86 -86
  51. package/src/Components/Visual/CodeVisualizer/CodeVisualizer.css +129 -129
  52. package/src/Components/Visual/CodeVisualizer/CodeVisualizer.html +3 -3
  53. package/src/Components/Visual/CodeVisualizer/CodeVisualizer.js +262 -262
  54. package/src/Components/Visual/Details/Details.css +70 -70
  55. package/src/Components/Visual/Details/Details.html +9 -9
  56. package/src/Components/Visual/Details/Details.js +76 -76
  57. package/src/Components/Visual/DropDown/DropDown.css +60 -60
  58. package/src/Components/Visual/DropDown/DropDown.html +5 -5
  59. package/src/Components/Visual/DropDown/DropDown.js +63 -63
  60. package/src/Components/Visual/Grid/Grid.css +7 -7
  61. package/src/Components/Visual/Grid/Grid.html +1 -1
  62. package/src/Components/Visual/Grid/Grid.js +57 -57
  63. package/src/Components/Visual/Icon/Icon.css +510 -510
  64. package/src/Components/Visual/Icon/Icon.js +89 -89
  65. package/src/Components/Visual/Icon/slc.json +554 -554
  66. package/src/Components/Visual/Icon/slc.styl +507 -507
  67. package/src/Components/Visual/Icon/slc.svg +1485 -1485
  68. package/src/Components/Visual/Icon/slc.symbol.svg +1058 -1058
  69. package/src/Components/Visual/Input/Input.css +91 -91
  70. package/src/Components/Visual/Input/Input.html +4 -4
  71. package/src/Components/Visual/Input/Input.js +215 -215
  72. package/src/Components/Visual/Layout/Layout.js +49 -49
  73. package/src/Components/Visual/Link/Link.css +8 -8
  74. package/src/Components/Visual/Link/Link.html +1 -1
  75. package/src/Components/Visual/Link/Link.js +63 -63
  76. package/src/Components/Visual/Loading/Loading.css +56 -56
  77. package/src/Components/Visual/Loading/Loading.html +83 -83
  78. package/src/Components/Visual/Loading/Loading.js +38 -38
  79. package/src/Components/Visual/MultiRoute/MultiRoute.js +93 -93
  80. package/src/Components/Visual/Navbar/Navbar.css +115 -115
  81. package/src/Components/Visual/Navbar/Navbar.html +44 -44
  82. package/src/Components/Visual/Navbar/Navbar.js +141 -141
  83. package/src/Components/Visual/NotFound/NotFound.css +116 -116
  84. package/src/Components/Visual/NotFound/NotFound.html +23 -23
  85. package/src/Components/Visual/NotFound/NotFound.js +16 -16
  86. package/src/Components/Visual/Route/Route.js +93 -93
  87. package/src/Components/Visual/Select/Select.css +84 -84
  88. package/src/Components/Visual/Select/Select.html +8 -8
  89. package/src/Components/Visual/Select/Select.js +195 -195
  90. package/src/Components/Visual/Switch/Switch.css +76 -76
  91. package/src/Components/Visual/Switch/Switch.html +8 -8
  92. package/src/Components/Visual/Switch/Switch.js +102 -102
  93. package/src/Components/Visual/TreeItem/TreeItem.css +36 -36
  94. package/src/Components/Visual/TreeItem/TreeItem.html +1 -1
  95. package/src/Components/Visual/TreeItem/TreeItem.js +126 -126
  96. package/src/Components/Visual/TreeView/TreeView.css +8 -8
  97. package/src/Components/Visual/TreeView/TreeView.html +1 -1
  98. package/src/Components/Visual/TreeView/TreeView.js +48 -48
  99. package/src/Components/components.js +27 -27
  100. package/src/Styles/sliceStyles.css +34 -34
  101. package/src/Themes/Dark.css +42 -42
  102. package/src/Themes/Light.css +31 -31
  103. package/src/Themes/Slice.css +47 -47
  104. package/src/routes.js +15 -15
  105. package/src/sliceConfig.json +73 -73
  106. package/src/testing.js +887 -887
  107. package/types/index.d.ts +207 -207
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;