fix(fuselage): Update contextualbar z-index (#1428)

Co-authored-by: Douglas Fabris <devfabris@gmail.com>
RocketChat · Nov 27, 2024 · 5cfac08 · 5cfac08
1 parent 1c8b83e
commit 5cfac08
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 4 deletions.
diff --git a/.changeset/happy-houses-listen.md b/.changeset/happy-houses-listen.md
@@ -0,0 +1,5 @@
+---
+"@rocket.chat/fuselage": patch
+---
+
+Changes the `contextualbar` z-index to avoid UI glitches on pages where it needs to appear on top of the `Table`
diff --git a/packages/fuselage/src/components/Contextualbar/Contextualbar.tsx b/packages/fuselage/src/components/Contextualbar/Contextualbar.tsx
@@ -30,7 +30,7 @@ const Contextualbar = forwardRef<HTMLElement, ContextualbarProps>(
         position={position}
         insetInlineEnd='none'
         insetBlockStart='none'
-        zIndex={5}
+        zIndex={10}
         {...props}
       >
         {children}

diff --git a/packages/fuselage/src/components/Contextualbar/__snapshots__/Contextualbar.spec.tsx.snap b/packages/fuselage/src/components/Contextualbar/__snapshots__/Contextualbar.spec.tsx.snap
@@ -7,7 +7,7 @@ exports[`[Contextualbar Rendering] renders Default without crashing 1`] = `
       class="rcx-box rcx-box--full rcx-css-1ucnmmp"
     >
       <div
-        class="rcx-box rcx-box--full rcx-vertical-bar rcx-css-1pzjc7w"
+        class="rcx-box rcx-box--full rcx-vertical-bar rcx-css-dnnq8h"
       >
         <div
           class="rcx-box rcx-box--full rcx-css-13kuqi8"
@@ -156,7 +156,7 @@ exports[`[Contextualbar Rendering] renders Empty without crashing 1`] = `
       class="rcx-box rcx-box--full rcx-css-1ucnmmp"
     >
       <div
-        class="rcx-box rcx-box--full rcx-vertical-bar rcx-css-1pzjc7w"
+        class="rcx-box rcx-box--full rcx-vertical-bar rcx-css-dnnq8h"
       >
         <div
           class="rcx-box rcx-box--full rcx-css-13kuqi8"
@@ -237,7 +237,7 @@ exports[`[Contextualbar Rendering] renders Skeleton without crashing 1`] = `
       class="rcx-box rcx-box--full rcx-css-1ucnmmp"
     >
       <div
-        class="rcx-box rcx-box--full rcx-vertical-bar rcx-css-1pzjc7w"
+        class="rcx-box rcx-box--full rcx-vertical-bar rcx-css-dnnq8h"
       >
         <div
           class="rcx-box rcx-box--full rcx-css-13kuqi8"