Skip to content

Commit 7134fc2

Browse files
freddyaboultongradio-pr-botpngwn
authored
Custom component fixes (#9711)
* add code * Add code * add changeset * compatible lockfile * add code * add changeset * trigger-ci --------- Co-authored-by: gradio-pr-bot <[email protected]> Co-authored-by: pngwn <[email protected]>
1 parent f118587 commit 7134fc2

File tree

11 files changed

+122
-66
lines changed

11 files changed

+122
-66
lines changed

‎.changeset/hot-dancers-drop.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
"@gradio/atoms": patch
3+
"@gradio/markdown": patch
4+
"@gradio/sanitize": patch
5+
"@self/build": patch
6+
"gradio": patch
7+
---
8+
9+
fix:Custom component fixes

‎js/atoms/package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88
"license": "ISC",
99
"dependencies": {
1010
"@gradio/icons": "workspace:^",
11-
"@gradio/utils": "workspace:^"
11+
"@gradio/utils": "workspace:^",
12+
"@gradio/markdown": "workspace:^"
1213
},
1314
"peerDependencies": {
1415
"svelte": "^4.0.0"

‎js/build/out/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,8 @@ var ignore_list = [
149149
"tooltip",
150150
"upload",
151151
"utils",
152-
"wasm"
152+
"wasm",
153+
"sanitize"
153154
];
154155
function generate_component_imports() {
155156
const exports = readdirSync(join(__dirname, "..", "..")).map((dir) => {

‎js/build/src/index.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -211,7 +211,8 @@ const ignore_list = [
211211
"tooltip",
212212
"upload",
213213
"utils",
214-
"wasm"
214+
"wasm",
215+
"sanitize"
215216
];
216217
function generate_component_imports(): string {
217218
const exports = readdirSync(join(__dirname, "..", ".."))

‎js/markdown/package.json

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -26,23 +26,21 @@
2626
"@gradio/icons": "workspace:^",
2727
"@gradio/statustracker": "workspace:^",
2828
"@gradio/utils": "workspace:^",
29+
"@gradio/sanitize": "workspace:^",
2930
"@types/dompurify": "^3.0.2",
3031
"@types/katex": "^0.16.0",
3132
"@types/prismjs": "1.26.4",
32-
"amuchina": "^1.0.12",
3333
"dom-parser": "^1.1.5",
3434
"github-slugger": "^2.0.0",
3535
"isomorphic-dompurify": "^2.14.0",
3636
"katex": "^0.16.7",
3737
"marked": "^12.0.0",
3838
"marked-gfm-heading-id": "^3.1.2",
3939
"marked-highlight": "^2.0.1",
40-
"prismjs": "1.29.0",
41-
"sanitize-html": "^2.13.0"
40+
"prismjs": "1.29.0"
4241
},
4342
"devDependencies": {
44-
"@gradio/preview": "workspace:^",
45-
"@types/sanitize-html": "^2.13.0"
43+
"@gradio/preview": "workspace:^"
4644
},
4745
"peerDependencies": {
4846
"svelte": "^4.0.0"

‎js/markdown/shared/MarkdownCode.svelte

Lines changed: 2 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@
33
import render_math_in_element from "katex/contrib/auto-render";
44
import "katex/dist/katex.min.css";
55
import { create_marked } from "./utils";
6-
import sanitize_server from "sanitize-html";
7-
import Amuchina from "amuchina";
6+
import { sanitize } from "@gradio/sanitize";
87
import "./prism.css";
98
109
export let chatbot = true;
@@ -29,52 +28,6 @@
2928
latex_delimiters
3029
});
3130
32-
const amuchina = new Amuchina();
33-
const is_browser = typeof window !== "undefined";
34-
35-
let sanitize = is_browser ? sanitize_browser : sanitize_server;
36-
37-
function sanitize_browser(source: string): string {
38-
const node = new DOMParser().parseFromString(source, "text/html");
39-
walk_nodes(node.body, "A", (node) => {
40-
if (node instanceof HTMLElement && "target" in node) {
41-
if (is_external_url(node.getAttribute("href"))) {
42-
node.setAttribute("target", "_blank");
43-
node.setAttribute("rel", "noopener noreferrer");
44-
}
45-
}
46-
});
47-
48-
return amuchina.sanitize(node).body.innerHTML;
49-
}
50-
51-
function walk_nodes(
52-
node: Node | null | HTMLElement,
53-
test: string | ((node: Node | HTMLElement) => boolean),
54-
callback: (node: Node | HTMLElement) => void
55-
): void {
56-
if (
57-
node &&
58-
((typeof test === "string" && node.nodeName === test) ||
59-
(typeof test === "function" && test(node)))
60-
) {
61-
callback(node);
62-
}
63-
const children = node?.childNodes || [];
64-
for (let i = 0; i < children.length; i++) {
65-
// @ts-ignore
66-
walk_nodes(children[i], test, callback);
67-
}
68-
}
69-
70-
const is_external_url = (link: string | null): boolean => {
71-
try {
72-
return !!link && new URL(link).origin !== new URL(root).origin;
73-
} catch (e) {
74-
return false;
75-
}
76-
};
77-
7831
function escapeRegExp(string: string): string {
7932
return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
8033
}
@@ -106,7 +59,7 @@
10659
}
10760
10861
if (sanitize_html && sanitize) {
109-
parsedValue = sanitize(parsedValue);
62+
parsedValue = sanitize(parsedValue, root);
11063
}
11164
11265
return parsedValue;

‎js/sanitize/browser.ts

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import Amuchina from "amuchina";
2+
3+
const is_external_url = (link: string | null, root: string): boolean => {
4+
try {
5+
return !!link && new URL(link).origin !== new URL(root).origin;
6+
} catch (e) {
7+
return false;
8+
}
9+
};
10+
11+
export function sanitize(source: string, root: string): string {
12+
const amuchina = new Amuchina();
13+
const node = new DOMParser().parseFromString(source, "text/html");
14+
walk_nodes(node.body, "A", (node) => {
15+
if (node instanceof HTMLElement && "target" in node) {
16+
if (is_external_url(node.getAttribute("href"), root)) {
17+
node.setAttribute("target", "_blank");
18+
node.setAttribute("rel", "noopener noreferrer");
19+
}
20+
}
21+
});
22+
23+
return amuchina.sanitize(node).body.innerHTML;
24+
}
25+
26+
function walk_nodes(
27+
node: Node | null | HTMLElement,
28+
test: string | ((node: Node | HTMLElement) => boolean),
29+
callback: (node: Node | HTMLElement) => void
30+
): void {
31+
if (
32+
node &&
33+
((typeof test === "string" && node.nodeName === test) ||
34+
(typeof test === "function" && test(node)))
35+
) {
36+
callback(node);
37+
}
38+
const children = node?.childNodes || [];
39+
for (let i = 0; i < children.length; i++) {
40+
// @ts-ignore
41+
walk_nodes(children[i], test, callback);
42+
}
43+
}

‎js/sanitize/index.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export declare function sanitize(source: string, root: string): string;

‎js/sanitize/package.json

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name": "@gradio/sanitize",
3+
"version": "0.1.0",
4+
"description": "Gradio UI packages",
5+
"type": "module",
6+
"author": "",
7+
"main": "./dist/server.js",
8+
"license": "ISC",
9+
"dependencies": {
10+
"sanitize-html": "^2.13.0",
11+
"amuchina": "^1.0.12"
12+
},
13+
"devDependencies": {
14+
"@types/sanitize-html": "^2.13.0"
15+
},
16+
"main_changeset": true,
17+
"repository": {
18+
"type": "git",
19+
"url": "git+https://github.com/gradio-app/gradio.git",
20+
"directory": "js/utils"
21+
},
22+
"exports": {
23+
".": {
24+
"types": "./dist/index.d.ts",
25+
"browser": "./dist/browser.js",
26+
"import": "./dist/server.js",
27+
"default": "./dist/server.js"
28+
},
29+
"./package.json": "./package.json"
30+
},
31+
"scripts": {
32+
"package": "svelte-package --input=. --cwd=../../.config/"
33+
}
34+
}

‎js/sanitize/server.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import { default as sanitize_html_ } from "sanitize-html";
2+
3+
export function sanitize(source: string, root: string): string {
4+
return sanitize_html_(source);
5+
}

‎pnpm-lock.yaml

Lines changed: 19 additions & 9 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)