slicejs-web-framework 3.5.4 → 4.0.1

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 (71) hide show
  1. package/.opencode/opencode.json +14 -14
  2. package/LICENSE +21 -21
  3. package/README.md +97 -97
  4. package/Slice/Components/Structural/ContextManager/ContextManager.js +422 -422
  5. package/Slice/Components/Structural/ContextManager/ContextManagerDebugger.js +470 -470
  6. package/Slice/Components/Structural/Controller/Controller.js +1406 -1406
  7. package/Slice/Components/Structural/Controller/allowedValuesValidation.js +52 -52
  8. package/Slice/Components/Structural/Debugger/Debugger.html +72 -72
  9. package/Slice/Components/Structural/Debugger/Debugger.js +1505 -1505
  10. package/Slice/Components/Structural/EventManager/EventManager.js +651 -651
  11. package/Slice/Components/Structural/EventManager/EventManagerDebugger.js +985 -985
  12. package/Slice/Components/Structural/LeakInspector/LeakInspector.js +296 -296
  13. package/Slice/Components/Structural/Logger/Log.js +10 -10
  14. package/Slice/Components/Structural/Logger/LogViewer/LogViewer.js +662 -662
  15. package/Slice/Components/Structural/Logger/Logger.js +225 -225
  16. package/Slice/Components/Structural/Router/Router.js +793 -793
  17. package/Slice/Components/Structural/StylesManager/StylesManager.js +82 -82
  18. package/Slice/Components/Structural/StylesManager/ThemeManager/ThemeManager.js +162 -162
  19. package/Slice/Slice.js +686 -697
  20. package/Slice/tests/build-bundled-component-without-category.test.js +103 -103
  21. package/Slice/tests/build-js-only-visual-components.test.js +144 -144
  22. package/Slice/tests/build-singleton.test.js +244 -244
  23. package/Slice/tests/bundle-v2-runtime-contract.test.js +738 -738
  24. package/Slice/tests/context-patch-use.test.js +95 -95
  25. package/Slice/tests/destroy-cascade.test.js +215 -215
  26. package/Slice/tests/event-emitters.test.js +79 -79
  27. package/Slice/tests/event-registry.test.js +141 -141
  28. package/Slice/tests/fixtures/real-runtime-loader.mjs +21 -21
  29. package/Slice/tests/leak-orphans.test.js +131 -131
  30. package/Slice/tests/props-allowed-values-validation.test.js +119 -119
  31. package/Slice/tests/public-env-runtime-accessors.test.js +44 -44
  32. package/Slice/tests/public-env-typed-accessors.test.js +66 -66
  33. package/Slice/tests/router-loading-finally.test.js +68 -68
  34. package/api/framework/devDepsOptimizer.js +335 -0
  35. package/api/framework/express.js +3 -3
  36. package/api/framework/precompressedStatic.js +93 -0
  37. package/api/framework/publicEnvResolver.js +123 -123
  38. package/api/framework/securityMiddleware.js +197 -197
  39. package/api/framework/server.js +411 -340
  40. package/api/index.js +7 -7
  41. package/api/tests/dev-deps-optimizer.test.js +137 -0
  42. package/api/tests/dev-server-external.test.js +56 -0
  43. package/api/tests/precompressed-static.test.js +119 -0
  44. package/api/tests/public-env-resolver.test.js +193 -193
  45. package/package.json +49 -46
  46. package/sliceConfig.schema.json +122 -126
  47. package/src/App/index.html +69 -69
  48. package/src/App/index.js +20 -20
  49. package/src/App/style.css +11 -11
  50. package/src/Components/AppComponents/AboutSection/AboutSection.css +9 -9
  51. package/src/Components/AppComponents/AboutSection/AboutSection.html +8 -8
  52. package/src/Components/AppComponents/AboutSection/AboutSection.js +12 -12
  53. package/src/Components/AppComponents/AppShell/AppShell.css +10 -10
  54. package/src/Components/AppComponents/AppShell/AppShell.html +4 -4
  55. package/src/Components/AppComponents/AppShell/AppShell.js +36 -36
  56. package/src/Components/AppComponents/HomeSection/HomeSection.css +20 -20
  57. package/src/Components/AppComponents/HomeSection/HomeSection.html +10 -10
  58. package/src/Components/AppComponents/HomeSection/HomeSection.js +19 -19
  59. package/src/Components/components.js +8 -8
  60. package/src/{Styles → public/Styles}/sliceStyles.css +34 -34
  61. package/src/{Themes → public/Themes}/Dark.css +42 -42
  62. package/src/{Themes → public/Themes}/Light.css +31 -31
  63. package/src/{Themes → public/Themes}/Slice.css +47 -47
  64. package/src/{manifest.json → public/manifest.json} +15 -15
  65. package/src/{robots.txt → public/robots.txt} +4 -4
  66. package/src/{sitemap.xml → public/sitemap.xml} +8 -8
  67. package/src/routes.js +9 -9
  68. package/src/sliceConfig.json +72 -78
  69. package/tests/router-emit-ordering.test.js +63 -63
  70. package/types/index.d.ts +219 -219
  71. /package/src/{images → public/images}/favicon.ico +0 -0
