From 00024717ba4e9b10aa28625cd0c3b5068a4d3697 Mon Sep 17 00:00:00 2001
From: Coston Perkins <costonperkins@me.com>
Date: Fri, 15 Nov 2024 11:50:38 -0600
Subject: [PATCH 1/6] fix: prevent ssr hydration error

---
 .../victory-clip-container.tsx                    | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx b/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
index 8ac1c6990..79a54c34d 100644
--- a/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
+++ b/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
@@ -46,10 +46,15 @@ export class VictoryClipContainer extends React.Component<VictoryClipContainerPr
 
   constructor(props: VictoryClipContainerProps) {
     super(props);
-    this.clipId =
-      !isObject(props) || props.clipId === undefined
-        ? uniqueId("victory-clip-")
-        : props.clipId;
+    this.state = {
+      clipId: props?.clipId,
+    };
+  }
+
+  componentDidMount() {
+    if (!this.state.clipId) {
+      this.setState({ clipId: uniqueId("victory-clip-") });
+    }
   }
 
   calculateAttributes(props) {
@@ -204,6 +209,6 @@ export class VictoryClipContainer extends React.Component<VictoryClipContainerPr
       translateX,
       translateY,
     });
-    return this.renderClippedGroup(clipProps, this.clipId);
+    return this.renderClippedGroup(clipProps, this.state.clipId);
   }
 }

From c33acccf5b1294bdf17db8482f27fae6e5e95a6f Mon Sep 17 00:00:00 2001
From: Coston Perkins <costonperkins@me.com>
Date: Fri, 15 Nov 2024 11:56:40 -0600
Subject: [PATCH 2/6] chore: remove unused dependency

---
 .../src/victory-clip-container/victory-clip-container.tsx        | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx b/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
index 79a54c34d..c238cc6a5 100644
--- a/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
+++ b/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
@@ -1,6 +1,5 @@
 import React from "react";
 import defaults from "lodash/defaults";
-import isObject from "lodash/isObject";
 import uniqueId from "lodash/uniqueId";
 
 import * as Helpers from "../victory-util/helpers";

From 492746b84114c3055074d14eccb60eab9d5fb0d7 Mon Sep 17 00:00:00 2001
From: Coston Perkins <costonperkins@me.com>
Date: Fri, 15 Nov 2024 12:12:00 -0600
Subject: [PATCH 3/6] chore: add state types

---
 .../victory-clip-container/victory-clip-container.tsx    | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx b/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
index c238cc6a5..df9e11f26 100644
--- a/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
+++ b/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
@@ -31,7 +31,14 @@ export interface VictoryClipContainerProps {
   translateY?: number;
 }
 
-export class VictoryClipContainer extends React.Component<VictoryClipContainerProps> {
+interface VictoryClipContainerState {
+  clipId?: number | string;
+}
+
+export class VictoryClipContainer extends React.Component<
+  VictoryClipContainerProps,
+  VictoryClipContainerState
+> {
   static displayName = "VictoryClipContainer";
   static role = "container";
 

From 074cd6354edf3c6860337cdfb6b2a6580de7aa4a Mon Sep 17 00:00:00 2001
From: Coston Perkins <costonperkins@me.com>
Date: Fri, 15 Nov 2024 12:48:12 -0600
Subject: [PATCH 4/6] docs: add comment

---
 .../src/victory-clip-container/victory-clip-container.tsx      | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx b/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
index df9e11f26..c6e38297f 100644
--- a/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
+++ b/packages/victory-core/src/victory-clip-container/victory-clip-container.tsx
@@ -57,6 +57,9 @@ export class VictoryClipContainer extends React.Component<
     };
   }
 
+  // The clipId state is used to prevent hydration mismatches between the server and client (issue #2941).
+  // A better alternative would be to utilize React 18's useId hook instead of uniqueId, which would avoid needing state for this purpose.
+  // However, this component currently supports React 16 at the time of writing, so this workaround is necessary.
   componentDidMount() {
     if (!this.state.clipId) {
       this.setState({ clipId: uniqueId("victory-clip-") });

From f6aa69559c8c600bc6ca6e5ba2153779f6ded635 Mon Sep 17 00:00:00 2001
From: Coston Perkins <costonperkins@me.com>
Date: Fri, 15 Nov 2024 12:58:59 -0600
Subject: [PATCH 5/6] chore: add changeset

---
 .changeset/kind-waves-complain.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/kind-waves-complain.md

diff --git a/.changeset/kind-waves-complain.md b/.changeset/kind-waves-complain.md
new file mode 100644
index 000000000..9b41d3131
--- /dev/null
+++ b/.changeset/kind-waves-complain.md
@@ -0,0 +1,5 @@
+---
+"victory-core": patch
+---
+
+fix hydration error using victory line with nextjs

From 5da5768db15c49030cc59fe445323e50bd5d6025 Mon Sep 17 00:00:00 2001
From: Coston Perkins <costonperkins@me.com>
Date: Fri, 15 Nov 2024 15:06:56 -0600
Subject: [PATCH 6/6] chore: push updated changeset

---
 .changeset/{kind-waves-complain.md => wicked-pandas-report.md} | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename .changeset/{kind-waves-complain.md => wicked-pandas-report.md} (100%)

diff --git a/.changeset/kind-waves-complain.md b/.changeset/wicked-pandas-report.md
similarity index 100%
rename from .changeset/kind-waves-complain.md
rename to .changeset/wicked-pandas-report.md