diff --git a/apps/src/tests/single-feature-tests/split/index.ts b/apps/src/tests/single-feature-tests/split/index.ts index fb71522122..d2ca9e7e37 100644 --- a/apps/src/tests/single-feature-tests/split/index.ts +++ b/apps/src/tests/single-feature-tests/split/index.ts @@ -1,8 +1,13 @@ import type { ScenarioGroup } from '@apps/tests/shared/helpers'; import TestTopColumnForCollapsing from './test-top-column-for-collapsing'; import TestCommandShowColumn from './test-command-show-column'; +import TestDirection from './test-split-direction'; -const scenarios = { TestTopColumnForCollapsing, TestCommandShowColumn }; +const scenarios = { + TestTopColumnForCollapsing, + TestCommandShowColumn, + TestDirection, +}; const SplitScenarioGroup: ScenarioGroup = { name: 'Split', diff --git a/apps/src/tests/single-feature-tests/split/test-split-direction.tsx b/apps/src/tests/single-feature-tests/split/test-split-direction.tsx new file mode 100644 index 0000000000..492aec5fd1 --- /dev/null +++ b/apps/src/tests/single-feature-tests/split/test-split-direction.tsx @@ -0,0 +1,102 @@ +import React, { useState } from 'react'; +import type { ScenarioDescription } from '@apps/tests/shared/helpers'; +import { createScenario } from '@apps/tests/shared/helpers'; +import { Split, SplitHostDirection } from 'react-native-screens/experimental'; +import { StyleSheet, Text, View, Button } from 'react-native'; + +const scenarioDescription: ScenarioDescription = { + name: 'Prop: direction', + key: 'test-split-direction', + details: ` + Test the direction prop in Split component. + `, + platforms: ['ios'], +}; + +export function App() { + const [direction, setDirection] = useState('inherit'); + + return ( + + + + + + + + + ); +} + +export function ColumnContent(props: { + columnTitle: string; + currentDirection?: SplitHostDirection; + onChangeDirection?: (dir: SplitHostDirection) => void; +}) { + return ( + + {props.columnTitle} + + {props.onChangeDirection && ( + + + Current direction:{' '} + {props.currentDirection} + + + +