diff --git a/.changeset/stupid-lizards-wash.md b/.changeset/stupid-lizards-wash.md
new file mode 100644
index 00000000..27d79b2a
--- /dev/null
+++ b/.changeset/stupid-lizards-wash.md
@@ -0,0 +1,5 @@
+---
+'@xyflow/react': patch
+---
+
+Fix warning when display is set to none on the wrapper div
diff --git a/.changeset/wet-beds-greet.md b/.changeset/wet-beds-greet.md
new file mode 100644
index 00000000..5c1b140b
--- /dev/null
+++ b/.changeset/wet-beds-greet.md
@@ -0,0 +1,5 @@
+---
+'@xyflow/svelte': patch
+---
+
+Fix style attribute not being propagated to wrapper
diff --git a/examples/react/src/examples/Basic/index.tsx b/examples/react/src/examples/Basic/index.tsx
index 168bcff6..a24c908c 100644
--- a/examples/react/src/examples/Basic/index.tsx
+++ b/examples/react/src/examples/Basic/index.tsx
@@ -1,4 +1,4 @@
-import { MouseEvent, useCallback } from 'react';
+import { MouseEvent, useCallback, useState } from 'react';
import {
ReactFlow,
MiniMap,
@@ -134,47 +134,57 @@ const BasicFlow = () => {
});
fitView();
};
+ const [isHidden, setIsHidden] = useState(false);
+ const toggleVisibility = () => {
+ setIsHidden(!isHidden);
+ };
return (
-
-
-
-
+ <>
+
+
+
+
-
-
-
-
-
+
+
+
+
+
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+ >
);
};
diff --git a/examples/svelte/src/routes/examples/overview/Flow.svelte b/examples/svelte/src/routes/examples/overview/Flow.svelte
index 3075a0e8..e83548fd 100644
--- a/examples/svelte/src/routes/examples/overview/Flow.svelte
+++ b/examples/svelte/src/routes/examples/overview/Flow.svelte
@@ -155,6 +155,8 @@
// console.log(edges.map((edge) => ({ id: edge.id, selected: edge.selected })));
edges.forEach((edge) => console.log({ id: edge.id, selected: edge.selected }));
});
+
+ let hidden = $state(false);
+
+