@gradio/model3d 0.17.0 → 0.18.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,42 @@
1
1
  # @gradio/model3d
2
2
 
3
+ ## 0.18.1
4
+
5
+ ### Dependency updates
6
+
7
+ - @gradio/statustracker@0.15.1
8
+ - @gradio/icons@0.16.0
9
+ - @gradio/atoms@0.26.0
10
+ - @gradio/client@2.3.1
11
+ - @gradio/upload@0.18.1
12
+
13
+ ## 0.18.0
14
+
15
+ ### Features
16
+
17
+ - [#13526](https://github.com/gradio-app/gradio/pull/13526) [`53cb4ca`](https://github.com/gradio-app/gradio/commit/53cb4cae1ec3521e9170d12867253516413ba37a) - Run `pnpm lint` and `pnpm ts:check` on CI. Thanks @abidlabs!
18
+
19
+ ### Dependency updates
20
+
21
+ - @gradio/atoms@0.25.0
22
+ - @gradio/statustracker@0.15.0
23
+ - @gradio/utils@0.13.0
24
+ - @gradio/client@2.3.0
25
+ - @gradio/upload@0.18.0
26
+
27
+ ## 0.17.0
28
+
29
+ ### Dependency updates
30
+
31
+ - @gradio/client@2.2.2
32
+
33
+ ## 0.17.0
34
+
35
+ ### Dependency updates
36
+
37
+ - @gradio/client@2.2.1
38
+ - @gradio/upload@0.17.10
39
+
3
40
  ## 0.17.0
4
41
 
5
42
  ### Features
package/Model3D.test.ts CHANGED
@@ -33,7 +33,8 @@ function suppress_3d_library_errors(e: PromiseRejectionEvent): void {
33
33
  msg.includes("addEventListener") ||
34
34
  msg.includes("Viewer is disposed") ||
35
35
  msg.includes("Invalid URL") ||
36
- msg.includes("Unsupported property type")
36
+ msg.includes("Unsupported property type") ||
37
+ msg.includes("postProcessManager")
37
38
  ) {
38
39
  e.preventDefault();
39
40
  }
@@ -29,9 +29,11 @@
29
29
  let mounted = $state(false);
30
30
 
31
31
  onMount(() => {
32
+ let active = true;
33
+
32
34
  const initViewer = async (): Promise<void> => {
33
35
  BABYLON_VIEWER = await import("@babylonjs/viewer");
34
- BABYLON_VIEWER.CreateViewerForCanvas(canvas, {
36
+ const promiseViewer = await BABYLON_VIEWER.CreateViewerForCanvas(canvas, {
35
37
  clearColor: clear_color,
36
38
  useRightHandedSystem: true,
37
39
  animationAutoPlay: true,
@@ -39,22 +41,30 @@
39
41
  onInitialized: (details: any) => {
40
42
  viewerDetails = details;
41
43
  }
42
- }).then((promiseViewer: any) => {
43
- viewer = promiseViewer;
44
- mounted = true;
45
44
  });
45
+
46
+ if (!active) {
47
+ promiseViewer.dispose();
48
+ return;
49
+ }
50
+
51
+ viewer = promiseViewer;
52
+ mounted = true;
46
53
  };
47
54
 
48
- initViewer();
55
+ void initViewer();
49
56
 
50
57
  return () => {
58
+ active = false;
59
+ mounted = false;
51
60
  viewer?.dispose();
61
+ viewer = undefined;
52
62
  };
53
63
  });
54
64
 
55
65
  $effect(() => {
56
66
  if (mounted) {
57
- load_model(url);
67
+ void load_model(url);
58
68
  }
59
69
  });
60
70
 
@@ -64,29 +74,37 @@
64
74
  viewerDetails.scene.forceWireframe = wireframe;
65
75
  }
66
76
 
67
- function load_model(url: string | undefined): void {
68
- if (viewer) {
69
- if (url) {
70
- viewer
71
- .loadModel(url, {
72
- pluginOptions: {
73
- obj: {
74
- importVertexColors: true
75
- }
76
- }
77
- })
78
- .then(() => {
79
- if (display_mode === "point_cloud") {
80
- setRenderingMode(true, false);
81
- } else if (display_mode === "wireframe") {
82
- setRenderingMode(false, true);
83
- } else {
84
- update_camera(camera_position, zoom_speed, pan_speed);
77
+ async function load_model(url: string | undefined): Promise<void> {
78
+ const currentViewer = viewer;
79
+ if (!currentViewer) return;
80
+
81
+ if (url) {
82
+ try {
83
+ await currentViewer.loadModel(url, {
84
+ pluginOptions: {
85
+ obj: {
86
+ importVertexColors: true
85
87
  }
86
- });
88
+ }
89
+ });
90
+ } catch (error) {
91
+ if (mounted && currentViewer === viewer) {
92
+ console.error(error);
93
+ }
94
+ return;
95
+ }
96
+
97
+ if (!mounted || currentViewer !== viewer) return;
98
+
99
+ if (display_mode === "point_cloud") {
100
+ setRenderingMode(true, false);
101
+ } else if (display_mode === "wireframe") {
102
+ setRenderingMode(false, true);
87
103
  } else {
88
- viewer.resetModel();
104
+ update_camera(camera_position, zoom_speed, pan_speed);
89
105
  }
106
+ } else {
107
+ currentViewer.resetModel();
90
108
  }
91
109
  }
92
110
 
package/dist/types.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { FileData } from "@gradio/client";
2
- import type { LoadingStatus } from "js/statustracker";
2
+ import type { ILoadingStatus as LoadingStatus } from "js/statustracker";
3
3
  import type { CustomButton } from "@gradio/utils";
4
4
  export interface Model3DProps {
5
5
  value: null | FileData;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/model3d",
3
- "version": "0.17.0",
3
+ "version": "0.18.1",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -13,12 +13,12 @@
13
13
  "@types/babylon": "^6.16.9",
14
14
  "dequal": "^2.0.3",
15
15
  "gsplat": "^1.2.9",
16
- "@gradio/atoms": "^0.24.0",
17
- "@gradio/client": "^2.2.0",
18
- "@gradio/statustracker": "^0.14.1",
19
- "@gradio/upload": "^0.17.9",
20
- "@gradio/utils": "^0.12.2",
21
- "@gradio/icons": "^0.15.1"
16
+ "@gradio/atoms": "^0.26.0",
17
+ "@gradio/statustracker": "^0.15.1",
18
+ "@gradio/icons": "^0.16.0",
19
+ "@gradio/client": "^2.3.1",
20
+ "@gradio/utils": "^0.13.0",
21
+ "@gradio/upload": "^0.18.1"
22
22
  },
23
23
  "devDependencies": {
24
24
  "@gradio/preview": "^0.16.2"
@@ -29,9 +29,11 @@
29
29
  let mounted = $state(false);
30
30
 
31
31
  onMount(() => {
32
+ let active = true;
33
+
32
34
  const initViewer = async (): Promise<void> => {
33
35
  BABYLON_VIEWER = await import("@babylonjs/viewer");
34
- BABYLON_VIEWER.CreateViewerForCanvas(canvas, {
36
+ const promiseViewer = await BABYLON_VIEWER.CreateViewerForCanvas(canvas, {
35
37
  clearColor: clear_color,
36
38
  useRightHandedSystem: true,
37
39
  animationAutoPlay: true,
@@ -39,22 +41,30 @@
39
41
  onInitialized: (details: any) => {
40
42
  viewerDetails = details;
41
43
  }
42
- }).then((promiseViewer: any) => {
43
- viewer = promiseViewer;
44
- mounted = true;
45
44
  });
45
+
46
+ if (!active) {
47
+ promiseViewer.dispose();
48
+ return;
49
+ }
50
+
51
+ viewer = promiseViewer;
52
+ mounted = true;
46
53
  };
47
54
 
48
- initViewer();
55
+ void initViewer();
49
56
 
50
57
  return () => {
58
+ active = false;
59
+ mounted = false;
51
60
  viewer?.dispose();
61
+ viewer = undefined;
52
62
  };
53
63
  });
54
64
 
55
65
  $effect(() => {
56
66
  if (mounted) {
57
- load_model(url);
67
+ void load_model(url);
58
68
  }
59
69
  });
60
70
 
@@ -64,29 +74,37 @@
64
74
  viewerDetails.scene.forceWireframe = wireframe;
65
75
  }
66
76
 
67
- function load_model(url: string | undefined): void {
68
- if (viewer) {
69
- if (url) {
70
- viewer
71
- .loadModel(url, {
72
- pluginOptions: {
73
- obj: {
74
- importVertexColors: true
75
- }
76
- }
77
- })
78
- .then(() => {
79
- if (display_mode === "point_cloud") {
80
- setRenderingMode(true, false);
81
- } else if (display_mode === "wireframe") {
82
- setRenderingMode(false, true);
83
- } else {
84
- update_camera(camera_position, zoom_speed, pan_speed);
77
+ async function load_model(url: string | undefined): Promise<void> {
78
+ const currentViewer = viewer;
79
+ if (!currentViewer) return;
80
+
81
+ if (url) {
82
+ try {
83
+ await currentViewer.loadModel(url, {
84
+ pluginOptions: {
85
+ obj: {
86
+ importVertexColors: true
85
87
  }
86
- });
88
+ }
89
+ });
90
+ } catch (error) {
91
+ if (mounted && currentViewer === viewer) {
92
+ console.error(error);
93
+ }
94
+ return;
95
+ }
96
+
97
+ if (!mounted || currentViewer !== viewer) return;
98
+
99
+ if (display_mode === "point_cloud") {
100
+ setRenderingMode(true, false);
101
+ } else if (display_mode === "wireframe") {
102
+ setRenderingMode(false, true);
87
103
  } else {
88
- viewer.resetModel();
104
+ update_camera(camera_position, zoom_speed, pan_speed);
89
105
  }
106
+ } else {
107
+ currentViewer.resetModel();
90
108
  }
91
109
  }
92
110
 
package/types.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { FileData } from "@gradio/client";
2
- import type { LoadingStatus } from "js/statustracker";
2
+ import type { ILoadingStatus as LoadingStatus } from "js/statustracker";
3
3
  import type { CustomButton } from "@gradio/utils";
4
4
 
5
5
  export interface Model3DProps {