@@ -1,103 +1,103 @@
1
- import test from 'node:test';
2
- import assert from 'node:assert/strict';
3
-
4
- globalThis.alert = () => {};
5
-
6
- const { default: Slice } = await import('../Slice.js');
7
-
8
- class FakeController {
9
- constructor() {
10
- this.componentCategories = new Map();
11
- this.templates = new Map();
12
- this.classes = new Map();
13
- this.requestedStyles = new Set();
14
- this.loadedBundles = new Set();
15
- this.activeComponents = new Map();
16
- this.bundleLoads = 0;
17
- }
18
-
19
- getBundleForComponent(componentName) {
20
- return componentName === 'DocumentationPage' ? 'multiroute-DocumentationPage--p1' : null;
21
- }
22
-
23
- async loadBundle(bundleName) {
24
- this.bundleLoads += 1;
25
- this.loadedBundles.add(bundleName);
26
- this.classes.set(
27
- 'DocumentationPage',
28
- class DocumentationPage {
29
- constructor(props) {
30
- this.props = props;
31
- this.sliceId = 'DocumentationPage';
32
- }
33
- async init() {}
34
- }
35
- );
36
- }
37
-
38
- isComponentFromBundle(componentName) {
39
- return componentName === 'DocumentationPage' && this.loadedBundles.has('multiroute-DocumentationPage--p1');
40
- }
41
-
42
- verifyComponentIds() {
43
- return true;
44
- }
45
-
46
- registerComponent() {}
47
-
48
- registerComponentsRecursively() {}
49
- }
50
-
51
- class FakeStylesManager {
52
- registerComponentStyles() {}
53
- }
54
-
55
- function createSlice() {
56
- const instance = new Slice(
57
- {
58
- paths: {
59
- components: {
60
- AppComponents: {
61
- path: '/Components/AppComponents',
62
- type: 'Visual'
63
- }
64
- }
65
- },
66
- themeManager: {},
67
- stylesManager: {},
68
- logger: {},
69
- debugger: { enabled: false },
70
- loading: {},
71
- events: {}
72
- },
73
- {
74
- Controller: FakeController,
75
- StylesManager: FakeStylesManager
76
- }
77
- );
78
-
79
- instance.logger = {
80
- logError() {},
81
- logWarning() {},
82
- logInfo() {}
83
- };
84
-
85
- return instance;
86
- }
87
-
88
- test('build succeeds for bundled component even when componentCategories is missing entry', async () => {
89
- const originalSlice = globalThis.slice;
90
-
91
- try {
92
- const sliceInstance = createSlice();
93
- globalThis.slice = sliceInstance;
94
-
95
- const component = await sliceInstance.build('DocumentationPage', { from: 'route' });
96
-
97
- assert.ok(component);
98
- assert.equal(component.sliceId, 'DocumentationPage');
99
- assert.equal(sliceInstance.controller.bundleLoads, 1);
100
- } finally {
101
- globalThis.slice = originalSlice;
102
- }
103
- });
1
+ import test from 'node:test';
2
+ import assert from 'node:assert/strict';
3
+
4
+ globalThis.alert = () => {};
5
+
6
+ const { default: Slice } = await import('../Slice.js');
7
+
8
+ class FakeController {
9
+ constructor() {
10
+ this.componentCategories = new Map();
11
+ this.templates = new Map();
12
+ this.classes = new Map();
13
+ this.requestedStyles = new Set();
14
+ this.loadedBundles = new Set();
15
+ this.activeComponents = new Map();
16
+ this.bundleLoads = 0;
17
+ }
18
+
19
+ getBundleForComponent(componentName) {
20
+ return componentName === 'DocumentationPage' ? 'multiroute-DocumentationPage--p1' : null;
21
+ }
22
+
23
+ async loadBundle(bundleName) {
24
+ this.bundleLoads += 1;
25
+ this.loadedBundles.add(bundleName);
26
+ this.classes.set(
27
+ 'DocumentationPage',
28
+ class DocumentationPage {
29
+ constructor(props) {
30
+ this.props = props;
31
+ this.sliceId = 'DocumentationPage';
32
+ }
33
+ async init() {}
34
+ }
35
+ );
36
+ }
37
+
38
+ isComponentFromBundle(componentName) {
39
+ return componentName === 'DocumentationPage' && this.loadedBundles.has('multiroute-DocumentationPage--p1');
40
+ }
41
+
42
+ verifyComponentIds() {
43
+ return true;
44
+ }
45
+
46
+ registerComponent() {}
47
+
48
+ registerComponentsRecursively() {}
49
+ }
50
+
51
+ class FakeStylesManager {
52
+ registerComponentStyles() {}
53
+ }
54
+
55
+ function createSlice() {
56
+ const instance = new Slice(
57
+ {
58
+ paths: {
59
+ components: {
60
+ AppComponents: {
61
+ path: '/Components/AppComponents',
62
+ type: 'Visual'
63
+ }
64
+ }
65
+ },
66
+ themeManager: {},
67
+ stylesManager: {},
68
+ logger: {},
69
+ debugger: { enabled: false },
70
+ loading: {},
71
+ events: {}
72
+ },
73
+ {
74
+ Controller: FakeController,
75
+ StylesManager: FakeStylesManager
76
+ }
77
+ );
78
+
79
+ instance.logger = {
80
+ logError() {},
81
+ logWarning() {},
82
+ logInfo() {}
83
+ };
84
+
85
+ return instance;
86
+ }
87
+
88
+ test('build succeeds for bundled component even when componentCategories is missing entry', async () => {
89
+ const originalSlice = globalThis.slice;
90
+
91
+ try {
92
+ const sliceInstance = createSlice();
93
+ globalThis.slice = sliceInstance;
94
+
95
+ const component = await sliceInstance.build('DocumentationPage', { from: 'route' });
96
+
97
+ assert.ok(component);
98
+ assert.equal(component.sliceId, 'DocumentationPage');
99
+ assert.equal(sliceInstance.controller.bundleLoads, 1);
100
+ } finally {
101
+ globalThis.slice = originalSlice;
102
+ }
103
+ });
@@ -1,144 +1,144 @@
1
- import test from 'node:test';
2
- import assert from 'node:assert/strict';
3
-
4
- globalThis.alert = () => {};
5
-
6
- const { default: Slice } = await import('../Slice.js');
7
-
8
- class FakeController {
9
- constructor() {
10
- this.componentCategories = new Map([
11
- ['MultiRoute', 'Visual'],
12
- ['Route', 'Visual'],
13
- ['Link', 'Visual'],
14
- ['Button', 'Visual']
15
- ]);
16
- this.templates = new Map();
17
- this.classes = new Map();
18
- this.requestedStyles = new Set();
19
- this.loadedBundles = new Set();
20
- this.activeComponents = new Map();
21
- this.fetchCalls = 0;
22
- }
23
-
24
- getBundleForComponent() {
25
- return null;
26
- }
27
-
28
- isComponentFromBundle() {
29
- return false;
30
- }
31
-
32
- async fetchText() {
33
- this.fetchCalls += 1;
34
- throw new Error('fetchText should not be called for js-only visual components');
35
- }
36
-
37
- verifyComponentIds() {
38
- return true;
39
- }
40
-
41
- registerComponent() {}
42
-
43
- registerComponentsRecursively() {}
44
- }
45
-
46
- class FakeStylesManager {
47
- registerComponentStyles() {}
48
- }
49
-
50
- function createSlice() {
51
- const instance = new Slice(
52
- {
53
- paths: {
54
- components: {
55
- Visual: {
56
- path: '/Components/Visual',
57
- type: 'Visual'
58
- }
59
- }
60
- },
61
- themeManager: {},
62
- stylesManager: {},
63
- logger: {},
64
- debugger: { enabled: false },
65
- loading: {},
66
- events: {}
67
- },
68
- {
69
- Controller: FakeController,
70
- StylesManager: FakeStylesManager
71
- }
72
- );
73
-
74
- instance.logger = {
75
- logError() {},
76
- logWarning() {},
77
- logInfo() {}
78
- };
79
-
80
- return instance;
81
- }
82
-
83
- test('build does not fetch html/css for MultiRoute and Route', async () => {
84
- const originalSlice = globalThis.slice;
85
-
86
- try {
87
- const sliceInstance = createSlice();
88
- globalThis.slice = sliceInstance;
89
-
90
- class MultiRouteComponent {
91
- constructor(props) {
92
- this.props = props;
93
- this.sliceId = 'MultiRoute';
94
- }
95
- async init() {}
96
- }
97
-
98
- class RouteComponent {
99
- constructor(props) {
100
- this.props = props;
101
- this.sliceId = 'Route';
102
- }
103
- async init() {}
104
- }
105
-
106
- sliceInstance.controller.classes.set('MultiRoute', MultiRouteComponent);
107
- sliceInstance.controller.classes.set('Route', RouteComponent);
108
-
109
- const builtMultiRoute = await sliceInstance.build('MultiRoute', {});
110
- const builtRoute = await sliceInstance.build('Route', {});
111
-
112
- assert.ok(builtMultiRoute, 'Expected MultiRoute instance to be created');
113
- assert.ok(builtRoute, 'Expected Route instance to be created');
114
- assert.equal(sliceInstance.controller.fetchCalls, 0);
115
- } finally {
116
- globalThis.slice = originalSlice;
117
- }
118
- });
119
-
120
- test('build still fetches html/css for Link', async () => {
121
- const originalSlice = globalThis.slice;
122
-
123
- try {
124
- const sliceInstance = createSlice();
125
- globalThis.slice = sliceInstance;
126
-
127
- class LinkComponent {
128
- constructor(props) {
129
- this.props = props;
130
- this.sliceId = 'Link';
131
- }
132
- async init() {}
133
- }
134
-
135
- sliceInstance.controller.classes.set('Link', LinkComponent);
136
-
137
- const builtLink = await sliceInstance.build('Link', {});
138
-
139
- assert.equal(builtLink, null);
140
- assert.ok(sliceInstance.controller.fetchCalls > 0, 'Expected Link to trigger resource fetches');
141
- } finally {
142
- globalThis.slice = originalSlice;
143
- }
144
- });
1
+ import test from 'node:test';
2
+ import assert from 'node:assert/strict';
3
+
4
+ globalThis.alert = () => {};
5
+
6
+ const { default: Slice } = await import('../Slice.js');
7
+
8
+ class FakeController {
9
+ constructor() {
10
+ this.componentCategories = new Map([
11
+ ['MultiRoute', 'Visual'],
12
+ ['Route', 'Visual'],
13
+ ['Link', 'Visual'],
14
+ ['Button', 'Visual']
15
+ ]);
16
+ this.templates = new Map();
17
+ this.classes = new Map();
18
+ this.requestedStyles = new Set();
19
+ this.loadedBundles = new Set();
20
+ this.activeComponents = new Map();
21
+ this.fetchCalls = 0;
22
+ }
23
+
24
+ getBundleForComponent() {
25
+ return null;
26
+ }
27
+
28
+ isComponentFromBundle() {
29
+ return false;
30
+ }
31
+
32
+ async fetchText() {
33
+ this.fetchCalls += 1;
34
+ throw new Error('fetchText should not be called for js-only visual components');
35
+ }
36
+
37
+ verifyComponentIds() {
38
+ return true;
39
+ }
40
+
41
+ registerComponent() {}
42
+
43
+ registerComponentsRecursively() {}
44
+ }
45
+
46
+ class FakeStylesManager {
47
+ registerComponentStyles() {}
48
+ }
49
+
50
+ function createSlice() {
51
+ const instance = new Slice(
52
+ {
53
+ paths: {
54
+ components: {
55
+ Visual: {
56
+ path: '/Components/Visual',
57
+ type: 'Visual'
58
+ }
59
+ }
60
+ },
61
+ themeManager: {},
62
+ stylesManager: {},
63
+ logger: {},
64
+ debugger: { enabled: false },
65
+ loading: {},
66
+ events: {}
67
+ },
68
+ {
69
+ Controller: FakeController,
70
+ StylesManager: FakeStylesManager
71
+ }
72
+ );
73
+
74
+ instance.logger = {
75
+ logError() {},
76
+ logWarning() {},
77
+ logInfo() {}
78
+ };
79
+
80
+ return instance;
81
+ }
82
+
83
+ test('build does not fetch html/css for MultiRoute and Route', async () => {
84
+ const originalSlice = globalThis.slice;
85
+
86
+ try {
87
+ const sliceInstance = createSlice();
88
+ globalThis.slice = sliceInstance;
89
+
90
+ class MultiRouteComponent {
91
+ constructor(props) {
92
+ this.props = props;
93
+ this.sliceId = 'MultiRoute';
94
+ }
95
+ async init() {}
96
+ }
97
+
98
+ class RouteComponent {
99
+ constructor(props) {
100
+ this.props = props;
101
+ this.sliceId = 'Route';
102
+ }
103
+ async init() {}
104
+ }
105
+
106
+ sliceInstance.controller.classes.set('MultiRoute', MultiRouteComponent);
107
+ sliceInstance.controller.classes.set('Route', RouteComponent);
108
+
109
+ const builtMultiRoute = await sliceInstance.build('MultiRoute', {});
110
+ const builtRoute = await sliceInstance.build('Route', {});
111
+
112
+ assert.ok(builtMultiRoute, 'Expected MultiRoute instance to be created');
113
+ assert.ok(builtRoute, 'Expected Route instance to be created');
114
+ assert.equal(sliceInstance.controller.fetchCalls, 0);
115
+ } finally {
116
+ globalThis.slice = originalSlice;
117
+ }
118
+ });
119
+
120
+ test('build still fetches html/css for Link', async () => {
121
+ const originalSlice = globalThis.slice;
122
+
123
+ try {
124
+ const sliceInstance = createSlice();
125
+ globalThis.slice = sliceInstance;
126
+
127
+ class LinkComponent {
128
+ constructor(props) {
129
+ this.props = props;
130
+ this.sliceId = 'Link';
131
+ }
132
+ async init() {}
133
+ }
134
+
135
+ sliceInstance.controller.classes.set('Link', LinkComponent);
136
+
137
+ const builtLink = await sliceInstance.build('Link', {});
138
+
139
+ assert.equal(builtLink, null);
140
+ assert.ok(sliceInstance.controller.fetchCalls > 0, 'Expected Link to trigger resource fetches');
141
+ } finally {
142
+ globalThis.slice = originalSlice;
143
+ }
144
+ });