From ad646a2a00b8fe4e0027b77c3ede904715c13aec Mon Sep 17 00:00:00 2001
From: Dan Abramov <dan.abramov@gmail.com>
Date: Sun, 3 Apr 2022 20:52:25 +0100
Subject: [PATCH] Fix invalid <rect> width error

---
 src/components/time/Categories.js | 5 ++++-
 src/components/time/atoms/Clip.js | 2 +-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/time/Categories.js b/src/components/time/Categories.js
index 74e7074..f5a8b41 100644
--- a/src/components/time/Categories.js
+++ b/src/components/time/Categories.js
@@ -73,7 +73,10 @@ class TimelineCategories extends React.Component {
           className="drag-grabber"
           x={dims.marginLeft}
           y={dims.marginTop}
-          width={dims.width - dims.marginLeft - dims.width_controls}
+          width={Math.max(
+            0,
+            dims.width - dims.marginLeft - dims.width_controls
+          )}
           height={dims.contentHeight}
         />
       </g>
diff --git a/src/components/time/atoms/Clip.js b/src/components/time/atoms/Clip.js
index bb10a4a..6d82349 100644
--- a/src/components/time/atoms/Clip.js
+++ b/src/components/time/atoms/Clip.js
@@ -5,7 +5,7 @@ const TimelineClip = ({ dims }) => (
     <rect
       x={dims.marginLeft}
       y="0"
-      width={dims.width - dims.marginLeft - dims.width_controls}
+      width={Math.max(0, dims.width - dims.marginLeft - dims.width_controls)}
       height={dims.contentHeight}
     />
   </clipPath>