[MOO-2385]: Upgrade pluggable widget tools

package.json

@@ -78,9 +78,11 @@
   },
   "pnpm": {
     "overrides": {
-      "@mendix/pluggable-widgets-tools": "11.8.0",
+      "@mendix/pluggable-widgets-tools": "11.12.0",
       "@rollup/plugin-typescript": "12.3.0",
       "mendix": "11.8.0",
+      "eslint": "~8.57.0",
+      "eslint-plugin-react-hooks": "~5.1.0",
       "react": "19.2.3",
       "react-dom": "19.2.3",
       "react-native": "0.84.1",
@@ -89,7 +91,7 @@
       "@prettier/plugin-xml": "2.2.0",
       "cheerio": "1.0.0-rc.12",
       "typescript": "~5.9.3",
-      "rollup": "3.30.0",
+      "rollup": "4.30.1",
       "react-test-renderer": "19.2.3",
       "@xmldom/xmldom": ">=0.8.13",
       "flatted": ">=3.4.2",
@@ -102,10 +104,10 @@
       "lodash": ">=4.18.0"
     },
     "patchedDependencies": {
-      "@mendix/pluggable-widgets-tools@11.8.0": "patches/@mendix+pluggable-widgets-tools+11.8.0.patch",
       "react-native-gesture-handler@2.31.2": "patches/react-native-gesture-handler+2.31.2.patch",
       "react-native-slider@0.11.0": "patches/react-native-slider+0.11.0.patch",
-      "react-native-snap-carousel@3.9.1": "patches/react-native-snap-carousel+3.9.1.patch"
+      "react-native-snap-carousel@3.9.1": "patches/react-native-snap-carousel+3.9.1.patch",
+      "@mendix/pluggable-widgets-tools": "patches/@mendix__pluggable-widgets-tools.patch"
     }
   },
   "packageManager": "pnpm@10.32.0+sha512.9b2634bb3fed5601c33633f2d92593f506270a3963b8c51d2b2d6a828da615ce4e9deebef9614ccebbc13ac8d3c0f9c9ccceb583c69c8578436fa477dbb20d70"

packages/pluggableWidgets/accordion-native/src/__tests__/__snapshots__/Accordion.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Accordion in collapsible & single expanded group mode renders correctly 1`] = `
 <View

packages/pluggableWidgets/accordion-native/typings/AccordionProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { ComponentType, CSSProperties, ReactNode } from "react";
 import { ActionValue, DynamicValue, EditableValue, NativeIcon } from "mendix";
+import { ComponentType, CSSProperties, ReactNode } from "react";
 
 export type HeaderRenderModeEnum = "text" | "custom";
 

packages/pluggableWidgets/activity-indicator-native/src/__tests__/__snapshots__/ActivityIndicator.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`ActivityIndicator renders with custom styles 1`] = `
 <View

packages/pluggableWidgets/animation-native/src/__tests__/__snapshots__/Animation.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Animation renders 1`] = `
 <View

packages/pluggableWidgets/animation-native/typings/AnimationProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { ComponentType, CSSProperties, ReactNode } from "react";
 import { ActionValue, DynamicValue } from "mendix";
+import { ComponentType, CSSProperties, ReactNode } from "react";
 
 export type AnimationTypeEnum = "in" | "attention" | "out";
 

packages/pluggableWidgets/app-events-native/typings/AppEventsProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { CSSProperties } from "react";
 import { ActionValue } from "mendix";
+import { CSSProperties } from "react";
 
 export type TimerTypeEnum = "once" | "interval";
 

packages/pluggableWidgets/background-gradient-native/src/__tests__/__snapshots__/backgroundGradient.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Background gradient render background gradient with custom style 1`] = `
 <View

packages/pluggableWidgets/background-gradient-native/typings/BackgroundGradientProps.d.ts

@@ -4,8 +4,8 @@
  * @author Mendix Widgets Framework Team
  */
 import { ComponentType, CSSProperties, ReactNode } from "react";
-import { ActionValue } from "mendix";
 import { Big } from "big.js";
+import { ActionValue } from "mendix";
 
 export interface ColorListType {
     color: string;

packages/pluggableWidgets/background-image-native/src/__tests__/__snapshots__/BackgroundImage.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`BackgroundImage renders content only when image is unavailable 1`] = `
 <View

packages/pluggableWidgets/background-image-native/typings/BackgroundImageProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { ComponentType, CSSProperties, ReactNode } from "react";
 import { DynamicValue, NativeImage } from "mendix";
+import { ComponentType, CSSProperties, ReactNode } from "react";
 import { Big } from "big.js";
 
 export type ResizeModeEnum = "cover" | "contain" | "stretch" | "center";

packages/pluggableWidgets/badge-native/src/__tests__/__snapshots__/Badge.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[` 1`] = `
 <View

packages/pluggableWidgets/badge-native/typings/BadgeProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { CSSProperties } from "react";
 import { ActionValue, DynamicValue } from "mendix";
+import { CSSProperties } from "react";
 
 export interface BadgeProps<Style> {
     name: string;

packages/pluggableWidgets/bar-chart-native/src/components/__tests__/__snapshots__/Legend.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Legend doesn't render series when there is no series name 1`] = `
 <View

packages/pluggableWidgets/bar-chart-native/typings/BarChartProps.d.ts

@@ -3,9 +3,9 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { CSSProperties } from "react";
-import { DynamicValue, ListValue, ListAttributeValue, ListExpressionValue } from "mendix";
+import { DynamicValue, ListAttributeValue, ListExpressionValue, ListValue } from "mendix";
 import { Big } from "big.js";
+import { CSSProperties } from "react";
 
 export type PresentationEnum = "grouped" | "stacked";
 

packages/pluggableWidgets/barcode-scanner-native/src/__tests__/__snapshots__/BarcodeScanner.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`BarcodeScanner renders 1`] = `
 <View

packages/pluggableWidgets/barcode-scanner-native/typings/BarcodeScannerProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { CSSProperties } from "react";
 import { ActionValue, EditableValue } from "mendix";
+import { CSSProperties } from "react";
 
 export interface BarcodeScannerProps<Style> {
     name: string;

packages/pluggableWidgets/bottom-sheet-native/src/__tests__/BottomSheet.spec.tsx

@@ -1,9 +1,9 @@
 import { EditableValueBuilder } from "@mendix/piw-utils-internal";
-import { render } from "@testing-library/react-native";
+import { render, waitFor } from "@testing-library/react-native";
 import { BottomSheet } from "../BottomSheet";
 import { BottomSheetProps } from "../../typings/BottomSheetProps";
 import { BottomSheetStyle } from "../ui/Styles";
-import { ActionSheetIOS, Text } from "react-native";
+import { ActionSheetIOS, Platform, Text } from "react-native";
 
 jest.mock("react-native-worklets", () => jest.requireActual("react-native-worklets/lib/module/mock"));
 
@@ -52,7 +52,13 @@ describe("Bottom sheet", () => {
     // RN 0.83 test renderer may serialize iOS SafeAreaView as a plain View,
     // so snapshots in this suite no longer prove iOS-specific rendering by host tag.
     // This test explicitly verifies our Platform.OS override by asserting the iOS native path.
-    it("uses iOS native action sheet when native implementation is enabled", () => {
+    it("uses iOS native action sheet when native implementation is enabled", async () => {
+        const platformOsDescriptor = Object.getOwnPropertyDescriptor(Platform, "OS");
+        Object.defineProperty(Platform, "OS", {
+            configurable: true,
+            value: "ios"
+        });
+
         const actionSheetSpy = jest
             .spyOn(ActionSheetIOS, "showActionSheetWithOptions")
             .mockImplementation(() => undefined);
@@ -63,7 +69,9 @@ describe("Bottom sheet", () => {
 
         render(<BottomSheet {...props} />);
 
-        expect(actionSheetSpy).toHaveBeenCalled();
+        await waitFor(() => {
+            expect(actionSheetSpy).toHaveBeenCalled();
+        });
         expect(actionSheetSpy).toHaveBeenCalledWith(
             expect.objectContaining({
                 options: ["Item 1", "Item 2", "Cancel"],
@@ -72,6 +80,9 @@ describe("Bottom sheet", () => {
             expect.any(Function)
         );
         actionSheetSpy.mockRestore();
+        if (platformOsDescriptor) {
+            Object.defineProperty(Platform, "OS", platformOsDescriptor);
+        }
     });
 
     it("renders a native bottom action sheet for ios (Basic modal)", () => {

packages/pluggableWidgets/bottom-sheet-native/src/__tests__/__snapshots__/BottomSheet.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Bottom sheet renders a custom bottom action sheet for ios (Basic modal) with custom style 1`] = `null`;
 
@@ -158,4 +158,4 @@ exports[`Bottom sheet renders a expanding fullscreen with custom styles 1`] = `
 </View>
 `;
 
-exports[`Bottom sheet renders a native bottom action sheet for ios (Basic modal) 1`] = `<View />`;
+exports[`Bottom sheet renders a native bottom action sheet for ios (Basic modal) 1`] = `null`;

packages/pluggableWidgets/bottom-sheet-native/typings/BottomSheetProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { ComponentType, CSSProperties, ReactNode } from "react";
 import { ActionValue, EditableValue } from "mendix";
+import { ComponentType, CSSProperties, ReactNode } from "react";
 
 export type TypeEnum = "modal" | "expanding";
 

packages/pluggableWidgets/carousel-native/src/__tests__/__snapshots__/Carousel.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Carousel renders loading 1`] = `
 <View

packages/pluggableWidgets/carousel-native/typings/CarouselProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { ComponentType, CSSProperties, ReactNode } from "react";
 import { ListValue, ListWidgetValue } from "mendix";
+import { ComponentType, CSSProperties, ReactNode } from "react";
 
 export type LayoutEnum = "card" | "fullWidth";
 

packages/pluggableWidgets/color-picker-native/src/__tests__/__snapshots__/ColorPicker.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Color Picker renders 1`] = `
 <View

packages/pluggableWidgets/color-picker-native/typings/ColorPickerProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { CSSProperties } from "react";
 import { ActionValue, EditableValue } from "mendix";
+import { CSSProperties } from "react";
 
 export type FormatEnum = "hex" | "hsl" | "hsv" | "rgb";
 

packages/pluggableWidgets/column-chart-native/src/components/__tests__/__snapshots__/Legend.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Legend doesn't render series when there is no series name 1`] = `
 <View

packages/pluggableWidgets/column-chart-native/typings/ColumnChartProps.d.ts

@@ -3,9 +3,9 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { CSSProperties } from "react";
-import { DynamicValue, ListValue, ListAttributeValue, ListExpressionValue } from "mendix";
+import { DynamicValue, ListAttributeValue, ListExpressionValue, ListValue } from "mendix";
 import { Big } from "big.js";
+import { CSSProperties } from "react";
 
 export type PresentationEnum = "grouped" | "stacked";
 

packages/pluggableWidgets/feedback-native/src/__tests__/Feedback.spec.tsx

@@ -63,17 +63,36 @@ describe("Feedback", () => {
 
         fireEvent.press(component.getByTestId("feedback-test$send"));
 
-        await waitFor(() =>
-            expect(fetch).toHaveBeenCalledWith(
-                "https://feedback-api.mendix.com/rest/v3/feedbackapi/projects/sprintr-app-id/issues",
-                {
-                    body: '{"title":"unittest","description":"","issueType":"Issue","submitter":{"userId":"","email":"unknown@example.com","displayName":"Unknown Native User"},"metadata":{"userRoles":"","location":"","form":"","userAgent":"Native for ios","screenWidth":750,"screenHeight":1334},"imageAttachment":""}',
-                    headers: { ClientIdentifier: "feedback-native-v2", "Content-Type": "application/json" },
-                    method: "POST",
-                    mode: "no-cors",
-                    referrer: "no-referrer"
-                }
-            )
-        );
+        await waitFor(() => expect(fetch).toHaveBeenCalledTimes(1));
+
+        const [url, request] = (fetch as jest.Mock).mock.calls[0];
+        expect(url).toBe("https://feedback-api.mendix.com/rest/v3/feedbackapi/projects/sprintr-app-id/issues");
+        expect(request).toMatchObject({
+            headers: { ClientIdentifier: "feedback-native-v2", "Content-Type": "application/json" },
+            method: "POST",
+            mode: "no-cors",
+            referrer: "no-referrer"
+        });
+
+        const body = JSON.parse(request.body as string);
+        expect(body).toMatchObject({
+            title: "unittest",
+            description: "",
+            issueType: "Issue",
+            submitter: {
+                userId: "",
+                email: "unknown@example.com",
+                displayName: "Unknown Native User"
+            },
+            metadata: {
+                userRoles: "",
+                location: "",
+                form: ""
+            },
+            imageAttachment: ""
+        });
+        expect(body.metadata.userAgent).toMatch(/^Native for (ios|android)$/);
+        expect(typeof body.metadata.screenWidth).toBe("number");
+        expect(typeof body.metadata.screenHeight).toBe("number");
     }, 15000);
 });

packages/pluggableWidgets/feedback-native/src/__tests__/__snapshots__/Feedback.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Feedback renders 1`] = `
 <View

packages/pluggableWidgets/feedback-native/typings/FeedbackProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { CSSProperties } from "react";
 import { DynamicValue, NativeImage } from "mendix";
+import { CSSProperties } from "react";
 
 export interface FeedbackProps<Style> {
     name: string;

packages/pluggableWidgets/floating-action-button-native/src/__tests__/__snapshots__/FloatingActionButton.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`FloatingActionButton renders correct props with secondary buttons 1`] = `
 <View

packages/pluggableWidgets/floating-action-button-native/typings/FloatingActionButtonProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
-import { CSSProperties } from "react";
 import { ActionValue, DynamicValue, NativeIcon } from "mendix";
+import { CSSProperties } from "react";
 
 export type HorizontalPositionEnum = "left" | "center" | "right";
 

packages/pluggableWidgets/gallery-native/src/components/__tests__/Gallery.spec.tsx

@@ -1,6 +1,3 @@
-/**
- * @jest-environment jsdom
- */
 import { Text, TextInput } from "react-native";
 import { ObjectItem, GUID, DynamicValue, ValueStatus } from "mendix";
 import { render, fireEvent, act } from "@testing-library/react-native";

packages/pluggableWidgets/gallery-native/src/components/__tests__/__snapshots__/Gallery.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Gallery rendering rendering with load more button it shouldn't render the paging button if hasn't more item 1`] = `
 <View

packages/pluggableWidgets/gallery-native/typings/GalleryProps.d.ts

@@ -3,8 +3,8 @@
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix Widgets Framework Team
  */
+import { ActionValue, DynamicValue, ListActionValue, ListAttributeValue, ListValue, ListWidgetValue } from "mendix";
 import { ComponentType, CSSProperties, ReactNode } from "react";
-import { ActionValue, DynamicValue, ListValue, ListActionValue, ListAttributeValue, ListWidgetValue } from "mendix";
 import { Big } from "big.js";
 
 export type ScrollDirectionEnum = "vertical" | "horizontal";

packages/pluggableWidgets/gallery-text-filter-native/src/components/__tests__/__snapshots__/FilterComponent.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`Filter component renders correctly 1`] = `
 <View