Skip to content

feat(Split): add colorScheme#3961

Open
sgaczol wants to merge 4 commits intomainfrom
@sgaczol/split-darkmode
Open

feat(Split): add colorScheme#3961
sgaczol wants to merge 4 commits intomainfrom
@sgaczol/split-darkmode

Conversation

@sgaczol
Copy link
Copy Markdown
Collaborator

@sgaczol sgaczol commented Apr 30, 2026

Description

Adds support for colorScheme prop for SplitHost. Color scheme will be propagated down the hierarchy.

Closes https://github.com/issues/assigned?issue=software-mansion%7Creact-native-screens-labs%7C1026

Changes

  • add colorScheme prop toSplitHost
  • handle colorScheme on iOS side
  • add test-split-color-scheme

After - visual documentation

SplitHostColorScheme.mov

Note: SettingsPicker does not update on SplitHost colorScheme updates because ThemeProvider is not used in this test. This is due to ThemeProvider not handling theme='undefined' properly, which would be necessary for the inherit case.

Test plan

Run test-split-color-scheme.tsx

Checklist

  • Included code example that can be used to test this change.
  • For visual changes, included screenshots / GIFs / recordings documenting the change.
  • For API changes, updated relevant public types.
  • Ensured that CI passes

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

Copy link
Copy Markdown
Contributor

@kligarski kligarski left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good but I have some suggestions/questions.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It would be nice to follow new test convention (separate directory, scenario.md).

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done e0af554

},
content: {
padding: 20,
paddingTop: Platform.OS === 'android' ? 60 : undefined,
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
paddingTop: Platform.OS === 'android' ? 60 : undefined,

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

setHostColorScheme: (value: SplitHostColorScheme) => void;
}) {
return (
<ScrollView style={styles.container} contentContainerStyle={styles.content}>
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<ScrollView style={styles.container} contentContainerStyle={styles.content}>
<ScrollView
style={styles.container}
contentContainerStyle={styles.content}
contentInsetAdjustmentBehavior="automatic">

This will correctly offset the content in the column.

platforms: ['ios'],
};

export function ConfigColumn({
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Image

Once again I see this - is this a native bug?

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adding contentInsetAdjustmentBehavior="automatic" and using SafeAreaView fixed it:
1f2389d

@sgaczol sgaczol requested a review from kligarski May 5, 2026 13:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants