diff --git a/packages/pluggableWidgets/switch-native/package.json b/packages/pluggableWidgets/switch-native/package.json
index 4923ddc7b..882c3df2d 100644
--- a/packages/pluggableWidgets/switch-native/package.json
+++ b/packages/pluggableWidgets/switch-native/package.json
@@ -1,7 +1,7 @@
 {
   "name": "switch-native",
   "widgetName": "Switch",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -24,6 +24,8 @@
   },
   "devDependencies": {
     "@mendix/pluggable-widgets-tools": "~10.0.1",
+    "@testing-library/jest-native": "^5.4.3",
+    "@testing-library/react-native": "^13.3.3",
     "eslint": "^7.32.0"
   }
 }
diff --git a/packages/pluggableWidgets/switch-native/src/Switch.tsx b/packages/pluggableWidgets/switch-native/src/Switch.tsx
index 9009521cf..d695141fd 100644
--- a/packages/pluggableWidgets/switch-native/src/Switch.tsx
+++ b/packages/pluggableWidgets/switch-native/src/Switch.tsx
@@ -1,5 +1,5 @@
 import { flattenStyles } from "@mendix/piw-native-utils-internal";
-import { createElement, ReactElement, useCallback } from "react";
+import React, { createElement, ReactElement, useCallback, Fragment } from "react";
 import { View, Text, Switch as SwitchComponent, Platform } from "react-native";
 import { executeAction } from "@mendix/piw-utils-internal";
 import { extractStyles } from "@mendix/pluggable-widgets-tools";
@@ -10,7 +10,7 @@ import { SwitchStyle, defaultSwitchStyle, CheckBoxInputType } from "./ui/Styles"
 export type Props = SwitchProps<SwitchStyle>;
 
 export function Switch(props: Props): ReactElement {
-    const { label, labelOrientation, showLabel, name, onChange, booleanAttribute } = props;
+    const { label, labelOrientation, showLabel, name, onChange, booleanAttribute, labelPosition } = props;
     const combinedStyles = flattenStyles(defaultSwitchStyle, props.style);
     const styles = processStyles(combinedStyles);
     const horizontalOrientation = showLabel && labelOrientation === "horizontal";
@@ -39,36 +39,88 @@ export function Switch(props: Props): ReactElement {
 
     const labelValue = label?.status === "available" ? label.value : "";
 
+    const switchElement = (
+        <SwitchComponent
+            disabled={!editable}
+            testID={name}
+            style={inputStyle}
+            onValueChange={editable ? onChangeCallback : undefined}
+            value={booleanAttribute.value}
+            trackColor={{
+                true: inputProps.trackColorOn,
+                false: inputProps.trackColorOff
+            }}
+            thumbColor={booleanAttribute.value ? inputProps.thumbColorOn : inputProps.thumbColorOff}
+            {...(Platform.OS === "ios" ? { ios_backgroundColor: inputProps.trackColorOff } : {})}
+        />
+    );
+
+    const labelElement = showLabel ? (
+        <Text testID={`${name}$label`} style={[labelStyles]}>
+            {labelValue}
+        </Text>
+    ) : null;
+
+    const validationMessage = hasValidationMessage ? (
+        <Text testID={`${name}$alert`} style={styles.validationMessage}>
+            {booleanAttribute.validation}
+        </Text>
+    ) : null;
+
     return (
         <View
             testID={`${name}$wrapper`}
-            style={[containerStyles, horizontalOrientation ? { flexDirection: "row", alignItems: "center" } : null]}
+            style={[containerStyles, { flexDirection: "column", alignItems: "flex-start" }]}
         >
-            {showLabel ? (
-                <Text testID={`${name}$label`} style={[labelStyles, horizontalOrientation ? { flex: 1 } : null]}>
-                    {labelValue}
-                </Text>
-            ) : null}
-            <View style={[horizontalOrientation ? { flex: 1, alignItems: "flex-end" } : { alignItems: "flex-start" }]}>
-                <SwitchComponent
-                    disabled={!editable}
-                    testID={name}
-                    style={inputStyle}
-                    onValueChange={editable ? onChangeCallback : undefined}
-                    value={booleanAttribute.value}
-                    trackColor={{
-                        true: inputProps.trackColorOn,
-                        false: inputProps.trackColorOff
-                    }}
-                    thumbColor={booleanAttribute.value ? inputProps.thumbColorOn : inputProps.thumbColorOff}
-                    {...(Platform.OS === "ios" ? { ios_backgroundColor: inputProps.trackColorOff } : {})}
-                />
-                {hasValidationMessage ? (
-                    <Text testID={`${name}$alert`} style={styles.validationMessage}>
-                        {booleanAttribute.validation}
-                    </Text>
-                ) : null}
-            </View>
+            {horizontalOrientation ? (
+                // Horizontal layout: label and switch in a row, validation message below
+                <>
+                    <View
+                        testID={`${name}$horizontalContainer`}
+                        style={{
+                            flexDirection: "row",
+                            alignItems: "center",
+                            width: "100%",
+                            justifyContent: "space-between"
+                        }}
+                    >
+                        {labelPosition === "right" ? (
+                            <>
+                                {React.cloneElement(switchElement, { key: "switch" })}
+                                <View
+                                    style={{
+                                        flexDirection: "column",
+                                        alignItems: "flex-end"
+                                    }}
+                                >
+                                    {labelElement && React.cloneElement(labelElement, { key: "label" })}
+                                    {validationMessage}
+                                </View>
+                            </>
+                        ) : (
+                            <>
+                                <View
+                                    style={{
+                                        flexDirection: "column",
+                                        alignItems: "flex-start"
+                                    }}
+                                >
+                                    {labelElement && React.cloneElement(labelElement, { key: "label" })}
+                                    {validationMessage}
+                                </View>
+                                {React.cloneElement(switchElement, { key: "switch" })}
+                            </>
+                        )}
+                    </View>
+                </>
+            ) : (
+                // Vertical layout: label, switch, and validation message all in a column
+                <>
+                    {labelElement && React.cloneElement(labelElement, { key: "label" })}
+                    {React.cloneElement(switchElement, { key: "switch" })}
+                    {validationMessage}
+                </>
+            )}
         </View>
     );
 }
diff --git a/packages/pluggableWidgets/switch-native/src/Switch.xml b/packages/pluggableWidgets/switch-native/src/Switch.xml
index 1bffec638..ae69d2e2f 100644
--- a/packages/pluggableWidgets/switch-native/src/Switch.xml
+++ b/packages/pluggableWidgets/switch-native/src/Switch.xml
@@ -1,7 +1,5 @@
-<?xml version="1.0" encoding="utf-8"?>
-<widget id="com.mendix.widget.native.switch.Switch" supportedPlatform="Native" needsEntityContext="true" offlineCapable="true"
-        pluginWidget="true" xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
-        xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../../../node_modules/mendix/custom_widget.xsd">
+<?xml version="1.0" encoding="utf-8" ?>
+<widget id="com.mendix.widget.native.switch.Switch" supportedPlatform="Native" needsEntityContext="true" offlineCapable="true" pluginWidget="true" xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../../../node_modules/mendix/custom_widget.xsd">
     <name>Switch</name>
     <description>Toggle a boolean attribute.</description>
     <studioProCategory>Display</studioProCategory>
@@ -11,44 +9,52 @@
             <propertyGroup caption="Data source">
                 <property key="booleanAttribute" type="attribute">
                     <caption>Attribute</caption>
-                    <description/>
+                    <description />
                     <attributeTypes>
-                        <attributeType name="Boolean"/>
+                        <attributeType name="Boolean" />
                     </attributeTypes>
                 </property>
             </propertyGroup>
             <propertyGroup caption="Events">
                 <property key="onChange" type="action" required="false">
                     <caption>On change</caption>
-                    <description/>
+                    <description />
                 </property>
             </propertyGroup>
             <propertyGroup caption="Label">
                 <property key="showLabel" type="boolean" defaultValue="false">
                     <caption>Show label</caption>
-                    <description/>
+                    <description />
                 </property>
                 <property key="label" type="textTemplate" required="false">
                     <caption>Label</caption>
-                    <description/>
+                    <description />
                 </property>
                 <property key="labelOrientation" type="enumeration" defaultValue="horizontal">
                     <caption>Label orientation</caption>
-                    <description/>
+                    <description />
                     <enumerationValues>
                         <enumerationValue key="horizontal">Horizontal</enumerationValue>
                         <enumerationValue key="vertical">Vertical</enumerationValue>
                     </enumerationValues>
                 </property>
+                <property key="labelPosition" type="enumeration" defaultValue="left">
+                    <caption>Label position</caption>
+                    <description>The position of the label relative to the switch</description>
+                    <enumerationValues>
+                        <enumerationValue key="left">Left</enumerationValue>
+                        <enumerationValue key="right">Right</enumerationValue>
+                    </enumerationValues>
+                </property>
             </propertyGroup>
             <propertyGroup caption="Editability">
-                <systemProperty key="Editability"/>
+                <systemProperty key="Editability" />
             </propertyGroup>
             <propertyGroup caption="Visibility">
-                <systemProperty key="Visibility"/>
+                <systemProperty key="Visibility" />
             </propertyGroup>
             <propertyGroup caption="Common">
-                <systemProperty key="Name"/>
+                <systemProperty key="Name" />
             </propertyGroup>
         </propertyGroup>
     </properties>
diff --git a/packages/pluggableWidgets/switch-native/src/__tests__/Switch.spec.tsx b/packages/pluggableWidgets/switch-native/src/__tests__/Switch.spec.tsx
index 4c38f64ec..cdedd6d0e 100644
--- a/packages/pluggableWidgets/switch-native/src/__tests__/Switch.spec.tsx
+++ b/packages/pluggableWidgets/switch-native/src/__tests__/Switch.spec.tsx
@@ -1,15 +1,9 @@
-/**
- * @jest-environment jsdom
- */
 import { actionValue, EditableValueBuilder, dynamicValue } from "@mendix/piw-utils-internal";
-import { mount, ReactWrapper } from "enzyme";
+import { render, fireEvent, screen } from "@testing-library/react-native";
 import { createElement } from "react";
-
 import { Switch, Props } from "../Switch";
 import { defaultSwitchStyle } from "../ui/Styles";
 
-declare type RWrapper = ReactWrapper<any, Readonly<{}>, React.Component<{}, {}, any>>;
-
 const name = "Switch1";
 const createProps = (props?: Partial<Props>): Props => {
     const style = props?.style ?? {};
@@ -20,36 +14,28 @@ const createProps = (props?: Partial<Props>): Props => {
         showLabel: false,
         booleanAttribute: new EditableValueBuilder<boolean>().withValue(false).build(),
         onChange: undefined,
-        style: [{ ...defaultSwitchStyle, ...style }]
+        style: [{ ...defaultSwitchStyle, ...style }],
+        labelPosition: "left"
     };
 
     return { ...defaultProps, ...props };
 };
 
 describe("Switch", () => {
-    const switchIndex = 0;
     let Platform: any;
-    let switchWrapper: RWrapper;
-
-    function getSwitchComponent() {
-        return switchWrapper.find({ testID: "Switch1" }).at(switchIndex);
-    }
 
     beforeEach(() => {
         Platform = require("react-native").Platform;
     });
 
-    afterEach(() => {
-        switchWrapper.unmount();
-    });
-
     it("with editable value renders enabled", () => {
         const props = createProps({
             booleanAttribute: new EditableValueBuilder<boolean>().withValue(false).build()
         });
 
-        switchWrapper = mount(<Switch {...props} />);
-        expect(getSwitchComponent().prop("disabled")).toBe(false);
+        render(<Switch {...props} />);
+        const switchElement = screen.getByTestId("Switch1");
+        expect(switchElement.props.enabled).toBe(true);
     });
 
     it("with value in readOnly state renders disabled", () => {
@@ -57,8 +43,9 @@ describe("Switch", () => {
             booleanAttribute: new EditableValueBuilder<boolean>().withValue(false).isReadOnly().build()
         });
 
-        switchWrapper = mount(<Switch {...props} />);
-        expect(getSwitchComponent().prop("disabled")).toBe(true);
+        render(<Switch {...props} />);
+        const switchElement = screen.getByTestId("Switch1");
+        expect(switchElement.props.enabled).toBe(false);
     });
 
     it("with showLabel true renders label", () => {
@@ -66,22 +53,27 @@ describe("Switch", () => {
             showLabel: true
         });
 
-        switchWrapper = mount(<Switch {...props} />);
-        expect(switchWrapper.exists({ testID: `${name}$label` })).toEqual(true);
+        render(<Switch {...props} />);
+        expect(screen.getByTestId(`${name}$label`)).toBeTruthy();
     });
 
-    it("with showLabel true renders label horizontally", () => {
+    it("with showLabel true and horizontal orientation, renders label and switch in a row", () => {
         const props = createProps({
-            showLabel: true
+            showLabel: true,
+            labelOrientation: "horizontal",
+            label: dynamicValue<string>("Test Label", false)
         });
 
-        switchWrapper = mount(<Switch {...props} />);
-        expect(
-            switchWrapper
-                .find({ testID: `${name}$wrapper` })
-                .at(1)
-                .prop("style")
-        ).toEqual(expect.arrayContaining([{ flexDirection: "row", alignItems: "center" }]));
+        render(<Switch {...props} />);
+
+        const horizontalContainer = screen.getByTestId(`${name}$horizontalContainer`);
+
+        expect(horizontalContainer.props.style).toEqual(
+            expect.objectContaining({ flexDirection: "row", alignItems: "center" })
+        );
+
+        expect(horizontalContainer).toContainElement(screen.getByTestId(`${name}$label`));
+        expect(horizontalContainer).toContainElement(screen.getByTestId(name));
     });
 
     it("with showLabel true and labelOrientation vertical, renders vertical", () => {
@@ -90,14 +82,12 @@ describe("Switch", () => {
             labelOrientation: "vertical"
         });
 
-        switchWrapper = mount(<Switch {...props} />);
-
-        expect(
-            switchWrapper
-                .find({ testID: `${name}$wrapper` })
-                .at(1)
-                .prop("style")
-        ).toEqual(expect.not.arrayContaining([{ flexDirection: "row", alignItems: "center" }]));
+        render(<Switch {...props} />);
+        const wrapper = screen.getByTestId(`${name}$wrapper`);
+        expect(wrapper.props.style).toEqual(
+            expect.arrayContaining([{ flexDirection: "column", alignItems: "flex-start" }])
+        );
+        expect(screen.queryByTestId(`${name}$horizontalContainer`)).toBeNull();
     });
 
     it("with error renders validation message", () => {
@@ -105,32 +95,18 @@ describe("Switch", () => {
             booleanAttribute: new EditableValueBuilder<boolean>().withValidation("error").withValue(false).build()
         });
 
-        switchWrapper = mount(<Switch {...props} />);
-        expect(switchWrapper.prop("booleanAttribute").validation).toEqual("error");
-
-        expect(switchWrapper.exists({ testID: `${name}$alert` })).toEqual(true);
-        expect(
-            switchWrapper
-                .find({ testID: `${name}$alert` })
-                .at(1)
-                .text()
-        ).toEqual("error");
-    });
-
-    it("with iOS device renders correct property", () => {
-        Platform.OS = "ios";
-        const props = createProps();
-
-        switchWrapper = mount(<Switch {...props} />);
-        expect(getSwitchComponent().props()).toEqual(expect.objectContaining({ ios_backgroundColor: undefined }));
+        render(<Switch {...props} />);
+        expect(props.booleanAttribute.validation).toEqual("error");
+        expect(screen.getByTestId(`${name}$alert`)).toBeTruthy();
+        expect(screen.getByTestId(`${name}$alert`).props.children).toEqual("error");
     });
 
     it("with android device renders property", () => {
         Platform.OS = "android";
         const props = createProps();
 
-        switchWrapper = mount(<Switch {...props} />);
-        expect(getSwitchComponent().prop("ios_backgroundColor")).toBeUndefined();
+        render(<Switch {...props} />);
+        expect(screen.getByTestId("Switch1").props.ios_backgroundColor).toBeUndefined();
     });
 
     it("renders correct thumbColor when value is true", () => {
@@ -139,8 +115,8 @@ describe("Switch", () => {
             style: [{ ...defaultSwitchStyle, input: { thumbColorOn: "red" } }]
         });
 
-        switchWrapper = mount(<Switch {...props} />);
-        expect(getSwitchComponent().prop("thumbColor")).toEqual("red");
+        render(<Switch {...props} />);
+        expect(screen.getByTestId("Switch1").props.thumbTintColor).toEqual("red");
     });
 
     it("renders correct thumbColor when value is false", () => {
@@ -149,41 +125,45 @@ describe("Switch", () => {
             style: [{ ...defaultSwitchStyle, input: { thumbColorOff: "blue" } }]
         });
 
-        switchWrapper = mount(<Switch {...props} />);
-        expect(getSwitchComponent().prop("thumbColor")).toEqual("blue");
+        render(<Switch {...props} />);
+        expect(screen.getByTestId("Switch1").props.thumbTintColor).toEqual("blue");
     });
 
     describe("interactions", () => {
         it("invokes onValueChange handler", () => {
+            const onChange = actionValue();
+            const booleanAttribute = new EditableValueBuilder<boolean>().withValue(false).build();
             const props = createProps({
-                booleanAttribute: new EditableValueBuilder<boolean>().withValue(false).build(),
-                onChange: actionValue()
+                booleanAttribute,
+                onChange
             });
-            switchWrapper = mount(<Switch {...props} />);
+            render(<Switch {...props} />);
 
-            expect(switchWrapper.prop("booleanAttribute").value).toBe(false);
-            expect(switchWrapper.prop("onChange").execute).not.toHaveBeenCalled();
+            expect(booleanAttribute.value).toBe(false);
+            expect(onChange.execute).not.toHaveBeenCalled();
 
-            getSwitchComponent().simulate("change");
+            fireEvent(screen.getByTestId("Switch1"), "valueChange", true);
 
-            expect(switchWrapper.prop("booleanAttribute").value).toBe(true);
-            expect(switchWrapper.prop("onChange").execute).toHaveBeenCalled();
+            expect(booleanAttribute.value).toBe(true);
+            expect(onChange.execute).toHaveBeenCalled();
         });
 
         it("when disabled, do not invoke onValueChange handler", () => {
+            const onChange = actionValue();
+            const booleanAttribute = new EditableValueBuilder<boolean>().withValue(false).isReadOnly().build();
             const props = createProps({
-                booleanAttribute: new EditableValueBuilder<boolean>().withValue(false).isReadOnly().build(),
-                onChange: actionValue()
+                booleanAttribute,
+                onChange
             });
-            switchWrapper = mount(<Switch {...props} />);
+            render(<Switch {...props} />);
 
-            expect(switchWrapper.prop("booleanAttribute").value).toBe(false);
-            expect(switchWrapper.prop("onChange").execute).not.toHaveBeenCalled();
+            expect(booleanAttribute.value).toBe(false);
+            expect(onChange.execute).not.toHaveBeenCalled();
 
-            getSwitchComponent().simulate("change");
+            fireEvent(screen.getByTestId("Switch1"), "valueChange", true);
 
-            expect(switchWrapper.prop("booleanAttribute").value).toBe(false);
-            expect(switchWrapper.prop("onChange").execute).not.toHaveBeenCalled();
+            expect(booleanAttribute.value).toBe(false);
+            expect(onChange.execute).not.toHaveBeenCalled();
         });
     });
-});
+});
\ No newline at end of file
diff --git a/packages/pluggableWidgets/switch-native/src/assets/checked-dark.svg b/packages/pluggableWidgets/switch-native/src/assets/checked-dark.svg
index bd5e31bb6..d80ba755e 100644
--- a/packages/pluggableWidgets/switch-native/src/assets/checked-dark.svg
+++ b/packages/pluggableWidgets/switch-native/src/assets/checked-dark.svg
@@ -1,4 +1,4 @@
-<svg width="80" height="30" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="51" height="30" viewBox="0 0 51 30" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <defs>
         <path d="M15 0h21c8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15H15C6.716 30 0 23.284 0 15 0 6.716 6.716 0 15 0z"
               id="a"/>
diff --git a/packages/pluggableWidgets/switch-native/src/assets/checked.svg b/packages/pluggableWidgets/switch-native/src/assets/checked.svg
index 15afc0cea..6a828d278 100644
--- a/packages/pluggableWidgets/switch-native/src/assets/checked.svg
+++ b/packages/pluggableWidgets/switch-native/src/assets/checked.svg
@@ -1,4 +1,4 @@
-<svg width="80" height="30" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="51" height="30" viewBox="0 0 51 30" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <defs>
         <path d="M15 0h21c8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15H15C6.716 30 0 23.284 0 15 0 6.716 6.716 0 15 0z"
               id="a"/>
diff --git a/packages/pluggableWidgets/switch-native/src/package.xml b/packages/pluggableWidgets/switch-native/src/package.xml
index b7e7c6f86..36e64d933 100644
--- a/packages/pluggableWidgets/switch-native/src/package.xml
+++ b/packages/pluggableWidgets/switch-native/src/package.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <package xmlns="http://www.mendix.com/package/1.0/">
-    <clientModule name="Switch" version="1.1.0" xmlns="http://www.mendix.com/clientModule/1.0/">
+    <clientModule name="Switch" version="1.1.1" xmlns="http://www.mendix.com/clientModule/1.0/">
         <widgetFiles>
             <widgetFile path="Switch.xml" />
         </widgetFiles>
diff --git a/packages/pluggableWidgets/switch-native/src/ui/Styles.ts b/packages/pluggableWidgets/switch-native/src/ui/Styles.ts
index f97731217..c4af5569e 100644
--- a/packages/pluggableWidgets/switch-native/src/ui/Styles.ts
+++ b/packages/pluggableWidgets/switch-native/src/ui/Styles.ts
@@ -25,7 +25,6 @@ export interface SwitchStyle extends Style {
 export const defaultSwitchStyle: SwitchStyle = {
     container: {
         // All ViewStyle properties are allowed
-        paddingVertical: 4,
         justifyContent: "center"
     },
     containerDisabled: {
@@ -50,6 +49,5 @@ export const defaultSwitchStyle: SwitchStyle = {
     },
     validationMessage: {
         // All TextStyle properties are allowed
-        alignSelf: "stretch"
     }
 };
diff --git a/packages/pluggableWidgets/switch-native/tsconfig.json b/packages/pluggableWidgets/switch-native/tsconfig.json
index 89776d5ca..5b6279c21 100644
--- a/packages/pluggableWidgets/switch-native/tsconfig.json
+++ b/packages/pluggableWidgets/switch-native/tsconfig.json
@@ -3,6 +3,7 @@
     "baseUrl": "./",
     "include": ["./src", "./typings"],
     "compilerOptions": {
-        "typeRoots": ["node_modules/@types", "../../../node_modules/@types"]
+        "typeRoots": ["node_modules/@types", "../../../node_modules/@types"],
+        "jsxFragmentFactory": "Fragment"
     }
 }
diff --git a/packages/pluggableWidgets/switch-native/typings/SwitchProps.d.ts b/packages/pluggableWidgets/switch-native/typings/SwitchProps.d.ts
index 45403a3de..c9da75030 100644
--- a/packages/pluggableWidgets/switch-native/typings/SwitchProps.d.ts
+++ b/packages/pluggableWidgets/switch-native/typings/SwitchProps.d.ts
@@ -8,6 +8,8 @@ import { ActionValue, DynamicValue, EditableValue } from "mendix";
 
 export type LabelOrientationEnum = "horizontal" | "vertical";
 
+export type LabelPositionEnum = "left" | "right";
+
 export interface SwitchProps<Style> {
     name: string;
     style: Style[];
@@ -16,6 +18,7 @@ export interface SwitchProps<Style> {
     showLabel: boolean;
     label?: DynamicValue<string>;
     labelOrientation: LabelOrientationEnum;
+    labelPosition: LabelPositionEnum;
 }
 
 export interface SwitchPreviewProps {
@@ -33,4 +36,5 @@ export interface SwitchPreviewProps {
     showLabel: boolean;
     label: string;
     labelOrientation: LabelOrientationEnum;
+    labelPosition: LabelPositionEnum;
 }
diff --git a/yarn.lock b/yarn.lock
index 7552e0eea..aa932bae0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2126,6 +2126,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@jest/diff-sequences@npm:30.0.1":
+  version: 30.0.1
+  resolution: "@jest/diff-sequences@npm:30.0.1"
+  checksum: 10/0ddb7c7ba92d6057a2ee51a9cfc2155b77cca707fe959167466ea02dcb0687018cc3c22b9622f25f3a417d6ad370e2d4dcfedf9f1410dc9c02954a7484423cc7
+  languageName: node
+  linkType: hard
+
 "@jest/environment@npm:^29.7.0":
   version: 29.7.0
   resolution: "@jest/environment@npm:29.7.0"
@@ -2171,6 +2178,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@jest/get-type@npm:30.1.0":
+  version: 30.1.0
+  resolution: "@jest/get-type@npm:30.1.0"
+  checksum: 10/e2a95fbb49ce2d15547db8af5602626caf9b05f62a5e583b4a2de9bd93a2bfe7175f9bbb2b8a5c3909ce261d467b6991d7265bb1d547cb60e7e97f571f361a70
+  languageName: node
+  linkType: hard
+
 "@jest/globals@npm:^29.7.0":
   version: 29.7.0
   resolution: "@jest/globals@npm:29.7.0"
@@ -2220,6 +2234,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@jest/schemas@npm:30.0.5":
+  version: 30.0.5
+  resolution: "@jest/schemas@npm:30.0.5"
+  dependencies:
+    "@sinclair/typebox": "npm:^0.34.0"
+  checksum: 10/40df4db55d4aeed09d1c7e19caf23788309cea34490a1c5d584c913494195e698b9967e996afc27226cac6d76e7512fe73ae6b9584480695c60dd18a5459cdba
+  languageName: node
+  linkType: hard
+
 "@jest/schemas@npm:^29.6.3":
   version: 29.6.3
   resolution: "@jest/schemas@npm:29.6.3"
@@ -3364,6 +3387,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@sinclair/typebox@npm:^0.34.0":
+  version: 0.34.48
+  resolution: "@sinclair/typebox@npm:0.34.48"
+  checksum: 10/186eebb338255db7cfd77c2f94be0ad91816c7b5ee994c3adb95e0474ae98b769574c2b6b1f26a81613d7148ed20b11e02528f4263d8d95e3ca8dcf8faaf5306
+  languageName: node
+  linkType: hard
+
 "@sinonjs/commons@npm:^3.0.0":
   version: 3.0.1
   resolution: "@sinonjs/commons@npm:3.0.1"
@@ -3468,6 +3498,26 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@testing-library/react-native@npm:^13.3.3":
+  version: 13.3.3
+  resolution: "@testing-library/react-native@npm:13.3.3"
+  dependencies:
+    jest-matcher-utils: "npm:^30.0.5"
+    picocolors: "npm:^1.1.1"
+    pretty-format: "npm:^30.0.5"
+    redent: "npm:^3.0.0"
+  peerDependencies:
+    jest: ">=29.0.0"
+    react: ">=18.2.0"
+    react-native: ">=0.71"
+    react-test-renderer: ">=18.2.0"
+  peerDependenciesMeta:
+    jest:
+      optional: true
+  checksum: 10/06aaddabbba401f9f322607aba5db859e25aab0007366bab5f540199af3c6e479b4920acf95433153a3a3c557ab008374bb86de2c94c5489159ab8f0b9576a09
+  languageName: node
+  linkType: hard
+
 "@testing-library/react@npm:^13.4.0":
   version: 13.4.0
   resolution: "@testing-library/react@npm:13.4.0"
@@ -4591,7 +4641,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ansi-styles@npm:^5.0.0":
+"ansi-styles@npm:^5.0.0, ansi-styles@npm:^5.2.0":
   version: 5.2.0
   resolution: "ansi-styles@npm:5.2.0"
   checksum: 10/d7f4e97ce0623aea6bc0d90dcd28881ee04cba06c570b97fd3391bd7a268eedfd9d5e2dd4fdcbdd82b8105df5faf6f24aaedc08eaf3da898e702db5948f63469
@@ -9798,6 +9848,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"jest-diff@npm:30.2.0":
+  version: 30.2.0
+  resolution: "jest-diff@npm:30.2.0"
+  dependencies:
+    "@jest/diff-sequences": "npm:30.0.1"
+    "@jest/get-type": "npm:30.1.0"
+    chalk: "npm:^4.1.2"
+    pretty-format: "npm:30.2.0"
+  checksum: 10/1fb9e4fb7dff81814b4f69eaa7db28e184d62306a3a8ea2447d02ca53d2cfa771e83ede513f67ec5239dffacfaac32ff2b49866d211e4c7516f51c1fc06ede42
+  languageName: node
+  linkType: hard
+
 "jest-diff@npm:^29.0.1, jest-diff@npm:^29.7.0":
   version: 29.7.0
   resolution: "jest-diff@npm:29.7.0"
@@ -9956,6 +10018,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"jest-matcher-utils@npm:^30.0.5":
+  version: 30.2.0
+  resolution: "jest-matcher-utils@npm:30.2.0"
+  dependencies:
+    "@jest/get-type": "npm:30.1.0"
+    chalk: "npm:^4.1.2"
+    jest-diff: "npm:30.2.0"
+    pretty-format: "npm:30.2.0"
+  checksum: 10/f3f1ecf68ca63c9d1d80a175637a8fc655edfd1ee83220f6e3f6bd464ecbe2f93148fdd440a5a5e5a2b0b2cc8ee84ddc3dcef58a6dbc66821c792f48d260c6d4
+  languageName: node
+  linkType: hard
+
 "jest-message-util@npm:^29.7.0":
   version: 29.7.0
   resolution: "jest-message-util@npm:29.7.0"
@@ -13548,6 +13622,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pretty-format@npm:30.2.0, pretty-format@npm:^30.0.5":
+  version: 30.2.0
+  resolution: "pretty-format@npm:30.2.0"
+  dependencies:
+    "@jest/schemas": "npm:30.0.5"
+    ansi-styles: "npm:^5.2.0"
+    react-is: "npm:^18.3.1"
+  checksum: 10/725890d648e3400575eebc99a334a4cd1498e0d36746313913706bbeea20ada27e17c184a3cd45c50f705c16111afa829f3450233fc0fda5eed293c69757e926
+  languageName: node
+  linkType: hard
+
 "pretty-format@npm:^26.5.2, pretty-format@npm:^26.6.2":
   version: 26.6.2
   resolution: "pretty-format@npm:26.6.2"
@@ -16240,6 +16325,8 @@ __metadata:
     "@mendix/piw-native-utils-internal": "npm:*"
     "@mendix/piw-utils-internal": "npm:*"
     "@mendix/pluggable-widgets-tools": "npm:~10.0.1"
+    "@testing-library/jest-native": "npm:^5.4.3"
+    "@testing-library/react-native": "npm:^13.3.3"
     eslint: "npm:^7.32.0"
   languageName: unknown
   linkType: soft