fix: add modalProps to Hint

packages/react-native-ui-lib/src/components/hint/__tests__/index.spec.tsx

@@ -64,6 +64,14 @@ describe('Hint Screen component test', () => {
     expect(driver.getModal().isVisible()).toBe(false);
   });
 
+  it('Should pass modalProps to the modal', async () => {
+    const renderTree = render(
+      <TestCase visible withModal modalProps={{supportedOrientations: ['landscape']}}/>
+    );
+
+    expect(renderTree.getByTestId(`${HINT_TEST_ID}.modal`).props.supportedOrientations).toEqual(['landscape']);
+  });
+
   // TODO: This scenario tests doesn't pass, need to fix it using act
   it.skip('Should modal be visible when showHint is true', async () => {
     const renderTree = render(<TestCase visible withModal/>);

packages/react-native-ui-lib/src/components/hint/hint.api.json

@@ -54,6 +54,11 @@
       "type": "boolean",
       "description": "Open the hint using a Modal component"
     },
+    {
+      "name": "modalProps",
+      "type": "ModalProps",
+      "description": "Pass props to the hint modal"
+    },
     {
       "name": "useSideTip",
       "type": "boolean",

packages/react-native-ui-lib/src/components/hint/index.tsx

@@ -26,6 +26,7 @@ const Hint = (props: HintProps) => {
   const {
     visible,
     useModal = true,
+    modalProps,
     position = HintPositions.BOTTOM,
     children,
     message,
@@ -216,6 +217,7 @@ const Hint = (props: HintProps) => {
       {renderChildren()}
       {isUsingModal ? (
         <Modal
+          {...modalProps}
           visible={showHint}
           animationType={backdropColor ? 'fade' : 'none'}
           overlayBackgroundColor={backdropColor}

packages/react-native-ui-lib/src/components/hint/types.ts

@@ -8,6 +8,7 @@ import type {
   TextStyle,
   ViewStyle
 } from 'react-native';
+import type {ModalProps} from '../modal';
 
 export type PositionStyle = Pick<ViewStyle, 'top' | 'bottom' | 'left' | 'right'>;
 
@@ -65,6 +66,10 @@ export interface HintProps {
    * Open the hint using a Modal component
    */
   useModal?: boolean;
+  /**
+   * Additional props for the modal
+   */
+  modalProps?: ModalProps;
   /**
    * Show side tips instead of the middle tip
    */