fragment-ts 3.0.16 → 3.0.18
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.
- package/dist/platform/cli/scaffold/init/init.scaffold.js +2 -2
- package/dist/platform/web/react/fragment-react-runtime.d.ts.map +1 -1
- package/dist/platform/web/react/fragment-react-runtime.js +14 -6
- package/dist/platform/web/react/fragment-react-runtime.js.map +1 -1
- package/dist/platform/web/react/react-page-renderer.d.ts.map +1 -1
- package/dist/platform/web/react/react-page-renderer.js +75 -69
- package/dist/platform/web/react/react-page-renderer.js.map +1 -1
- package/package.json +1 -1
|
@@ -69,7 +69,7 @@ async function generatePluginProject(projectPath, config) {
|
|
|
69
69
|
},
|
|
70
70
|
keywords: ["fragment", "fragment-plugin"],
|
|
71
71
|
peerDependencies: {
|
|
72
|
-
"fragment-ts": "^3.0.
|
|
72
|
+
"fragment-ts": "^3.0.18",
|
|
73
73
|
},
|
|
74
74
|
devDependencies: {
|
|
75
75
|
typescript: "^5.3.3",
|
|
@@ -127,7 +127,7 @@ async function createConfigFiles(projectPath, projectName, config) {
|
|
|
127
127
|
devDependencies.prettier = "^3.2.5";
|
|
128
128
|
}
|
|
129
129
|
const dependencies = {
|
|
130
|
-
"fragment-ts": "^3.0.
|
|
130
|
+
"fragment-ts": "^3.0.18",
|
|
131
131
|
"reflect-metadata": "^0.1.13",
|
|
132
132
|
};
|
|
133
133
|
devDependencies["@types/react"] = "^18.0.0",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fragment-react-runtime.d.ts","sourceRoot":"","sources":["../../../../src/platform/web/react/fragment-react-runtime.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;
|
|
1
|
+
{"version":3,"file":"fragment-react-runtime.d.ts","sourceRoot":"","sources":["../../../../src/platform/web/react/fragment-react-runtime.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AAKvF;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,GAAG,GAAG,kBAAkB,CAKtE;AAED,wBAAgB,uBAAuB,CACrC,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EACxD,cAAc,EAAE,UAAU,GAAG,GAAG,CAAC,KAAK,EAAE,MAAM,KAAK,GAAG,CA6FvD;AAED,wBAAgB,uBAAuB,CACrC,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EACxD,cAAc,EAAE,UAAU,GAAG,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG,CAMpD;AAED;;;;;GAKG;AACH,wBAAgB,0BAA0B,CACxC,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAExD,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,GAAG,EAC9B,IAAI,GAAE,kBAA6B,GAClC,CAAC,KAAK,EAAE,MAAM,KAAK,GAAG,CA2BxB;AAED,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,KAAK,EAAE,UAAU,MAAM,GAAG,MAAM,CAExE;AAED,wBAAgB,aAAa,CAAC,MAAM,EAAE,MAAM,EAC1C,KAAK,EAAE,UAAU,MAAM,EACvB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,GAClC,MAAM,CAGR"}
|
|
@@ -8,7 +8,8 @@ exports.useFragmentStore = useFragmentStore;
|
|
|
8
8
|
exports.useStoreState = useStoreState;
|
|
9
9
|
const di_container_1 = require("../../../core/container/di-container");
|
|
10
10
|
const metadata_keys_1 = require("../../../core/metadata/metadata-keys");
|
|
11
|
-
const
|
|
11
|
+
const React = require("react");
|
|
12
|
+
const componentCache = new Map();
|
|
12
13
|
/**
|
|
13
14
|
* Returns the render mode for a component class.
|
|
14
15
|
* Defaults to "server" if no metadata is set.
|
|
@@ -33,7 +34,7 @@ function createFragmentComponent(componentClass) {
|
|
|
33
34
|
source.prototype instanceof React.PureComponent;
|
|
34
35
|
let wrapped;
|
|
35
36
|
if (mode === "client") {
|
|
36
|
-
// Client-only:
|
|
37
|
+
// Client-only: SSR placeholder, hydrated on browser
|
|
37
38
|
wrapped = (props) => {
|
|
38
39
|
const placeholderId = `fragment-client-${source.name}`;
|
|
39
40
|
return React.createElement("div", {
|
|
@@ -45,22 +46,20 @@ function createFragmentComponent(componentClass) {
|
|
|
45
46
|
};
|
|
46
47
|
}
|
|
47
48
|
else if (isReactComponent) {
|
|
48
|
-
//
|
|
49
|
-
// wrap as observer function component so hooks work inside render()
|
|
49
|
+
// React.Component based class wrapper
|
|
50
50
|
wrapped = observer((props) => {
|
|
51
51
|
const useRef = React.useRef;
|
|
52
52
|
const instanceRef = useRef(null);
|
|
53
53
|
if (!instanceRef.current) {
|
|
54
54
|
instanceRef.current = new source(props);
|
|
55
55
|
}
|
|
56
|
-
// Keep props in sync on every render
|
|
57
56
|
instanceRef.current.props = props;
|
|
58
57
|
Object.assign(instanceRef.current, props);
|
|
59
58
|
return instanceRef.current.render();
|
|
60
59
|
});
|
|
61
60
|
}
|
|
62
61
|
else {
|
|
63
|
-
//
|
|
62
|
+
// Plain DI-managed class
|
|
64
63
|
wrapped = observer((props) => {
|
|
65
64
|
const instance = container.resolve(source);
|
|
66
65
|
Object.assign(instance, props || {});
|
|
@@ -73,6 +72,15 @@ function createFragmentComponent(componentClass) {
|
|
|
73
72
|
return null;
|
|
74
73
|
});
|
|
75
74
|
}
|
|
75
|
+
const globalAny = typeof globalThis !== "undefined"
|
|
76
|
+
? globalThis
|
|
77
|
+
: {};
|
|
78
|
+
globalAny.__fragmentRegistry__ =
|
|
79
|
+
globalAny.__fragmentRegistry__ || {};
|
|
80
|
+
globalAny.__fragmentRegistry__[source.name] = wrapped;
|
|
81
|
+
// ================================
|
|
82
|
+
// metadata
|
|
83
|
+
// ================================
|
|
76
84
|
wrapped.displayName = source.name;
|
|
77
85
|
wrapped.__fragmentOriginalTarget = source;
|
|
78
86
|
wrapped.__fragmentRenderMode = mode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fragment-react-runtime.js","sourceRoot":"","sources":["../../../../src/platform/web/react/fragment-react-runtime.ts"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"fragment-react-runtime.js","sourceRoot":"","sources":["../../../../src/platform/web/react/fragment-react-runtime.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-page-renderer.d.ts","sourceRoot":"","sources":["../../../../src/platform/web/react/react-page-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAOlC,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;
|
|
1
|
+
{"version":3,"file":"react-page-renderer.d.ts","sourceRoot":"","sources":["../../../../src/platform/web/react/react-page-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAOlC,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA2ED,qBAAa,iBAAiB;WACf,MAAM,CAAC,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,OAAO,GAAG,OAAO,CAAC,mBAAmB,CAAC;IA4I9E,OAAO,CAAC,MAAM,CAAC,gBAAgB;CAgChC"}
|
|
@@ -6,11 +6,9 @@ const di_container_1 = require("../../../core/container/di-container");
|
|
|
6
6
|
const metadata_storage_1 = require("../../../core/metadata/metadata-storage");
|
|
7
7
|
const route_pointer_registry_1 = require("../route-pointer/route-pointer-registry");
|
|
8
8
|
const config_utils_1 = require("../../../shared/config.utils");
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
* registered component name.
|
|
13
|
-
*/
|
|
9
|
+
/* =========================
|
|
10
|
+
SERIALIZATION
|
|
11
|
+
========================= */
|
|
14
12
|
function serializeElement(element) {
|
|
15
13
|
if (element === null || element === undefined)
|
|
16
14
|
return null;
|
|
@@ -21,11 +19,10 @@ function serializeElement(element) {
|
|
|
21
19
|
if (Array.isArray(element)) {
|
|
22
20
|
return element.map(serializeElement);
|
|
23
21
|
}
|
|
24
|
-
// React element shape
|
|
25
22
|
if (element && element.$$typeof) {
|
|
26
23
|
const type = element.type;
|
|
27
24
|
const props = element.props || {};
|
|
28
|
-
//
|
|
25
|
+
// HTML elements
|
|
29
26
|
if (typeof type === "string") {
|
|
30
27
|
const { children, ...rest } = props;
|
|
31
28
|
return {
|
|
@@ -34,7 +31,7 @@ function serializeElement(element) {
|
|
|
34
31
|
children: children !== undefined ? serializeElement(children) : null,
|
|
35
32
|
};
|
|
36
33
|
}
|
|
37
|
-
// Fragment
|
|
34
|
+
// Fragment components
|
|
38
35
|
const name = type.__fragmentOriginalTarget?.name ||
|
|
39
36
|
type.displayName ||
|
|
40
37
|
type.name ||
|
|
@@ -50,7 +47,6 @@ function serializeElement(element) {
|
|
|
50
47
|
}
|
|
51
48
|
return null;
|
|
52
49
|
}
|
|
53
|
-
/** Strip non-serializable values (functions, symbols) from props */
|
|
54
50
|
function sanitizeProps(props) {
|
|
55
51
|
const out = {};
|
|
56
52
|
for (const [k, v] of Object.entries(props)) {
|
|
@@ -62,7 +58,7 @@ function sanitizeProps(props) {
|
|
|
62
58
|
out[k] = v;
|
|
63
59
|
}
|
|
64
60
|
catch {
|
|
65
|
-
|
|
61
|
+
continue;
|
|
66
62
|
}
|
|
67
63
|
continue;
|
|
68
64
|
}
|
|
@@ -70,21 +66,17 @@ function sanitizeProps(props) {
|
|
|
70
66
|
}
|
|
71
67
|
return out;
|
|
72
68
|
}
|
|
69
|
+
/* =========================
|
|
70
|
+
RENDERER
|
|
71
|
+
========================= */
|
|
73
72
|
class ReactPageRenderer {
|
|
74
73
|
static async render(instance, req) {
|
|
75
|
-
|
|
76
|
-
try {
|
|
77
|
-
reactDomServer = require("react-dom/server");
|
|
78
|
-
}
|
|
79
|
-
catch {
|
|
80
|
-
throw new Error("react-dom/server is not installed. Run `frg install:web` or add react/react-dom to your project.");
|
|
81
|
-
}
|
|
74
|
+
const reactDomServer = require("react-dom/server");
|
|
82
75
|
const metadata = Reflect.getMetadata(metadata_keys_1.METADATA_KEYS.WEB_PAGE, instance.constructor) || {};
|
|
83
76
|
const renderOutput = await Promise.resolve(typeof instance.render === "function" ? instance.render(req) : "");
|
|
84
77
|
const body = typeof renderOutput === "string"
|
|
85
78
|
? renderOutput
|
|
86
79
|
: reactDomServer.renderToString(renderOutput);
|
|
87
|
-
// Serialize the element tree so the client runtime can re-render it
|
|
88
80
|
const elementTree = typeof renderOutput === "string" ? null : serializeElement(renderOutput);
|
|
89
81
|
const title = (typeof instance.title === "function"
|
|
90
82
|
? instance.title(req)
|
|
@@ -103,96 +95,107 @@ class ReactPageRenderer {
|
|
|
103
95
|
const stylingScript = webConfig.styling?.provider === "tailwind"
|
|
104
96
|
? `<script src="https://cdn.tailwindcss.com"></script>`
|
|
105
97
|
: "";
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
98
|
+
/* =========================
|
|
99
|
+
HYDRATION SCRIPT
|
|
100
|
+
========================= */
|
|
109
101
|
const hydrationScript = elementTree
|
|
110
102
|
? `
|
|
111
103
|
<script type="importmap">
|
|
112
104
|
{
|
|
113
105
|
"imports": {
|
|
114
|
-
"react":
|
|
115
|
-
"react-dom":
|
|
116
|
-
"react-dom/client":"https://esm.sh/react-dom@18/client?dev",
|
|
117
|
-
"mobx":
|
|
118
|
-
"mobx-react-lite":"https://esm.sh/mobx-react-lite@3?dev"
|
|
106
|
+
"react": "https://esm.sh/react@18?dev",
|
|
107
|
+
"react-dom": "https://esm.sh/react-dom@18?dev",
|
|
108
|
+
"react-dom/client": "https://esm.sh/react-dom@18/client?dev",
|
|
109
|
+
"mobx": "https://esm.sh/mobx@6?dev",
|
|
110
|
+
"mobx-react-lite": "https://esm.sh/mobx-react-lite@3?dev"
|
|
119
111
|
}
|
|
120
112
|
}
|
|
121
113
|
</script>
|
|
114
|
+
|
|
122
115
|
<script type="module">
|
|
123
|
-
import React from
|
|
124
|
-
import { createRoot } from
|
|
125
|
-
import { observable, action, computed, makeObservable } from 'mobx';
|
|
126
|
-
import { observer } from 'mobx-react-lite';
|
|
116
|
+
import React from "react";
|
|
117
|
+
import { createRoot } from "react-dom/client";
|
|
127
118
|
|
|
128
|
-
/* ── serialized element tree from SSR ── */
|
|
129
119
|
const TREE = ${JSON.stringify(elementTree)};
|
|
130
120
|
|
|
131
|
-
/*
|
|
132
|
-
const REGISTRY =
|
|
133
|
-
|
|
134
|
-
/* ── store registry ── */
|
|
135
|
-
const STORES = window.__fragmentStores__ = window.__fragmentStores__ || {};
|
|
121
|
+
/* registry */
|
|
122
|
+
const REGISTRY =
|
|
123
|
+
(window.__fragmentRegistry__ = window.__fragmentRegistry__ || {});
|
|
136
124
|
|
|
137
|
-
/*
|
|
125
|
+
/* safe resolver */
|
|
138
126
|
function h(node) {
|
|
139
127
|
if (node === null || node === undefined) return null;
|
|
140
|
-
if (typeof node ===
|
|
128
|
+
if (typeof node === "string" || typeof node === "number") return node;
|
|
141
129
|
if (Array.isArray(node)) return node.map(h);
|
|
142
130
|
|
|
143
131
|
const { type, props = {}, children } = node;
|
|
132
|
+
|
|
144
133
|
const Component = REGISTRY[type] || type;
|
|
145
|
-
|
|
134
|
+
|
|
135
|
+
if (!Component) {
|
|
136
|
+
console.warn("[Fragment] Missing component:", type);
|
|
137
|
+
return null;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
const resolvedChildren =
|
|
141
|
+
children !== null && children !== undefined ? h(children) : undefined;
|
|
142
|
+
|
|
146
143
|
return React.createElement(Component, props, resolvedChildren);
|
|
147
144
|
}
|
|
148
145
|
|
|
149
|
-
/*
|
|
150
|
-
|
|
151
|
-
const app = document.getElementById(
|
|
146
|
+
/* hydration bootstrap */
|
|
147
|
+
function boot() {
|
|
148
|
+
const app = document.getElementById("app");
|
|
152
149
|
if (!app) return;
|
|
153
150
|
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
}
|
|
164
|
-
}
|
|
165
|
-
|
|
151
|
+
const root = createRoot(app);
|
|
152
|
+
root.render(h(TREE));
|
|
153
|
+
|
|
154
|
+
console.log("[Fragment] client hydration complete");
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
if (document.readyState === "loading") {
|
|
158
|
+
document.addEventListener("DOMContentLoaded", () => {
|
|
159
|
+
requestAnimationFrame(boot);
|
|
160
|
+
});
|
|
161
|
+
} else {
|
|
162
|
+
requestAnimationFrame(boot);
|
|
163
|
+
}
|
|
164
|
+
</script>
|
|
165
|
+
`
|
|
166
166
|
: "";
|
|
167
167
|
return {
|
|
168
168
|
title,
|
|
169
169
|
html: `<!doctype html>
|
|
170
170
|
<html lang="en">
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
171
|
+
<head>
|
|
172
|
+
<meta charset="utf-8"/>
|
|
173
|
+
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
|
174
|
+
<title>${escapeHtml(String(title))}</title>
|
|
175
|
+
${stylesheetTag}
|
|
176
|
+
${stylingScript}
|
|
177
|
+
</head>
|
|
178
|
+
<body>
|
|
179
|
+
<div id="app">${content}</div>
|
|
180
|
+
${routePointerScript ? `<script>${routePointerScript}</script>` : ""}
|
|
181
|
+
${hydrationScript}
|
|
182
|
+
</body>
|
|
183
183
|
</html>`,
|
|
184
184
|
};
|
|
185
185
|
}
|
|
186
|
+
/* =========================
|
|
187
|
+
TEMPLATE WRAPPER
|
|
188
|
+
========================= */
|
|
186
189
|
static wrapWithTemplate(childHtml, templateName, req) {
|
|
187
190
|
const React = require("react");
|
|
188
191
|
const reactDomServer = require("react-dom/server");
|
|
189
192
|
const templateMeta = metadata_storage_1.MetadataStorage.getInstance()
|
|
190
193
|
.getAllClasses()
|
|
191
194
|
.find((entry) => entry.type === "template" &&
|
|
192
|
-
Reflect.getMetadata(metadata_keys_1.METADATA_KEYS.FRAGMENT_TEMPLATE, entry.target)
|
|
193
|
-
|
|
195
|
+
Reflect.getMetadata(metadata_keys_1.METADATA_KEYS.FRAGMENT_TEMPLATE, entry.target)
|
|
196
|
+
?.name === templateName);
|
|
197
|
+
if (!templateMeta)
|
|
194
198
|
return childHtml;
|
|
195
|
-
}
|
|
196
199
|
const templateInstance = di_container_1.DIContainer.getInstance().resolve(templateMeta.target);
|
|
197
200
|
const rendered = templateInstance.render({
|
|
198
201
|
req,
|
|
@@ -204,6 +207,9 @@ window.addEventListener('DOMContentLoaded', () => {
|
|
|
204
207
|
}
|
|
205
208
|
}
|
|
206
209
|
exports.ReactPageRenderer = ReactPageRenderer;
|
|
210
|
+
/* =========================
|
|
211
|
+
UTIL
|
|
212
|
+
========================= */
|
|
207
213
|
function escapeHtml(value) {
|
|
208
214
|
return value
|
|
209
215
|
.replace(/&/g, "&")
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-page-renderer.js","sourceRoot":"","sources":["../../../../src/platform/web/react/react-page-renderer.ts"],"names":[],"mappings":";;;AACA,wEAAqE;AACrE,uEAAmE;AACnE,8EAA0E;AAC1E,oFAA+E;AAC/E,+DAA2D;AAO3D
|
|
1
|
+
{"version":3,"file":"react-page-renderer.js","sourceRoot":"","sources":["../../../../src/platform/web/react/react-page-renderer.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "fragment-ts",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.18",
|
|
4
4
|
"description": "Fragment TS is a Spring Boot-inspired TypeScript framework for Express and TypeORM, built around dependency injection and decorators, with a fully modular CLI. It now supports installable API and Web surfaces so backend controllers and React-driven pages can live in one modular runtime.",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|