Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Add SegmentedControl and LiquidGlass demos to the Expo example app

Open Beginner friendly
  • Is something wrong?
#18 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
88/100
Issue type
Feature
Clarity
Clearly specified
Activity status
Active
Tech stack
react-native, typescript
Domain
mobile

Research direction

Start with example-expo/src/App.tsx and compare the reference implementations in example/src/SegmentedControlDemo.tsx and example/src/LiquidGlassDemo.tsx, along with the README sections named in the issue. Run yarn example-expo prebuild, then the Android or iOS dev client command. Done means both demos appear in the Expo app with the requested labels, icon, badge, disabled state, background image, and unsupported-platform fallback text.

Written by the indexing model from the issue text.

Description

good first issue help wanted

example-expo/src/App.tsx demonstrates DatePicker, ContextMenu and SelectionMenu, but not SegmentedControl or LiquidGlass. The bare example/ app has demos for all five; the Expo app should match so Expo users can see everything working under the config plugin.

Task

  • Add a SegmentedControl demo (segments with labels, one with an icon, one with a badge, one disabled) and a LiquidGlass demo (with a background image and the isLiquidGlassSupported fallback text) to example-expo/src/App.tsx.
  • Keep the existing structure and styling of the file.
  • Run it with yarn example-expo prebuild then yarn example-expo android / ios (dev client; this library does not run in Expo Go).

Where to look

  • example-expo/src/App.tsx
  • example/src/SegmentedControlDemo.tsx and example/src/LiquidGlassDemo.tsx for reference implementations
  • README sections "SegmentedControl" and "LiquidGlass"
Dominant language
TypeScript
Stars
18
Forks
1
Avg merge
4h 36m
Merged PRs (30d)
52

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from JarX-Concepts/react-native-platform-components

All issues in JarX-Concepts/react-native-platform-components

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.