[WC-3344] Placement of filter dropdowns on small viewports

packages/pluggableWidgets/datagrid-date-filter-web/CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Fixed
+
+- We fixed an issue with filter selector dropdown not choosing the best placement on small viewports.
+
 ## [3.8.1] - 2026-02-19
 
 ### Changed

packages/pluggableWidgets/datagrid-date-filter-web/src/DatagridDateFilter.tsx

@@ -1,7 +1,7 @@
+import { ReactElement } from "react";
 import { withAttributeGuard } from "@mendix/widget-plugin-filtering/helpers/withAttributeGuard";
 import { withFilterAPI } from "@mendix/widget-plugin-filtering/helpers/withFilterAPI";
 import { withPreloader } from "@mendix/widget-plugin-platform/hoc/withPreloader";
-import { ReactElement } from "react";
 import { DatagridDateFilterContainerProps } from "../typings/DatagridDateFilterProps";
 import { DateFilterContainer } from "./components/DateFilterContainer";
 import { withLinkedDateStore } from "./hocs/withLinkedDateStore";

packages/pluggableWidgets/datagrid-date-filter-web/src/components/DateFilterContainer.tsx

@@ -1,11 +1,11 @@
-import { useDateSync } from "@mendix/widget-plugin-filtering/helpers/useDateSync";
-import { Date_InputFilterInterface } from "@mendix/widget-plugin-filtering/typings/InputFilterInterface";
 import { observer } from "mobx-react-lite";
 import { ReactElement } from "react";
+import { useDateSync } from "@mendix/widget-plugin-filtering/helpers/useDateSync";
+import { Date_InputFilterInterface } from "@mendix/widget-plugin-filtering/typings/InputFilterInterface";
+import { FilterComponent } from "./FilterComponent";
 import { DatagridDateFilterContainerProps } from "../../typings/DatagridDateFilterProps";
 import { useActionEvents } from "../helpers/useActionEvents";
 import { useSetup } from "../helpers/useSetup";
