fix: added disabled state to the IconButton of RealTimeButton.

DevoInc · Apr 9, 2024 · 6e09c77 · 6e09c77
1 parent 1980b10
commit 6e09c77
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/packages/datetime/src/components/DateTimeRangeControl/util.ts b/packages/datetime/src/components/DateTimeRangeControl/util.ts
@@ -8,6 +8,8 @@ export const getButtonStateFromRealTimeState = (
   state: TRealtimeState = 'inactive',
 ): IconButtonProps['state'] => {
   switch (state) {
+    case 'disabled':
+      return 'disabled';
     case 'inactive':
       return 'enabled';
     case 'activated':

diff --git a/packages/datetime/src/components/RealTimeButton/RealTimeButton.tsx b/packages/datetime/src/components/RealTimeButton/RealTimeButton.tsx
@@ -45,7 +45,12 @@ export const RealTimeButton: React.FC<RealTimeButtonProps> = ({
   );
 
   return (
-    <Box marginLeft="auto" paddingLeft="cmp-xxs" position="relative">
+    <Box
+      marginLeft="auto"
+      paddingLeft="cmp-xxs"
+      position="relative"
+      visibility={state === 'hidden' ? 'hidden' : undefined}
+    >
       {state === 'activated' && (
         <Box position="absolute" zIndex={1} css="pointer-events: none">
           <SpinnerLoader