@one-am/react-native-simple-image-slider 0.15.0 → 0.16.0

package/package.json

@@ -1,166 +1,167 @@
 {
-  "name": "@one-am/react-native-simple-image-slider",
-  "version": "0.15.0",
-  "description": "A simple and performant image slider made with FlashList. Includes a full screen gallery component with gesture support.",
-  "main": "lib/commonjs/index",
-  "module": "lib/module/index",
-  "types": "lib/typescript/src/index.d.ts",
-  "react-native": "src/index",
-  "source": "src/index",
-  "files": [
-    "src",
-    "lib",
-    "android",
-    "ios",
-    "cpp",
-    "*.podspec",
-    "!ios/build",
-    "!android/build",
-    "!android/gradle",
-    "!android/gradlew",
-    "!android/gradlew.bat",
-    "!android/local.properties",
-    "!**/__tests__",
-    "!**/__fixtures__",
-    "!**/__mocks__",
-    "!**/.*"
-  ],
-  "scripts": {
-    "example": "yarn workspace @one-am/react-native-simple-image-slider-example",
-    "test": "jest",
-    "typecheck": "tsc --noEmit",
-    "lint": "eslint \"**/*.{js,ts,tsx}\"",
-    "clean": "del-cli lib",
-    "prepare": "bob build",
-    "release": "release-it"
-  },
-  "keywords": [
-    "react-native",
-    "image-slider",
-    "gallery"
-  ],
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/one-am-it/react-native-simple-image-slider.git"
-  },
-  "author": "one-am <info@oneam.it> (https://github.com/one-am-it)",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/one-am-it/react-native-simple-image-slider/issues"
-  },
-  "homepage": "https://github.com/one-am-it/react-native-simple-image-slider#readme",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/",
-    "access": "public"
-  },
-  "dependencies": {
-    "merge-refs": "^1.2.2"
-  },
-  "peerDependencies": {
-    "@shopify/flash-list": "*",
-    "expo-haptics": "*",
-    "expo-image": "*",
-    "expo-status-bar": "*",
-    "react": "*",
-    "react-native": "*",
-    "react-native-gesture-handler": "*",
-    "react-native-reanimated": "*",
-    "react-native-safe-area-context": "*",
-    "react-native-svg": "*",
-    "styled-components": "*"
-  },
-  "devDependencies": {
-    "@babel/runtime": "^7.24.1",
-    "@commitlint/config-conventional": "^17.0.2",
-    "@evilmartians/lefthook": "^1.5.0",
-    "@react-native/babel-preset": "^0.75.0-main",
-    "@react-native/eslint-config": "^0.73.1",
-    "@release-it/conventional-changelog": "^5.0.0",
-    "@shopify/flash-list": "^1.6.3",
-    "@types/jest": "^29.5.5",
-    "@types/react": "^18.2.44",
-    "@typescript-eslint/eslint-plugin": "^5.62.0",
-    "@typescript-eslint/parser": "^5.62.0",
-    "babel-plugin-styled-components": "^2.1.4",
-    "commitlint": "^17.0.2",
-    "del-cli": "^5.1.0",
-    "eslint": "^8.56.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-config-standard-with-typescript": "^37.0.0",
-    "eslint-plugin-ft-flow": "^3.0.7",
-    "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-n": "^16.6.2",
-    "eslint-plugin-prettier": "^5.0.1",
-    "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-react-native": "^4.1.0",
-    "expo-haptics": "^12.8.1",
-    "expo-image": "^1.10.6",
-    "expo-status-bar": "^1.11.1",
-    "jest": "^29.7.0",
-    "prettier": "^3.4.2",
-    "react": "18.2.0",
-    "react-native": "0.74.5",
-    "react-native-builder-bob": "^0.35.2",
-    "react-native-gesture-handler": "~2.16.1",
-    "react-native-reanimated": "~3.10.1",
-    "react-native-safe-area-context": "4.10.5",
-    "react-native-svg": "15.2.0",
-    "react-native-web": "~0.19.6",
-    "release-it": "^15.0.0",
-    "styled-components": "^6.1.13",
-    "typescript": "^5.4.2",
-    "typescript-plugin-styled-components": "^3.0.0"
-  },
-  "resolutions": {
-    "styled-components": "^6.1.13"
-  },
-  "workspaces": [
-    "example"
-  ],
-  "packageManager": "yarn@3.6.1",
-  "jest": {
-    "preset": "react-native",
-    "modulePathIgnorePatterns": [
-      "<rootDir>/example/node_modules",
-      "<rootDir>/lib/"
-    ]
-  },
-  "commitlint": {
-    "extends": [
-      "@commitlint/config-conventional"
-    ]
-  },
-  "release-it": {
-    "git": {
-      "commitMessage": "chore: release ${version}",
-      "tagName": "v${version}"
+    "name": "@one-am/react-native-simple-image-slider",
+    "version": "0.16.0",
+    "description": "A simple and performant image slider made with FlashList. Includes a full screen gallery component with gesture support.",
+    "main": "lib/commonjs/index",
+    "module": "lib/module/index",
+    "types": "lib/typescript/src/index.d.ts",
+    "react-native": "src/index",
+    "source": "src/index",
+    "files": [
+        "src",
+        "lib",
+        "android",
+        "ios",
+        "cpp",
+        "*.podspec",
+        "!ios/build",
+        "!android/build",
+        "!android/gradle",
+        "!android/gradlew",
+        "!android/gradlew.bat",
+        "!android/local.properties",
+        "!**/__tests__",
+        "!**/__fixtures__",
+        "!**/__mocks__",
+        "!**/.*"
+    ],
+    "scripts": {
+        "example": "yarn workspace @one-am/react-native-simple-image-slider-example",
+        "test": "jest",
+        "typecheck": "tsc --noEmit",
+        "lint": "eslint \"**/*.{js,ts,tsx}\"",
+        "clean": "del-cli lib",
+        "prepare": "bob build",
+        "release": "release-it",
+        "sync:deps": "node bin/sync-peer-to-dev.js"
     },
-    "npm": {
-      "publish": true
+    "keywords": [
+        "react-native",
+        "image-slider",
+        "gallery"
+    ],
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/one-am-it/react-native-simple-image-slider.git"
     },
-    "gitlab": {
-      "release": true
+    "author": "one-am <info@oneam.it> (https://github.com/one-am-it)",
+    "license": "MIT",
+    "bugs": {
+        "url": "https://github.com/one-am-it/react-native-simple-image-slider/issues"
     },
-    "plugins": {
-      "@release-it/conventional-changelog": {
-        "preset": "angular"
-      }
-    }
-  },
-  "react-native-builder-bob": {
-    "source": "src",
-    "output": "lib",
-    "targets": [
-      "commonjs",
-      "module",
-      [
-        "typescript",
-        {
-          "project": "tsconfig.build.json"
+    "homepage": "https://github.com/one-am-it/react-native-simple-image-slider#readme",
+    "publishConfig": {
+        "registry": "https://registry.npmjs.org/",
+        "access": "public"
+    },
+    "dependencies": {
+        "merge-refs": "^1.2.2"
+    },
+    "peerDependencies": {
+        "@shopify/flash-list": "<2.0.0",
+        "expo-haptics": "*",
+        "expo-image": "*",
+        "expo-status-bar": "*",
+        "react": "*",
+        "react-native": "*",
+        "react-native-gesture-handler": "*",
+        "react-native-reanimated": "*",
+        "react-native-safe-area-context": "*",
+        "react-native-svg": "*"
+    },
+    "devDependencies": {
+        "@babel/runtime": "^7.27.6",
+        "@commitlint/config-conventional": "^17.0.2",
+        "@evilmartians/lefthook": "^1.5.0",
+        "@react-native/babel-preset": "^0.75.0-main",
+        "@react-native/eslint-config": "^0.73.1",
+        "@release-it/conventional-changelog": "^5.0.0",
+        "@shopify/flash-list": "1.8.2",
+        "@types/jest": "^29.5.5",
+        "@types/react": "^18.2.44",
+        "@typescript-eslint/eslint-plugin": "^5.62.0",
+        "@typescript-eslint/parser": "^5.62.0",
+        "babel-plugin-styled-components": "^2.1.4",
+        "commitlint": "^17.0.2",
+        "del-cli": "^5.1.0",
+        "eslint": "^8.56.0",
+        "eslint-config-prettier": "^9.1.0",
+        "eslint-config-standard-with-typescript": "^37.0.0",
+        "eslint-plugin-ft-flow": "^3.0.7",
+        "eslint-plugin-import": "^2.29.1",
+        "eslint-plugin-n": "^16.6.2",
+        "eslint-plugin-prettier": "^5.0.1",
+        "eslint-plugin-promise": "^6.1.1",
+        "eslint-plugin-react": "^7.33.2",
+        "eslint-plugin-react-hooks": "^4.6.0",
+        "eslint-plugin-react-native": "^4.1.0",
+        "expo-haptics": "~14.1.4",
+        "expo-image": "~2.3.0",
+        "expo-status-bar": "~2.2.3",
+        "expo-system-ui": "~5.0.9",
+        "jest": "^29.7.0",
+        "prettier": "^3.4.2",
+        "react": "19.0.0",
+        "react-dom": "19.0.0",
+        "react-native": "0.79.4",
+        "react-native-builder-bob": "^0.35.2",
+        "react-native-gesture-handler": "~2.24.0",
+        "react-native-reanimated": "~3.17.4",
+        "react-native-safe-area-context": "5.4.0",
+        "react-native-svg": "15.11.2",
+        "react-native-web": "^0.20.0",
+        "release-it": "^15.0.0",
+        "typescript": "^5.4.2",
+        "typescript-plugin-styled-components": "^3.0.0"
+    },
+    "resolutions": {
+        "styled-components": "^6.1.13"
+    },
+    "workspaces": [
+        "example"
+    ],
+    "packageManager": "yarn@3.6.1",
+    "jest": {
+        "preset": "react-native",
+        "modulePathIgnorePatterns": [
+            "<rootDir>/example/node_modules",
+            "<rootDir>/lib/"
+        ]
+    },
+    "commitlint": {
+        "extends": [
+            "@commitlint/config-conventional"
+        ]
+    },
+    "release-it": {
+        "git": {
+            "commitMessage": "chore: release ${version}",
+            "tagName": "v${version}"
+        },
+        "npm": {
+            "publish": true
+        },
+        "gitlab": {
+            "release": true
+        },
+        "plugins": {
+            "@release-it/conventional-changelog": {
+                "preset": "angular"
+            }
         }
-      ]
-    ]
-  }
+    },
+    "react-native-builder-bob": {
+        "source": "src",
+        "output": "lib",
+        "targets": [
+            "commonjs",
+            "module",
+            [
+                "typescript",
+                {
+                    "project": "tsconfig.build.json"
+                }
+            ]
+        ]
+    }
 }

package/src/@types/pinch-to-zoom.ts

@@ -1,9 +1,7 @@
-import type { SharedValue } from 'react-native-reanimated';
-
 export type PinchToZoomStatus = {
-    scale: SharedValue<number>;
+    scale: number;
     translation: {
-        x: SharedValue<number>;
-        y: SharedValue<number>;
+        x: number;
+        y: number;
     };
 };

package/src/AbsoluteComponentContainer.tsx

@@ -0,0 +1,30 @@
+import React, { useMemo } from 'react';
+
+import type { PropsWithChildren } from 'react';
+import { StyleSheet, View } from 'react-native';
+
+export type AbsoluteComponentContainerProps = PropsWithChildren<{
+    position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+}>;
+
+export function AbsoluteComponentContainer({
+    position,
+    children,
+}: AbsoluteComponentContainerProps) {
+    const styles = useMemo(() => makeStyles(position), [position]);
+
+    return <View style={styles.container}>{children}</View>;
+}
+
+const makeStyles = (position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right') => {
+    return StyleSheet.create({
+        container: {
+            zIndex: 1000,
+            position: 'absolute',
+            bottom: position === 'bottom-left' || position === 'bottom-right' ? 16 : 'auto',
+            top: position === 'top-left' || position === 'top-right' ? 16 : 'auto',
+            left: position === 'top-left' || position === 'bottom-left' ? 16 : 'auto',
+            right: position === 'top-right' || position === 'bottom-right' ? 16 : 'auto',
+        },
+    });
+};