diff --git a/packages/main/src/components/FilterBar/FilterBar.jss.ts b/packages/main/src/components/FilterBar/FilterBar.jss.ts
index 549974f0e00..ca6f13a4226 100644
--- a/packages/main/src/components/FilterBar/FilterBar.jss.ts
+++ b/packages/main/src/components/FilterBar/FilterBar.jss.ts
@@ -9,6 +9,9 @@ const styles = {
     background: ThemingParameters.sapObjectHeader_Background,
     boxShadow: ThemingParameters.sapContent_HeaderShadow
   },
+  filterItemExpand: {
+    '--_ui5_input_width': '100%'
+  },
   filterBarHeader: {
     alignItems: 'center',
     display: 'flex',
diff --git a/packages/main/src/components/FilterBar/FilterBarDialog.jss.ts b/packages/main/src/components/FilterBar/FilterBarDialog.jss.ts
index 57ae0db8309..7a9806f8f82 100644
--- a/packages/main/src/components/FilterBar/FilterBarDialog.jss.ts
+++ b/packages/main/src/components/FilterBar/FilterBarDialog.jss.ts
@@ -8,7 +8,8 @@ const styles = {
     flexDirection: 'column',
     maxWidth: '960px',
     width: '80vw',
-    maxHeight: '70vh'
+    maxHeight: '70vh',
+    '--_ui5_input_width': '100%'
   },
   header: {
     width: '100%',
diff --git a/packages/main/src/components/FilterBar/__snapshots__/FilterBar.test.tsx.snap b/packages/main/src/components/FilterBar/__snapshots__/FilterBar.test.tsx.snap
index ca3a9743121..3090ccb4132 100644
--- a/packages/main/src/components/FilterBar/__snapshots__/FilterBar.test.tsx.snap
+++ b/packages/main/src/components/FilterBar/__snapshots__/FilterBar.test.tsx.snap
@@ -136,7 +136,7 @@ exports[`FilterBar Render without crashing - default props 1`] = `
 
 exports[`FilterBar Render without crashing - w/ filter dialog 1`] = `
 <div
-  class="FilterBar-outerContainer-0"
+  class="FilterBar-outerContainer-0 FilterBar-filterItemExpand-0"
 >
   <div
     class="Toolbar-outerContainer-0 Toolbar-clear-0 FilterBar-filterBarHeader-0"
diff --git a/packages/main/src/components/FilterBar/demo.stories.tsx b/packages/main/src/components/FilterBar/demo.stories.tsx
index a4bc2e07e5c..15e0b2571fd 100644
--- a/packages/main/src/components/FilterBar/demo.stories.tsx
+++ b/packages/main/src/components/FilterBar/demo.stories.tsx
@@ -24,7 +24,7 @@ export const renderDefaultStory = (props) => {
       filterBarExpanded={props.filterBarExpanded}
       loading={props.loading}
       considerGroupName={props.considerGroupName}
-      filterContainerWidth={props.auto}
+      filterContainerWidth={props.filterContainerWidth}
       activeFiltersCount={props.activeFiltersCount}
       showClearOnFB={props.showClearOnFB}
       showRestoreOnFB={props.showRestoreOnFB}
@@ -116,7 +116,7 @@ export default {
     useToolbar: true,
     filterBarExpanded: true,
     considerGroupName: false,
-    filterContainerWidth: '13rem',
+    filterContainerWidth: '13.125rem',
     activeFiltersCount: 0,
     showClearOnFB: false,
     showRestoreOnFB: false,
diff --git a/packages/main/src/components/FilterBar/index.tsx b/packages/main/src/components/FilterBar/index.tsx
index 68d1681cf96..4f30bb48cb5 100644
--- a/packages/main/src/components/FilterBar/index.tsx
+++ b/packages/main/src/components/FilterBar/index.tsx
@@ -306,6 +306,9 @@ const FilterBar: FC<FilterBarPropTypes> = forwardRef((props: FilterBarPropTypes,
   if (className) {
     cssClasses.put(className);
   }
+  if (filterContainerWidth) {
+    cssClasses.put(classes.filterItemExpand);
+  }
 
   useEffect(() => {
     prevSearchInputPropsValueRef.current = search?.props?.value;
diff --git a/packages/main/src/components/FilterBar/utils.tsx b/packages/main/src/components/FilterBar/utils.tsx
index 16c60f55477..91379dab370 100644
--- a/packages/main/src/components/FilterBar/utils.tsx
+++ b/packages/main/src/components/FilterBar/utils.tsx
@@ -5,8 +5,10 @@ export const filterValue = (ref, child) => {
   let filterItemProps = {};
   if (
     tagName === 'UI5-INPUT' ||
-    tagName === 'UI5-DATEPICKER' ||
+    tagName === 'UI5-DATE-PICKER' ||
     tagName === 'UI5-DATETIME-PICKER' ||
+    tagName === 'UI5-DATERANGE-PICKER' ||
+    tagName === 'UI5-TIME-PICKER' ||
     tagName === 'UI5-DURATION-PICKER'
   ) {
     filterItemProps = { value: ref.value };
diff --git a/packages/main/src/components/FilterGroupItem/FilterGroupItem.jss.ts b/packages/main/src/components/FilterGroupItem/FilterGroupItem.jss.ts
index 7a3688639ab..67dd7491680 100644
--- a/packages/main/src/components/FilterGroupItem/FilterGroupItem.jss.ts
+++ b/packages/main/src/components/FilterGroupItem/FilterGroupItem.jss.ts
@@ -1,6 +1,6 @@
 const styles = {
   filterItem: {
-    width: '13rem',
+    width: 'var(--_ui5_input_width)',
     marginRight: '1rem',
     marginBottom: '1rem'
   },
diff --git a/packages/main/src/components/FilterGroupItem/index.tsx b/packages/main/src/components/FilterGroupItem/index.tsx
index 0e0f6e47c7f..8618ce0d3c3 100644
--- a/packages/main/src/components/FilterGroupItem/index.tsx
+++ b/packages/main/src/components/FilterGroupItem/index.tsx
@@ -87,5 +87,6 @@ FilterGroupItem.defaultProps = {
   groupName: 'default',
   visible: true,
   visibleInFilterBar: true,
-  required: false
+  required: false,
+  label: ''
 };