Skip to content

Commit 44cb785

Browse files
ArchmongerArchmonger
committed
Bump javascript dependencies
1 parent 741de48 commit 44cb785

File tree

2 files changed

+80
-78
lines changed

2 files changed

+80
-78
lines changed

‎src/js/package.json

+12-12
Original file line numberDiff line numberDiff line change
@@ -8,22 +8,22 @@
88
"check": "prettier --check . && eslint"
99
},
1010
"devDependencies": {
11-
"@rollup/plugin-commonjs": "^25.0.7",
12-
"@rollup/plugin-node-resolve": "^15.2.3",
13-
"@rollup/plugin-replace": "^5.0.5",
11+
"@rollup/plugin-commonjs": "^28.0.1",
12+
"@rollup/plugin-node-resolve": "^15.3.0",
13+
"@rollup/plugin-replace": "^6.0.1",
1414
"@types/react": "^18.2.48",
1515
"@types/react-dom": "^18.2.18",
16-
"eslint": "^8.38.0",
17-
"eslint-plugin-react": "^7.32.2",
18-
"prettier": "^3.2.3",
19-
"rollup": "^4.9.5",
20-
"typescript": "^5.3.3"
16+
"eslint": "^9.13.0",
17+
"eslint-plugin-react": "^7.37.1",
18+
"prettier": "^3.3.3",
19+
"rollup": "^4.24.0",
20+
"typescript": "^5.6.3"
2121
},
2222
"dependencies": {
23-
"@pyscript/core": "^0.4.48",
23+
"@pyscript/core": "^0.6.7",
2424
"@reactpy/client": "^0.3.1",
25-
"@rollup/plugin-typescript": "^11.1.6",
26-
"morphdom": "^2.7.3",
27-
"tslib": "^2.6.2"
25+
"@rollup/plugin-typescript": "^12.1.1",
26+
"morphdom": "^2.7.4",
27+
"tslib": "^2.8.0"
2828
}
2929
}

‎src/js/src/index.tsx

+68-66
Original file line numberDiff line numberDiff line change
@@ -1,81 +1,83 @@
11
import { ReactPyDjangoClient } from "./client";
22
import React from "react";
3-
import { render } from "react-dom";
3+
import ReactDOM from "react-dom";
44
import { Layout } from "@reactpy/client/src/components";
55