-import { FilterComponent } from "./FilterComponent";
 
 interface ContainerProps extends DatagridDateFilterContainerProps {
     filterStore: Date_InputFilterInterface;

packages/pluggableWidgets/datagrid-date-filter-web/src/components/FilterComponent.tsx

@@ -1,8 +1,8 @@
-import { FilterSelector } from "@mendix/widget-plugin-filtering/controls";
 import classNames from "classnames";
 import { CSSProperties, ReactElement } from "react";
-import { FilterTypeEnum } from "../helpers/base-types";
+import { FilterSelector } from "@mendix/widget-plugin-filtering/controls";
 import { DatePicker, DatePickerProps } from "./DatePicker";
+import { FilterTypeEnum } from "../helpers/base-types";
 
 export interface FilterComponentProps extends DatePickerProps {
     id?: string;

packages/pluggableWidgets/datagrid-date-filter-web/src/helpers/DatePickerController.ts

@@ -1,9 +1,9 @@
+import { isDate } from "date-fns/isDate";
 import { action, computed, makeObservable, observable, runInAction } from "mobx";
 import { BaseSyntheticEvent, ClassAttributes, createRef, KeyboardEventHandler, MouseEventHandler } from "react";
-import { isDate } from "date-fns/isDate";
 import ReactDatePicker, { ReactDatePickerProps } from "react-datepicker";
-import { Date_InputFilterInterface, FilterFn } from "@mendix/widget-plugin-filtering/typings/InputFilterInterface";
 import { SetFilterValueArgs } from "@mendix/widget-plugin-external-events/typings";
+import { Date_InputFilterInterface, FilterFn } from "@mendix/widget-plugin-filtering/typings/InputFilterInterface";
 
 interface DatePickerBackendProps extends ReactDatePickerProps, ClassAttributes<ReactDatePicker> {}
 

packages/pluggableWidgets/datagrid-date-filter-web/src/helpers/useActionEvents.ts

@@ -1,5 +1,5 @@
-import { useOnResetValueEvent, useOnSetValueEvent } from "@mendix/widget-plugin-external-events/hooks";
 import { useState } from "react";
+import { useOnResetValueEvent, useOnSetValueEvent } from "@mendix/widget-plugin-external-events/hooks";
 import { DatePickerController } from "./DatePickerController";
 
 type HookParams = [Parameters<typeof useOnResetValueEvent>[0], Parameters<typeof useOnSetValueEvent>[0]];

packages/pluggableWidgets/datagrid-date-filter-web/src/helpers/useSetup.ts

@@ -1,10 +1,10 @@
+import { Locale } from "date-fns";
 import { useEffect, useMemo, useState } from "react";
 import { Date_InputFilterInterface } from "@mendix/widget-plugin-filtering/typings/InputFilterInterface";
-import { DatePickerController } from "../helpers/DatePickerController";
 import { generateUUID } from "@mendix/widget-plugin-platform/framework/generate-uuid";
-import { Locale } from "date-fns";
-import { getLocale, pickerDateFormat, setupLocales } from "../utils/date-utils";
 import { FilterTypeEnum } from "./base-types";
+import { DatePickerController } from "../helpers/DatePickerController";
+import { getLocale, pickerDateFormat, setupLocales } from "../utils/date-utils";
 
 interface SetupProps {
     filterStore: Date_InputFilterInterface;

packages/pluggableWidgets/datagrid-date-filter-web/src/hocs/withLinkedDateStore.tsx

@@ -1,8 +1,8 @@
+import { AttributeMetaData } from "mendix";
+import { FC } from "react";
 import { FilterAPI } from "@mendix/widget-plugin-filtering/context";
 import { DateStoreProvider } from "@mendix/widget-plugin-filtering/custom-filter-api/DateStoreProvider";
 import { useSetup } from "@mendix/widget-plugin-mobx-kit/react/useSetup";
-import { AttributeMetaData } from "mendix";
-import { FC } from "react";
 import { DateFilterProps } from "../components/typings";
 
 interface RequiredProps {

packages/pluggableWidgets/datagrid-date-filter-web/src/hocs/withParentProvidedDateStore.tsx

@@ -1,9 +1,9 @@
+import { ReactElement, useRef } from "react";
 import { Alert } from "@mendix/widget-plugin-component-kit/Alert";
 import { useFilterAPI } from "@mendix/widget-plugin-filtering/context";
 import { APIError, EMISSINGSTORE, EStoreTypeMisMatch } from "@mendix/widget-plugin-filtering/errors";
 import { error, Result, value } from "@mendix/widget-plugin-filtering/result-meta";
 import { isDateFilter } from "@mendix/widget-plugin-filtering/stores/input/store-utils";
-import { ReactElement, useRef } from "react";
 import { DateFilterProps } from "../components/typings";
 
 export function withParentProvidedDateStore<P>(

packages/pluggableWidgets/datagrid-date-filter-web/src/hocs/withPreviewAdapter.tsx

@@ -1,6 +1,6 @@
 import { ReactElement, useMemo } from "react";
-import { FilterComponent } from "../components/FilterComponent";
 import { DatagridDateFilterPreviewProps } from "../../typings/DatagridDateFilterProps";
+import { FilterComponent } from "../components/FilterComponent";
 
 type PreviewAdapter = (props: DatagridDateFilterPreviewProps) => ReactElement;
 

packages/pluggableWidgets/datagrid-dropdown-filter-web/CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Fixed
+
+- We fixed an issue with filter selector dropdown not choosing the best placement on small viewports.
+
 ## [3.9.0] - 2026-03-23
 
 ### Fixed

packages/pluggableWidgets/datagrid-dropdown-filter-web/src/DatagridDropdownFilter.editorPreview.tsx

@@ -1,8 +1,8 @@
 import { enableStaticRendering } from "mobx-react-lite";
 import { ReactElement } from "react";
-import { DatagridDropdownFilterPreviewProps } from "../typings/DatagridDropdownFilterProps";
-import { parseStyle } from "@mendix/widget-plugin-platform/preview/parse-style";
 import { Select } from "@mendix/widget-plugin-dropdown-filter/controls/select/Select";
+import { parseStyle } from "@mendix/widget-plugin-platform/preview/parse-style";
+import { DatagridDropdownFilterPreviewProps } from "../typings/DatagridDropdownFilterProps";
 
 enableStaticRendering(true);
 

packages/pluggableWidgets/datagrid-dropdown-filter-web/src/components/AttrFilter.tsx

@@ -1,11 +1,11 @@
+import { ReactElement } from "react";
 import { EnumFilterContainer } from "@mendix/widget-plugin-dropdown-filter/containers/EnumFilterContainer";
 import { withFilterAPI } from "@mendix/widget-plugin-filtering/helpers/withFilterAPI";
-import { ReactElement } from "react";
+import { EnumFilterProps } from "./typings";
 import { DatagridDropdownFilterContainerProps } from "../../typings/DatagridDropdownFilterProps";
 import { withAttrGuard } from "../hocs/withAttrGuard";
 import { withLinkedEnumStore } from "../hocs/withLinkedEnumStore";
 import { withParentProvidedEnumStore } from "../hocs/withParentProvidedEnumStore";
-import { EnumFilterProps } from "./typings";
 
 export function AttrFilter(props: DatagridDropdownFilterContainerProps): ReactElement {
     if (props.attrChoice === "auto") {

packages/pluggableWidgets/datagrid-dropdown-filter-web/src/components/RefFilter.tsx

@@ -1,9 +1,9 @@
-import { RefFilterContainer } from "@mendix/widget-plugin-dropdown-filter/containers/RefFilterContainer";
 import { ReactElement } from "react";
+import { RefFilterContainer } from "@mendix/widget-plugin-dropdown-filter/containers/RefFilterContainer";
+import { RefFilterProps } from "./typings";
 import { DatagridDropdownFilterContainerProps } from "../../typings/DatagridDropdownFilterProps";
 import { withAttrGuard } from "../hocs/withAttrGuard";
 import { withLinkedRefStore } from "../hocs/withLinkedRefStore";
-import { RefFilterProps } from "./typings";
 
 function Connector(props: DatagridDropdownFilterContainerProps & RefFilterProps): ReactElement {
     return (

packages/pluggableWidgets/datagrid-dropdown-filter-web/src/hocs/withAttrGuard.tsx

@@ -1,5 +1,5 @@
-import { Alert } from "@mendix/widget-plugin-component-kit/Alert";
 import { FC } from "react";
+import { Alert } from "@mendix/widget-plugin-component-kit/Alert";
 
 /**
  * @remark Any changes made in this hoc should be reflected in

packages/pluggableWidgets/datagrid-dropdown-filter-web/src/hocs/withLinkedEnumStore.tsx

@@ -1,8 +1,8 @@
-import { FilterAPI } from "@mendix/widget-plugin-filtering/context";
+import { AttributeMetaData } from "mendix";
 import { FC } from "react";
+import { FilterAPI } from "@mendix/widget-plugin-filtering/context";
 import { EnumStoreProvider } from "@mendix/widget-plugin-filtering/custom-filter-api/EnumStoreProvider";
 import { useSetup } from "@mendix/widget-plugin-mobx-kit/react/useSetup";
-import { AttributeMetaData } from "mendix";
 import { EnumFilterProps } from "../components/typings";
 
 interface RequiredProps {

packages/pluggableWidgets/datagrid-dropdown-filter-web/src/hocs/withLinkedRefStore.tsx

@@ -1,3 +1,5 @@
+import { AssociationMetaData, ListAttributeValue, ListExpressionValue, ListValue } from "mendix";
+import { ReactElement, useEffect } from "react";
 import { Alert } from "@mendix/widget-plugin-component-kit/Alert";
 import { RefFilterStore } from "@mendix/widget-plugin-dropdown-filter/stores/RefFilterStore";
 import { FilterAPI, useFilterAPI } from "@mendix/widget-plugin-filtering/context";
@@ -6,8 +8,6 @@ import { GateProvider } from "@mendix/widget-plugin-mobx-kit/GateProvider";
 import { DerivedPropsGate } from "@mendix/widget-plugin-mobx-kit/main";
 import { useConst } from "@mendix/widget-plugin-mobx-kit/react/useConst";
 import { useSetup } from "@mendix/widget-plugin-mobx-kit/react/useSetup";
-import { AssociationMetaData, ListAttributeValue, ListExpressionValue, ListValue } from "mendix";
-import { ReactElement, useEffect } from "react";
 import { DatagridDropdownFilterContainerProps } from "../../typings/DatagridDropdownFilterProps";
 import { RefFilterProps } from "../components/typings";
 

packages/pluggableWidgets/datagrid-dropdown-filter-web/src/hocs/withParentProvidedEnumStore.tsx

@@ -1,5 +1,5 @@
-import { Alert } from "@mendix/widget-plugin-component-kit/Alert";
 import { ReactElement, useRef } from "react";
+import { Alert } from "@mendix/widget-plugin-component-kit/Alert";
 import { useFilterAPI } from "@mendix/widget-plugin-filtering/context";
 import { APIError, EMISSINGSTORE, EStoreTypeMisMatch } from "@mendix/widget-plugin-filtering/errors";
 import { error, Result, value } from "@mendix/widget-plugin-filtering/result-meta";

packages/pluggableWidgets/datagrid-number-filter-web/CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Fixed
+
+- We fixed an issue with filter selector dropdown not choosing the best placement on small viewports.
+
 ## [3.9.0] - 2026-03-23
 
 ### Fixed

packages/pluggableWidgets/datagrid-number-filter-web/src/DatagridNumberFilter.editorPreview.tsx

@@ -2,10 +2,10 @@ import { enableStaticRendering } from "mobx-react-lite";
 enableStaticRendering(true);
 
 import { ReactElement, useMemo, useRef } from "react";
-import { parseStyle } from "@mendix/widget-plugin-platform/preview/parse-style";
 import { InputWithFiltersComponent } from "@mendix/widget-plugin-filtering/controls";
-import { DatagridNumberFilterPreviewProps } from "../typings/DatagridNumberFilterProps";
 import { InputStore } from "@mendix/widget-plugin-filtering/stores/input/InputStore";
+import { parseStyle } from "@mendix/widget-plugin-platform/preview/parse-style";
+import { DatagridNumberFilterPreviewProps } from "../typings/DatagridNumberFilterProps";
 
 function Preview(props: DatagridNumberFilterPreviewProps): ReactElement {
     const inputStores = useMemo<[InputStore, InputStore]>(

packages/pluggableWidgets/datagrid-number-filter-web/src/DatagridNumberFilter.tsx

@@ -1,7 +1,7 @@
+import { ReactElement } from "react";
 import { withAttributeGuard } from "@mendix/widget-plugin-filtering/helpers/withAttributeGuard";
 import { withFilterAPI } from "@mendix/widget-plugin-filtering/helpers/withFilterAPI";
 import { withPreloader } from "@mendix/widget-plugin-platform/hoc/withPreloader";
-import { ReactElement } from "react";
 import { DatagridNumberFilterContainerProps } from "../typings/DatagridNumberFilterProps";
 import { NumberFilterContainer } from "./components/NumberFilterContainer";
 import { withLinkedNumberStore } from "./hocs/withLinkedNumberStore";

packages/pluggableWidgets/datagrid-number-filter-web/src/components/NumberFilterContainer.tsx

@@ -1,12 +1,12 @@
+import { observer } from "mobx-react-lite";
+import { ReactElement, useRef } from "react";
 import { useOnResetValueEvent, useOnSetValueEvent } from "@mendix/widget-plugin-external-events/hooks";
 import { NumberFilterController } from "@mendix/widget-plugin-filtering/controllers/input/NumberInputController";
 import { FilterFnList, InputWithFilters } from "@mendix/widget-plugin-filtering/controls";
 import { useBasicSync } from "@mendix/widget-plugin-filtering/helpers/useBasicSync";
 import { Number_InputFilterInterface } from "@mendix/widget-plugin-filtering/typings/InputFilterInterface";
 import { useSetup } from "@mendix/widget-plugin-mobx-kit/react/useSetup";
 import { generateUUID } from "@mendix/widget-plugin-platform/framework/generate-uuid";
-import { observer } from "mobx-react-lite";
-import { ReactElement, useRef } from "react";
 import { DatagridNumberFilterContainerProps, DefaultFilterEnum } from "../../typings/DatagridNumberFilterProps";
 
 const filterDefs: Record<DefaultFilterEnum, string> = {

packages/pluggableWidgets/datagrid-number-filter-web/src/hocs/withLinkedNumberStore.tsx

@@ -1,9 +1,9 @@
-import { FilterAPI } from "@mendix/widget-plugin-filtering/context";
-import { NumberStoreProvider } from "@mendix/widget-plugin-filtering/custom-filter-api/NumberStoreProvider";
-import { useSetup } from "@mendix/widget-plugin-mobx-kit/react/useSetup";
 import { Big } from "big.js";
 import { AttributeMetaData } from "mendix";
 import { FC } from "react";
+import { FilterAPI } from "@mendix/widget-plugin-filtering/context";
+import { NumberStoreProvider } from "@mendix/widget-plugin-filtering/custom-filter-api/NumberStoreProvider";
+import { useSetup } from "@mendix/widget-plugin-mobx-kit/react/useSetup";
 import { NumberFilterProps } from "../components/typings";
 
 interface RequiredProps {

packages/pluggableWidgets/datagrid-number-filter-web/src/hocs/withParentProvidedNumberStore.tsx

@@ -1,9 +1,9 @@
+import { ReactElement, useRef } from "react";
 import { Alert } from "@mendix/widget-plugin-component-kit/Alert";
 import { useFilterAPI } from "@mendix/widget-plugin-filtering/context";
 import { APIError, EMISSINGSTORE, EStoreTypeMisMatch } from "@mendix/widget-plugin-filtering/errors";
 import { error, Result, value } from "@mendix/widget-plugin-filtering/result-meta";
 import { isNumberFilter } from "@mendix/widget-plugin-filtering/stores/input/store-utils";
-import { ReactElement, useRef } from "react";
 import { NumberFilterProps } from "../components/typings";
 
 export function withParentProvidedNumberStore<P>(

packages/pluggableWidgets/datagrid-text-filter-web/CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Fixed
+
+- We fixed an issue with filter selector dropdown not choosing the best placement on small viewports.
+
 ## [3.8.1] - 2026-02-19
 
 ### Changed

packages/pluggableWidgets/datagrid-text-filter-web/src/DatagridTextFilter.editorPreview.tsx

@@ -2,10 +2,10 @@ import { enableStaticRendering } from "mobx-react-lite";
 enableStaticRendering(true);
 
 import { ReactElement, useMemo, useRef } from "react";
-import { DatagridTextFilterPreviewProps } from "../typings/DatagridTextFilterProps";
-import { parseStyle } from "@mendix/widget-plugin-platform/preview/parse-style";
 import { InputWithFiltersComponent } from "@mendix/widget-plugin-filtering/controls";
 import { InputStore } from "@mendix/widget-plugin-filtering/stores/input/InputStore";
+import { parseStyle } from "@mendix/widget-plugin-platform/preview/parse-style";
+import { DatagridTextFilterPreviewProps } from "../typings/DatagridTextFilterProps";
 
 function Preview(props: DatagridTextFilterPreviewProps): ReactElement {
     const inputStores = useMemo<[InputStore, InputStore]>(

packages/pluggableWidgets/datagrid-text-filter-web/src/DatagridTextFilter.tsx

@@ -1,7 +1,7 @@
+import { ReactElement } from "react";
 import { withAttributeGuard } from "@mendix/widget-plugin-filtering/helpers/withAttributeGuard";
 import { withFilterAPI } from "@mendix/widget-plugin-filtering/helpers/withFilterAPI";
 import { withPreloader } from "@mendix/widget-plugin-platform/hoc/withPreloader";
-import { ReactElement } from "react";
 import { DatagridTextFilterContainerProps } from "../typings/DatagridTextFilterProps";
 import { TextFilterContainer } from "./components/TextFilterContainer";
 import { withLinkedStringStore } from "./hocs/withLinkedStringStore";

packages/pluggableWidgets/datagrid-text-filter-web/src/components/TextFilterContainer.tsx

@@ -1,12 +1,12 @@
+import { observer } from "mobx-react-lite";
+import { ReactElement, useRef } from "react";
 import { useOnResetValueEvent, useOnSetValueEvent } from "@mendix/widget-plugin-external-events/hooks";
 import { StringFilterController } from "@mendix/widget-plugin-filtering/controllers/input/StringInputController";
 import { FilterFnList, InputWithFilters } from "@mendix/widget-plugin-filtering/controls";
 import { useBasicSync } from "@mendix/widget-plugin-filtering/helpers/useBasicSync";
 import { String_InputFilterInterface } from "@mendix/widget-plugin-filtering/typings/InputFilterInterface";
 import { useSetup } from "@mendix/widget-plugin-mobx-kit/react/useSetup";
 import { generateUUID } from "@mendix/widget-plugin-platform/framework/generate-uuid";
-import { observer } from "mobx-react-lite";
-import { ReactElement, useRef } from "react";
 import { DatagridTextFilterContainerProps, DefaultFilterEnum } from "../../typings/DatagridTextFilterProps";
 
 const filterDefs: Record<DefaultFilterEnum, string> = {

packages/pluggableWidgets/datagrid-text-filter-web/src/components/__tests__/DatagridTextFilter.spec.tsx

@@ -1,8 +1,12 @@
 import { FilterAPI } from "@mendix/widget-plugin-filtering/context";
 import { ObservableFilterHost } from "@mendix/widget-plugin-filtering/typings/ObservableFilterHost";
 import "@testing-library/jest-dom";
-import { AttributeMetaData } from "mendix";
 
+import { act, render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { resetIdCounter } from "downshift";
+import { AttributeMetaData } from "mendix";
+import { createContext } from "react";
 import { requirePlugin } from "@mendix/widget-plugin-external-events/plugin";
 import { StringInputFilterStore } from "@mendix/widget-plugin-filtering/stores/input/StringInputFilterStore";
 import {
@@ -11,10 +15,6 @@ import {
     EditableValueBuilder,
     ListAttributeValueBuilder
 } from "@mendix/widget-plugin-test-utils";
-import { act, render, screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import { resetIdCounter } from "downshift";
-import { createContext } from "react";
 import { DatagridTextFilterContainerProps } from "../../../typings/DatagridTextFilterProps";
 import DatagridTextFilter from "../../DatagridTextFilter";
 

packages/pluggableWidgets/datagrid-text-filter-web/src/hocs/withLinkedStringStore.tsx

@@ -1,8 +1,8 @@
+import { AttributeMetaData } from "mendix";
+import { FC } from "react";
 import { FilterAPI } from "@mendix/widget-plugin-filtering/context";
 import { StringStoreProvider } from "@mendix/widget-plugin-filtering/custom-filter-api/StringStoreProvider";
 import { useSetup } from "@mendix/widget-plugin-mobx-kit/react/useSetup";
-import { AttributeMetaData } from "mendix";
-import { FC } from "react";
 import { StringFilterProps } from "../components/typings";
 
 interface RequiredProps {

packages/pluggableWidgets/datagrid-text-filter-web/src/hocs/withParentProvidedStringStore.tsx

@@ -1,9 +1,9 @@
+import { ReactElement, useRef } from "react";
 import { Alert } from "@mendix/widget-plugin-component-kit/Alert";
 import { useFilterAPI } from "@mendix/widget-plugin-filtering/context";
 import { APIError, EMISSINGSTORE, EStoreTypeMisMatch } from "@mendix/widget-plugin-filtering/errors";
 import { error, Result, value } from "@mendix/widget-plugin-filtering/result-meta";
 import { isStringFilter } from "@mendix/widget-plugin-filtering/stores/input/store-utils";
-import { ReactElement, useRef } from "react";
 import { StringFilterProps } from "../components/typings";
 
 export function withParentProvidedStringStore<P>(

packages/shared/widget-plugin-filtering/src/__tests__/DateInputFilterStore.spec.ts

@@ -1,5 +1,4 @@
 jest.mock("mendix/filters/builders");
-import { attrId, listAttribute } from "@mendix/widget-plugin-test-utils";
 import { ListAttributeValue } from "mendix";
 import {
     and,
@@ -16,6 +15,7 @@
     or
 } from "mendix/filters/builders";
 import { configure } from "mobx";
+import { attrId, listAttribute } from "@mendix/widget-plugin-test-utils";
 import { DateInputFilterStore } from "../stores/input/DateInputFilterStore";
 
 configure({
@@ -148,7 +148,7 @@
         beforeEach(() => {
             attr = listAttribute(() => new Date());
             store = new DateInputFilterStore([attr], null);
             expect(store.filterFunction).toBe("equal");
         });
 
         it("restore state from multi-attribute exp", () => {