Skip to content

Conversation

mrzachnugent
Copy link
Collaborator

@mrzachnugent mrzachnugent commented Apr 23, 2025

Description

  • Web without the need for react-native and react-native-web. For web frameworks, this new feature only requires minor changes (configuration for platform-specific file resolution and some CSS) and for expo only the CSS changes
  • Working exit animations on web
  • A single Slot component (instead of Slot.View, Slot.Pressable and so on)
  • React 19
  • A core package for Platform-First Universal components: View, Pressable, Text, and Image. It is the foundation for the primitives to work without react-native or react-native-web on the web.
  • Improves accessibility features
  • Various other improvements

TODO

For all components

  1. Update/add radix-ui package
  2. Add the "@rn-primitives/core": "workspace:" and "@rn-primitives/utils": "workspace:" to package.json
  3. Adjust the exports in the package.json (use the same from the other packages)
  4. Copy everything from _temp/src, paste it the src folder, and replace the “component” with the name of the component
  5. Copy _temp/tsup.config.ts and replace “component” with the name of the component
  6. Make the types for the base-type.ts
  7. Adjust the native files
  8. Adjust the web files
  9. Adjust the universal files
  10. Test it on nextjs, vite, and expo
  11. Remove unnecessary package.json dependencies and update peer dependencies and peer dependencies meta

PART ONE:

  • Accordion
  • Alert Dialog
  • Aspect-ratio
  • Avatar
  • Checkbox
  • Collapsible
  • Dialog
  • Label
  • Progress
  • Radio-group
  • Separator
  • Slider
  • Switch
  • Tabs
  • Toast
  • Toggle
  • Toggle-group
  • Toolbar

PART TWO:

  • Refactor use-relative-position for both architectures
  • Make re-usable Menu components

PART THREE:

  • Context-menu
  • Dropdown-menu
  • Hover-card
  • Menubar
  • Navigation-menu
  • Popover
  • Select
  • Tooltip

PART FOUR:

  • Revisit Table (toss?)
  • Types (refactor and consider if needed, maybe move remaining types to core?)
  • Make sure react-native-web is no longer a dev/peer/dependency in any packages
  • Using @layer base, write css so that the styling is the same on web. Something like
@layer base { 
    [data-rn-primitives=“view”] { 
        @apply flex flex-col 
    }
}
  • Write css that can be copy pasted using normal css too
  • Write next config and vite config packages
  • Revise all packages
  • (?) Make a rn-primitives package with all primitives like radix-ui
  • DOCS

@mrzachnugent
Copy link
Collaborator Author

Hey @TheMichio, thanks!

We have a rn-primitives channel in the ronin server on Discord. It would be best to discuss things there.

feat(separator): implement separator v2
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