search

octopitus / rn-sliding-up-panel

Draggable sliding up panel implemented in React Native https://octopitus.github.io/rn-sliding-up-panel/
MIT License
928 stars 157 forks source link

Can we use this in React JS (web) without react native. #174

Open bandava opened 4 years ago

bandava commented 4 years ago

Hi, I have a requirement to implementing sliding up panel from bottom in React Js with snapping points exactly like Google map sliding bottom panel with some snapping points. I e when I swipe it up first time it should move to 1/3rd height and again if we swipe it up, it should go to 2/3 rd height. For the last swipe up, it should go to full screen. Can anyone please provide the working prototype with this for React Js. I am confusing by reading this as it is saying that it can work on any platform even on web but when I checked the web version, it has some react native dependencies. Please clarify me and help me to solve this

octopitus commented 4 years ago

The component depends on some native-like features (PanResponder, View...). But can work on web with the help of react-native-web. If your project created with CRA, it works out of the box. Otherwise, you have to install react-native-web, and alias react-native to react-native-web.

Below is the an with Webpack config:

{
  resolve: {
    alias: {
      'react-native$': 'react-native-web'
    },
  }
}
bandava commented 4 years ago

Hi, Thank you for your reply. Seems my project is not having webpack on root folder and need to eject the react script to modify it. Is there any alternative to add webpack without ejecting or disturbing the existing project and add above references?

octopitus commented 4 years ago

Have you tried https://github.com/arackaf/customize-cra?