66
export function mountComponent(
7-
mountElement: HTMLElement,
8-
host: string,
9-
urlPrefix: string,
10-
componentPath: string,
11-
resolvedJsModulesPath: string,
12-
reconnectStartInterval: number,
13-
reconnectMaxInterval: number,
14-
reconnectMaxRetries: number,
15-
reconnectBackoffMultiplier: number,
7+
mountElement: HTMLElement,
8+
host: string,
9+
urlPrefix: string,
10+
componentPath: string,
11+
resolvedJsModulesPath: string,
12+
reconnectStartInterval: number,
13+
reconnectMaxInterval: number,
14+
reconnectMaxRetries: number,
15+
reconnectBackoffMultiplier: number,
1616
) {
17-
// Protocols
18-
let httpProtocol = window.location.protocol;
19-
let wsProtocol = `ws${httpProtocol === "https:" ? "s" : ""}:`;
17+
// Protocols
18+
let httpProtocol = window.location.protocol;
19+
let wsProtocol = `ws${httpProtocol === "https:" ? "s" : ""}:`;
2020

21-
// WebSocket route (for Python components)
22-
let wsOrigin: string;
23-
if (host) {
24-
wsOrigin = `${wsProtocol}//${host}`;
25-
} else {
26-
wsOrigin = `${wsProtocol}//${window.location.host}`;
27-
}
28-
29-
// HTTP route (for JavaScript modules)
30-
let httpOrigin: string;
31-
let jsModulesPath: string;
32-
if (host) {
33-
httpOrigin = `${httpProtocol}//${host}`;
34-
jsModulesPath = `${urlPrefix}/web_module`;
35-
} else {
36-
httpOrigin = `${httpProtocol}//${window.location.host}`;
37-
if (resolvedJsModulesPath) {
38-
jsModulesPath = resolvedJsModulesPath;
21+
// WebSocket route (for Python components)
22+
let wsOrigin: string;
23+
if (host) {
24+
wsOrigin = `${wsProtocol}//${host}`;
3925
} else {
40-
jsModulesPath = `${urlPrefix}/web_module`;
26+
wsOrigin = `${wsProtocol}//${window.location.host}`;
4127
}
42-
}
4328

44-
// Embed the initial HTTP path into the WebSocket URL
45-
let componentUrl = new URL(`${wsOrigin}/${urlPrefix}/${componentPath}`);
46-
componentUrl.searchParams.append("http_pathname", window.location.pathname);
47-
if (window.location.search) {
48-
componentUrl.searchParams.append("http_search", window.location.search);
49-
}
29+
// HTTP route (for JavaScript modules)
30+
let httpOrigin: string;
31+
let jsModulesPath: string;
32+
if (host) {
33+
httpOrigin = `${httpProtocol}//${host}`;
34+
jsModulesPath = `${urlPrefix}/web_module`;
35+
} else {
36+
httpOrigin = `${httpProtocol}//${window.location.host}`;
37+
if (resolvedJsModulesPath) {
38+
jsModulesPath = resolvedJsModulesPath;
39+
} else {
40+
jsModulesPath = `${urlPrefix}/web_module`;
41+
}
42+
}
5043

51-
// Configure a new ReactPy client
52-
const client = new ReactPyDjangoClient({
53-
urls: {
54-
componentUrl: componentUrl,
55-
query: document.location.search,
56-
jsModules: `${httpOrigin}/${jsModulesPath}`,
57-
},
58-
reconnectOptions: {
59-
startInterval: reconnectStartInterval,
60-
maxInterval: reconnectMaxInterval,
61-
backoffMultiplier: reconnectBackoffMultiplier,
62-
maxRetries: reconnectMaxRetries,
63-
},
64-
mountElement: mountElement,
65-
prerenderElement: document.getElementById(mountElement.id + "-prerender"),
66-
offlineElement: document.getElementById(mountElement.id + "-offline"),
67-
});
44+
// Embed the initial HTTP path into the WebSocket URL
45+
let componentUrl = new URL(`${wsOrigin}/${urlPrefix}/${componentPath}`);
46+
componentUrl.searchParams.append("http_pathname", window.location.pathname);
47+
if (window.location.search) {
48+
componentUrl.searchParams.append("http_search", window.location.search);
49+
}
6850

69-
// Replace the prerender element with the real element on the first layout update
70-
if (client.prerenderElement) {
71-
client.onMessage("layout-update", ({ path, model }) => {
72-
if (client.prerenderElement) {
73-
client.prerenderElement.replaceWith(client.mountElement);
74-
client.prerenderElement = null;
75-
}
51+
// Configure a new ReactPy client
52+
const client = new ReactPyDjangoClient({
53+
urls: {
54+
componentUrl: componentUrl,
55+
query: document.location.search,
56+
jsModules: `${httpOrigin}/${jsModulesPath}`,
57+
},
58+
reconnectOptions: {
59+
startInterval: reconnectStartInterval,
60+
maxInterval: reconnectMaxInterval,
61+
backoffMultiplier: reconnectBackoffMultiplier,
62+
maxRetries: reconnectMaxRetries,
63+
},
64+
mountElement: mountElement,
65+
prerenderElement: document.getElementById(
66+
mountElement.id + "-prerender",
67+
),
68+
offlineElement: document.getElementById(mountElement.id + "-offline"),
7669
});
77-
}
7870

79-
// Start rendering the component
80-
render(<Layout client={client} />, client.mountElement);
71+
// Replace the prerender element with the real element on the first layout update
72+
if (client.prerenderElement) {
73+
client.onMessage("layout-update", ({ path, model }) => {
74+
if (client.prerenderElement) {
75+
client.prerenderElement.replaceWith(client.mountElement);
76+
client.prerenderElement = null;
77+
}
78+
});
79+
}
80+
81+
// Start rendering the component
82+
ReactDOM.render(<Layout client={client} />, client.mountElement);
8183
}

0 commit comments

Comments
 (0)