From 2f82ffef5d7bf5da46a869022183c8c8e8a6aa7a Mon Sep 17 00:00:00 2001
From: Weronika Olejniczak
 <32842468+weronikaolejniczak@users.noreply.github.com>
Date: Tue, 8 Oct 2024 19:05:38 +0200
Subject: [PATCH] fix(date-picker-range): make inputs take the whole available
 space (#8061)

---
 packages/eui/changelogs/upcoming/8061.md                     | 4 ++++
 .../src/components/date_picker/date_picker_range.styles.ts   | 5 +++++
 2 files changed, 9 insertions(+)
 create mode 100644 packages/eui/changelogs/upcoming/8061.md

diff --git a/packages/eui/changelogs/upcoming/8061.md b/packages/eui/changelogs/upcoming/8061.md
new file mode 100644
index 00000000000..0b64d936818
--- /dev/null
+++ b/packages/eui/changelogs/upcoming/8061.md
@@ -0,0 +1,4 @@
+**Bug fixes**
+
+- Fixed inputs not taking the whole width when passing `fullWidth` as `true` to EuiDatePickerRange component
+
diff --git a/packages/eui/src/components/date_picker/date_picker_range.styles.ts b/packages/eui/src/components/date_picker/date_picker_range.styles.ts
index b2a63310649..49aec5e60d0 100644
--- a/packages/eui/src/components/date_picker/date_picker_range.styles.ts
+++ b/packages/eui/src/components/date_picker/date_picker_range.styles.ts
@@ -19,6 +19,11 @@ export const euiDatePickerRangeStyles = {
     .euiDatePicker {
       ${logicalCSS('height', '100%')}
     }
+
+    /* Needed for the fullWidth prop: makes inputs take the whole available space */
+    .euiPopover {
+      flex: 1;
+    }
   `,
 };