From 8c9a50a64d972f656c2f585b143033553108d2ce Mon Sep 17 00:00:00 2001
From: binh-dam-ibigroup <56846598+binh-dam-ibigroup@users.noreply.github.com>
Date: Tue, 19 Sep 2023 14:52:11 -0400
Subject: [PATCH] fix(date-time-button): Allow click interaction on mobile
 view.

---
 lib/components/form/date-time-button.tsx | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/lib/components/form/date-time-button.tsx b/lib/components/form/date-time-button.tsx
index e615eb82c..1f79d7c37 100644
--- a/lib/components/form/date-time-button.tsx
+++ b/lib/components/form/date-time-button.tsx
@@ -42,6 +42,12 @@ const ButtonWrapper = styled.span`
     ${activeCss}
     ${boxShadowCss}
   }
+
+  /* Remove pointer events triggered by children of the button.
+     (they are not captured by floating-ui hover interaction handler.) */
+  & > button > * {
+    pointer-events: none;
+  }
 `
 
 const HoverPanel = styled.div`
@@ -139,8 +145,10 @@ export default function DateTimeButton({
 
   const handleButtonClick = useCallback(
     (e) => {
+      console.log('Datetime button click')
       setOpenWithKeyboard(true)
       if (typeof interactionProps.onClick === 'function') {
+        console.log('Datetime button click activates interaction props.click')
         interactionProps.onClick(e)
       }
     },