diff --git a/.gitignore b/.gitignore index 7535671..4439330 100644 --- a/.gitignore +++ b/.gitignore @@ -68,3 +68,4 @@ android/keystores/debug.keystore # generated by bob lib/ +example/web-build/ \ No newline at end of file diff --git a/README.md b/README.md index 87ddd6f..ec5979e 100644 --- a/README.md +++ b/README.md @@ -3,8 +3,6 @@ https://github.com/animate-react-native/marquee/assets/2805320/4fb199b2-491c-4621-bf84-85890a8d6f5e - - [![NPM Version](https://img.shields.io/npm/v/@animatereactnative/marquee.svg?style=flat&color=black)](https://www.npmjs.org/package/@animatereactnative/marquee) [![runs with expo](https://img.shields.io/badge/Runs%20with%20Expo-4630EB.svg?style=flat-square&logo=EXPO&labelColor=f3f3f3&logoColor=000)](https://expo.io/) [![npm](https://img.shields.io/npm/l/@animatereactnative/marquee?style=flat-square)](https://www.npmjs.com/package/@animatereactnative/marquee) [![npm](https://img.shields.io/badge/types-included-blue?style=flat-square)](https://www.npmjs.com/package/@animatereactnative/marquee) Follow Miron Catalin @@ -44,12 +42,14 @@ export function Example() { ## Props -| name | description | required | type | default | -| ---------- | -------------------------------------------------------------------------- | -------- | ---------------------- | ------- | -| `children` | Any component that you'd like to apply infinite scrolling / marquee effect | YES | `React.ReactNode` | 1 | -| `speed` | Animation speed | NO | `number` | 1 | -| `spacing` | Spacing between repeting elements | NO | `number` | 0 | -| `style` | View style to be applied to Marquee container. | NO | `StyleProp` | | +| name | description | required | type | default | +| ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | -------- | ---------------------- | ---------------------------- | +| `children` | Any component that you'd like to apply infinite scrolling / marquee effect | YES | `React.ReactNode` | 1 | +| `speed` | Animation speed | NO | `number` | 1 | +| `spacing` | Spacing between repeting elements | NO | `number` | 0 | +| `reverse` | Determine if the animation should be reversed or not. Based on `direction`, `reverse` means left-to-right, right-to-left, top-to-bottom, bottom-to-top | NO | `boolean` | false | +| `direction` | Direction of the animation | NO | `"horizontal"` | `"vertical" or "horizontal"` | +| `style` | View style to be applied to Marquee container. | NO | `StyleProp` | | ## Contributing diff --git a/example/.env b/example/.env new file mode 100644 index 0000000..4c1893c --- /dev/null +++ b/example/.env @@ -0,0 +1 @@ +PUBLIC_URL="/marquee" \ No newline at end of file diff --git a/example/.yarn/install-state.gz b/example/.yarn/install-state.gz new file mode 100644 index 0000000..667af09 Binary files /dev/null and b/example/.yarn/install-state.gz differ diff --git a/example/app.json b/example/app.json index 05e5eb2..22dd45d 100644 --- a/example/app.json +++ b/example/app.json @@ -1,7 +1,7 @@ { "expo": { - "name": "example", - "slug": "example", + "name": "marquee", + "slug": "marquee", "version": "1.0.0", "orientation": "portrait", "icon": "./assets/icon.png", @@ -11,9 +11,7 @@ "resizeMode": "contain", "backgroundColor": "#ffffff" }, - "assetBundlePatterns": [ - "**/*" - ], + "assetBundlePatterns": ["**/*"], "ios": { "supportsTablet": true }, @@ -25,6 +23,9 @@ }, "web": { "favicon": "./assets/favicon.png" + }, + "experiments": { + "baseUrl": "/marquee" } } } diff --git a/example/dist/.nojekyll b/example/dist/.nojekyll new file mode 100644 index 0000000..e69de29 diff --git a/example/package.json b/example/package.json index d605e20..11ae9d6 100644 --- a/example/package.json +++ b/example/package.json @@ -2,26 +2,31 @@ "name": "example", "version": "1.0.0", "main": "node_modules/expo/AppEntry.js", + "homepage": "/marquee", "scripts": { "start": "expo start", "android": "expo start --android", "ios": "expo start --ios", - "web": "expo start --web" + "web": "expo start --web", + "deploy": "expo export:web -c && gh-pages -t -d web-build --nojekyll" }, "dependencies": { - "expo": "~49.0.7", - "expo-status-bar": "~1.6.0", + "expo": "^51.0.38", + "expo-status-bar": "~1.12.1", "react": "18.2.0", "react-dom": "18.2.0", - "react-native": "0.72.3", - "react-native-reanimated": "~3.3.0", - "react-native-web": "~0.19.6" + "react-native": "0.74.5", + "react-native-reanimated": "~3.10.1", + "react-native-web": "~0.19.10" }, "devDependencies": { - "@babel/core": "^7.20.0", - "@expo/webpack-config": "^18.0.1", + "@babel/core": "^7.24.0", + "@expo/metro-runtime": "~3.2.3", + "@expo/webpack-config": "~19.0.1", + "@types/gh-pages": "^6", "babel-loader": "^8.1.0", - "babel-plugin-module-resolver": "^5.0.0" + "babel-plugin-module-resolver": "^5.0.0", + "gh-pages": "^6.2.0" }, "private": true } diff --git a/example/public/.nojekyll b/example/public/.nojekyll new file mode 100644 index 0000000..e69de29 diff --git a/example/src/App.tsx b/example/src/App.tsx index 14b7c09..711d8f0 100644 --- a/example/src/App.tsx +++ b/example/src/App.tsx @@ -12,10 +12,8 @@ export default function App() { return (