@one-am/react-native-simple-image-slider 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +20 -0
- package/README.md +74 -0
- package/lib/commonjs/@types/styled.d.js +4 -0
- package/lib/commonjs/@types/styled.d.js.map +1 -0
- package/lib/commonjs/BaseSimpleImageSlider.js +194 -0
- package/lib/commonjs/BaseSimpleImageSlider.js.map +1 -0
- package/lib/commonjs/FullScreenImageSlider.js +126 -0
- package/lib/commonjs/FullScreenImageSlider.js.map +1 -0
- package/lib/commonjs/PageCounter.js +39 -0
- package/lib/commonjs/PageCounter.js.map +1 -0
- package/lib/commonjs/PinchToZoom.js +173 -0
- package/lib/commonjs/PinchToZoom.js.map +1 -0
- package/lib/commonjs/SimpleImageSlider.js +59 -0
- package/lib/commonjs/SimpleImageSlider.js.map +1 -0
- package/lib/commonjs/StyledComponentsThemeProvider.js +51 -0
- package/lib/commonjs/StyledComponentsThemeProvider.js.map +1 -0
- package/lib/commonjs/index.js +35 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/utils/clamp.js +13 -0
- package/lib/commonjs/utils/clamp.js.map +1 -0
- package/lib/commonjs/utils/renderProp.js +17 -0
- package/lib/commonjs/utils/renderProp.js.map +1 -0
- package/lib/module/@types/styled.d.js +2 -0
- package/lib/module/@types/styled.d.js.map +1 -0
- package/lib/module/BaseSimpleImageSlider.js +185 -0
- package/lib/module/BaseSimpleImageSlider.js.map +1 -0
- package/lib/module/FullScreenImageSlider.js +117 -0
- package/lib/module/FullScreenImageSlider.js.map +1 -0
- package/lib/module/PageCounter.js +31 -0
- package/lib/module/PageCounter.js.map +1 -0
- package/lib/module/PinchToZoom.js +165 -0
- package/lib/module/PinchToZoom.js.map +1 -0
- package/lib/module/SimpleImageSlider.js +50 -0
- package/lib/module/SimpleImageSlider.js.map +1 -0
- package/lib/module/StyledComponentsThemeProvider.js +43 -0
- package/lib/module/StyledComponentsThemeProvider.js.map +1 -0
- package/lib/module/index.js +6 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/utils/clamp.js +6 -0
- package/lib/module/utils/clamp.js.map +1 -0
- package/lib/module/utils/renderProp.js +9 -0
- package/lib/module/utils/renderProp.js.map +1 -0
- package/lib/typescript/src/BaseSimpleImageSlider.d.ts +33 -0
- package/lib/typescript/src/BaseSimpleImageSlider.d.ts.map +1 -0
- package/lib/typescript/src/FullScreenImageSlider.d.ts +15 -0
- package/lib/typescript/src/FullScreenImageSlider.d.ts.map +1 -0
- package/lib/typescript/src/PageCounter.d.ts +10 -0
- package/lib/typescript/src/PageCounter.d.ts.map +1 -0
- package/lib/typescript/src/PinchToZoom.d.ts +18 -0
- package/lib/typescript/src/PinchToZoom.d.ts.map +1 -0
- package/lib/typescript/src/SimpleImageSlider.d.ts +11 -0
- package/lib/typescript/src/SimpleImageSlider.d.ts.map +1 -0
- package/lib/typescript/src/StyledComponentsThemeProvider.d.ts +3 -0
- package/lib/typescript/src/StyledComponentsThemeProvider.d.ts.map +1 -0
- package/lib/typescript/src/index.d.ts +6 -0
- package/lib/typescript/src/index.d.ts.map +1 -0
- package/lib/typescript/src/utils/clamp.d.ts +2 -0
- package/lib/typescript/src/utils/clamp.d.ts.map +1 -0
- package/lib/typescript/src/utils/renderProp.d.ts +4 -0
- package/lib/typescript/src/utils/renderProp.d.ts.map +1 -0
- package/package.json +170 -0
- package/src/@types/styled.d.ts +39 -0
- package/src/BaseSimpleImageSlider.tsx +281 -0
- package/src/FullScreenImageSlider.tsx +164 -0
- package/src/PageCounter.tsx +39 -0
- package/src/PinchToZoom.tsx +323 -0
- package/src/SimpleImageSlider.tsx +72 -0
- package/src/StyledComponentsThemeProvider.tsx +48 -0
- package/src/index.tsx +14 -0
- package/src/utils/clamp.ts +4 -0
- package/src/utils/renderProp.tsx +22 -0
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
import React, { forwardRef, useCallback, useEffect, useMemo, useState } from 'react';
|
|
3
|
+
import { Modal, StyleSheet, useWindowDimensions } from 'react-native';
|
|
4
|
+
import { IconX } from 'tabler-icons-react-native';
|
|
5
|
+
import Animated, { runOnJS, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
|
|
6
|
+
import { setStatusBarStyle } from 'expo-status-bar';
|
|
7
|
+
import styled, { useTheme } from 'styled-components/native';
|
|
8
|
+
import BaseListImageSlider from './BaseSimpleImageSlider';
|
|
9
|
+
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
10
|
+
const StyledDescriptionContainer = styled.View`
|
|
11
|
+
position: absolute;
|
|
12
|
+
border-top-width: 1px;
|
|
13
|
+
border-top-color: ${({
|
|
14
|
+
theme
|
|
15
|
+
}) => theme.colors.descriptionContainerBorder};
|
|
16
|
+
width: 100%;
|
|
17
|
+
padding-top: ${({
|
|
18
|
+
theme
|
|
19
|
+
}) => theme.styles.spacing.l}px;
|
|
20
|
+
`;
|
|
21
|
+
const StyledModalCloseButton = styled.TouchableOpacity`
|
|
22
|
+
position: absolute;
|
|
23
|
+
z-index: 1000;
|
|
24
|
+
`;
|
|
25
|
+
const StyledModalContentContainer = styled(Animated.View)`
|
|
26
|
+
align-items: center;
|
|
27
|
+
justify-content: center;
|
|
28
|
+
gap: ${({
|
|
29
|
+
theme
|
|
30
|
+
}) => theme.styles.spacing.m}px;
|
|
31
|
+
`;
|
|
32
|
+
const FullScreenImageSlider = /*#__PURE__*/forwardRef(function FullScreenImageSlider({
|
|
33
|
+
open,
|
|
34
|
+
onRequestClose,
|
|
35
|
+
renderDescription,
|
|
36
|
+
onViewableItemChange,
|
|
37
|
+
...props
|
|
38
|
+
}, ref) {
|
|
39
|
+
const windowDimensions = useWindowDimensions();
|
|
40
|
+
const theme = useTheme();
|
|
41
|
+
const safeAreaInsets = useSafeAreaInsets();
|
|
42
|
+
const styles = useMemo(() => makeStyles(theme, safeAreaInsets, windowDimensions), [theme, safeAreaInsets, windowDimensions]);
|
|
43
|
+
const [internalIndex, setInternalIndex] = useState(0);
|
|
44
|
+
const internalOnViewableItemChange = useCallback(index => {
|
|
45
|
+
setInternalIndex(index);
|
|
46
|
+
onViewableItemChange === null || onViewableItemChange === void 0 || onViewableItemChange(index);
|
|
47
|
+
}, [onViewableItemChange]);
|
|
48
|
+
useEffect(() => {
|
|
49
|
+
if (open) {
|
|
50
|
+
setStatusBarStyle('light');
|
|
51
|
+
} else {
|
|
52
|
+
setStatusBarStyle('dark');
|
|
53
|
+
}
|
|
54
|
+
}, [open]);
|
|
55
|
+
const backgroundOpacity = useSharedValue(0);
|
|
56
|
+
const modalContentStyle = useAnimatedStyle(() => {
|
|
57
|
+
return {
|
|
58
|
+
backgroundColor: `rgba(0, 0, 0, ${backgroundOpacity.value})`
|
|
59
|
+
};
|
|
60
|
+
}, []);
|
|
61
|
+
const onPinchToZoomTranslationChange = useCallback((x, y, scale) => {
|
|
62
|
+
if (scale.value <= 1) {
|
|
63
|
+
if (x.value === 0 && y.value === 0) {
|
|
64
|
+
runOnJS(setStatusBarStyle)('light');
|
|
65
|
+
backgroundOpacity.value = withTiming(1);
|
|
66
|
+
} else {
|
|
67
|
+
runOnJS(setStatusBarStyle)('dark');
|
|
68
|
+
backgroundOpacity.value = withTiming(0);
|
|
69
|
+
}
|
|
70
|
+
} else {
|
|
71
|
+
backgroundOpacity.value = 1;
|
|
72
|
+
}
|
|
73
|
+
}, [backgroundOpacity]);
|
|
74
|
+
return /*#__PURE__*/React.createElement(Modal, {
|
|
75
|
+
animationType: "fade",
|
|
76
|
+
onRequestClose: onRequestClose,
|
|
77
|
+
transparent: true,
|
|
78
|
+
visible: open
|
|
79
|
+
}, /*#__PURE__*/React.createElement(StyledModalContentContainer, {
|
|
80
|
+
style: [styles.modalContent, modalContentStyle]
|
|
81
|
+
}, /*#__PURE__*/React.createElement(StyledModalCloseButton, {
|
|
82
|
+
style: styles.closeButton,
|
|
83
|
+
onPress: onRequestClose
|
|
84
|
+
}, /*#__PURE__*/React.createElement(IconX, {
|
|
85
|
+
color: theme.colors.fullScreenCloseButton
|
|
86
|
+
})), /*#__PURE__*/React.createElement(BaseListImageSlider, _extends({
|
|
87
|
+
enablePinchToZoom: true,
|
|
88
|
+
onPinchToZoomTranslationChange: onPinchToZoomTranslationChange,
|
|
89
|
+
onPinchToZoomRequestClose: onRequestClose
|
|
90
|
+
}, props, {
|
|
91
|
+
onViewableItemChange: internalOnViewableItemChange,
|
|
92
|
+
showPageCounter: false,
|
|
93
|
+
imageWidth: windowDimensions.width,
|
|
94
|
+
ref: ref
|
|
95
|
+
})), renderDescription ? /*#__PURE__*/React.createElement(StyledDescriptionContainer, {
|
|
96
|
+
style: styles.descriptionContainer
|
|
97
|
+
}, renderDescription(internalIndex)) : null));
|
|
98
|
+
});
|
|
99
|
+
export default FullScreenImageSlider;
|
|
100
|
+
const makeStyles = (theme, safeAreaInsets, windowDimensions) => {
|
|
101
|
+
return StyleSheet.create({
|
|
102
|
+
closeButton: {
|
|
103
|
+
top: safeAreaInsets.top,
|
|
104
|
+
right: safeAreaInsets.right + theme.styles.spacing.l
|
|
105
|
+
},
|
|
106
|
+
modalContent: {
|
|
107
|
+
height: windowDimensions.height,
|
|
108
|
+
width: windowDimensions.width
|
|
109
|
+
},
|
|
110
|
+
descriptionContainer: {
|
|
111
|
+
bottom: safeAreaInsets.bottom + 100,
|
|
112
|
+
paddingLeft: safeAreaInsets.left + theme.styles.spacing.l,
|
|
113
|
+
paddingRight: safeAreaInsets.right + theme.styles.spacing.l
|
|
114
|
+
}
|
|
115
|
+
});
|
|
116
|
+
};
|
|
117
|
+
//# sourceMappingURL=FullScreenImageSlider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","forwardRef","useCallback","useEffect","useMemo","useState","Modal","StyleSheet","useWindowDimensions","IconX","Animated","runOnJS","useAnimatedStyle","useSharedValue","withTiming","setStatusBarStyle","styled","useTheme","BaseListImageSlider","useSafeAreaInsets","StyledDescriptionContainer","View","theme","colors","descriptionContainerBorder","styles","spacing","l","StyledModalCloseButton","TouchableOpacity","StyledModalContentContainer","m","FullScreenImageSlider","open","onRequestClose","renderDescription","onViewableItemChange","props","ref","windowDimensions","safeAreaInsets","makeStyles","internalIndex","setInternalIndex","internalOnViewableItemChange","index","backgroundOpacity","modalContentStyle","backgroundColor","value","onPinchToZoomTranslationChange","x","y","scale","createElement","animationType","transparent","visible","style","modalContent","closeButton","onPress","color","fullScreenCloseButton","_extends","enablePinchToZoom","onPinchToZoomRequestClose","showPageCounter","imageWidth","width","descriptionContainer","create","top","right","height","bottom","paddingLeft","left","paddingRight"],"sourceRoot":"../../src","sources":["FullScreenImageSlider.tsx"],"mappings":";AAAA,OAAOA,KAAK,IACRC,UAAU,EAEVC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,QAAQ,QACL,OAAO;AACd,SAASC,KAAK,EAAmBC,UAAU,EAAEC,mBAAmB,QAAQ,cAAc;AACtF,SAASC,KAAK,QAAQ,2BAA2B;AACjD,OAAOC,QAAQ,IACXC,OAAO,EAEPC,gBAAgB,EAChBC,cAAc,EACdC,UAAU,QACP,yBAAyB;AAChC,SAASC,iBAAiB,QAAQ,iBAAiB;AACnD,OAAOC,MAAM,IAAuBC,QAAQ,QAAQ,0BAA0B;AAE9E,OAAOC,mBAAmB,MAGnB,yBAAyB;AAChC,SAA0BC,iBAAiB,QAAQ,gCAAgC;AAQnF,MAAMC,0BAA0B,GAAGJ,MAAM,CAACK,IAAK;AAC/C;AACA;AACA,wBAAwB,CAAC;EAAEC;AAAM,CAAC,KAAKA,KAAK,CAACC,MAAM,CAACC,0BAA2B;AAC/E;AACA,mBAAmB,CAAC;EAAEF;AAAM,CAAC,KAAKA,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,CAAE;AACzD,CAAC;AAED,MAAMC,sBAAsB,GAAGZ,MAAM,CAACa,gBAAiB;AACvD;AACA;AACA,CAAC;AAED,MAAMC,2BAA2B,GAAGd,MAAM,CAACN,QAAQ,CAACW,IAAI,CAAE;AAC1D;AACA;AACA,WAAW,CAAC;EAAEC;AAAM,CAAC,KAAKA,KAAK,CAACG,MAAM,CAACC,OAAO,CAACK,CAAE;AACjD,CAAC;AAED,MAAMC,qBAAqB,gBAAG/B,UAAU,CAGtC,SAAS+B,qBAAqBA,CAC5B;EAAEC,IAAI;EAAEC,cAAc;EAAEC,iBAAiB;EAAEC,oBAAoB;EAAE,GAAGC;AAAM,CAAC,EAC3EC,GAAG,EACL;EACE,MAAMC,gBAAgB,GAAG/B,mBAAmB,CAAC,CAAC;EAC9C,MAAMc,KAAK,GAAGL,QAAQ,CAAC,CAAC;EACxB,MAAMuB,cAAc,GAAGrB,iBAAiB,CAAC,CAAC;EAC1C,MAAMM,MAAM,GAAGrB,OAAO,CAClB,MAAMqC,UAAU,CAACnB,KAAK,EAAEkB,cAAc,EAAED,gBAAgB,CAAC,EACzD,CAACjB,KAAK,EAAEkB,cAAc,EAAED,gBAAgB,CAC5C,CAAC;EAED,MAAM,CAACG,aAAa,EAAEC,gBAAgB,CAAC,GAAGtC,QAAQ,CAAS,CAAC,CAAC;EAE7D,MAAMuC,4BAA4B,GAAG1C,WAAW,CAC3C2C,KAAa,IAAK;IACfF,gBAAgB,CAACE,KAAK,CAAC;IACvBT,oBAAoB,aAApBA,oBAAoB,eAApBA,oBAAoB,CAAGS,KAAK,CAAC;EACjC,CAAC,EACD,CAACT,oBAAoB,CACzB,CAAC;EAEDjC,SAAS,CAAC,MAAM;IACZ,IAAI8B,IAAI,EAAE;MACNlB,iBAAiB,CAAC,OAAO,CAAC;IAC9B,CAAC,MAAM;MACHA,iBAAiB,CAAC,MAAM,CAAC;IAC7B;EACJ,CAAC,EAAE,CAACkB,IAAI,CAAC,CAAC;EAEV,MAAMa,iBAAiB,GAAGjC,cAAc,CAAC,CAAC,CAAC;EAE3C,MAAMkC,iBAAiB,GAAGnC,gBAAgB,CAAC,MAAM;IAC7C,OAAO;MACHoC,eAAe,EAAG,iBAAgBF,iBAAiB,CAACG,KAAM;IAC9D,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,8BAA8B,GAAGhD,WAAW,CAC9C,CAACiD,CAAsB,EAAEC,CAAsB,EAAEC,KAA0B,KAAK;IAC5E,IAAIA,KAAK,CAACJ,KAAK,IAAI,CAAC,EAAE;MAClB,IAAIE,CAAC,CAACF,KAAK,KAAK,CAAC,IAAIG,CAAC,CAACH,KAAK,KAAK,CAAC,EAAE;QAChCtC,OAAO,CAACI,iBAAiB,CAAC,CAAC,OAAO,CAAC;QACnC+B,iBAAiB,CAACG,KAAK,GAAGnC,UAAU,CAAC,CAAC,CAAC;MAC3C,CAAC,MAAM;QACHH,OAAO,CAACI,iBAAiB,CAAC,CAAC,MAAM,CAAC;QAClC+B,iBAAiB,CAACG,KAAK,GAAGnC,UAAU,CAAC,CAAC,CAAC;MAC3C;IACJ,CAAC,MAAM;MACHgC,iBAAiB,CAACG,KAAK,GAAG,CAAC;IAC/B;EACJ,CAAC,EACD,CAACH,iBAAiB,CACtB,CAAC;EAED,oBACI9C,KAAA,CAAAsD,aAAA,CAAChD,KAAK;IACFiD,aAAa,EAAC,MAAM;IACpBrB,cAAc,EAAEA,cAAe;IAC/BsB,WAAW,EAAE,IAAK;IAClBC,OAAO,EAAExB;EAAK,gBAEdjC,KAAA,CAAAsD,aAAA,CAACxB,2BAA2B;IAAC4B,KAAK,EAAE,CAACjC,MAAM,CAACkC,YAAY,EAAEZ,iBAAiB;EAAE,gBACzE/C,KAAA,CAAAsD,aAAA,CAAC1B,sBAAsB;IAAC8B,KAAK,EAAEjC,MAAM,CAACmC,WAAY;IAACC,OAAO,EAAE3B;EAAe,gBACvElC,KAAA,CAAAsD,aAAA,CAAC7C,KAAK;IAACqD,KAAK,EAAExC,KAAK,CAACC,MAAM,CAACwC;EAAsB,CAAE,CAC/B,CAAC,eACzB/D,KAAA,CAAAsD,aAAA,CAACpC,mBAAmB,EAAA8C,QAAA;IAChBC,iBAAiB,EAAE,IAAK;IACxBf,8BAA8B,EAAEA,8BAA+B;IAC/DgB,yBAAyB,EAAEhC;EAAe,GACtCG,KAAK;IACTD,oBAAoB,EAAEQ,4BAA6B;IACnDuB,eAAe,EAAE,KAAM;IACvBC,UAAU,EAAE7B,gBAAgB,CAAC8B,KAAM;IACnC/B,GAAG,EAAEA;EAAI,EACZ,CAAC,EAEDH,iBAAiB,gBACdnC,KAAA,CAAAsD,aAAA,CAAClC,0BAA0B;IAACsC,KAAK,EAAEjC,MAAM,CAAC6C;EAAqB,GAC1DnC,iBAAiB,CAACO,aAAa,CACR,CAAC,GAC7B,IACqB,CAC1B,CAAC;AAEhB,CAAC,CAAC;AAEF,eAAeV,qBAAqB;AAEpC,MAAMS,UAAU,GAAGA,CACfnB,KAAmB,EACnBkB,cAA0B,EAC1BD,gBAA4B,KAC3B;EACD,OAAOhC,UAAU,CAACgE,MAAM,CAAC;IACrBX,WAAW,EAAE;MACTY,GAAG,EAAEhC,cAAc,CAACgC,GAAG;MACvBC,KAAK,EAAEjC,cAAc,CAACiC,KAAK,GAAGnD,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC;IACvD,CAAC;IACDgC,YAAY,EAAE;MACVe,MAAM,EAAEnC,gBAAgB,CAACmC,MAAM;MAC/BL,KAAK,EAAE9B,gBAAgB,CAAC8B;IAC5B,CAAC;IACDC,oBAAoB,EAAE;MAClBK,MAAM,EAAEnC,cAAc,CAACmC,MAAM,GAAG,GAAG;MACnCC,WAAW,EAAEpC,cAAc,CAACqC,IAAI,GAAGvD,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,CAAC;MACzDmD,YAAY,EAAEtC,cAAc,CAACiC,KAAK,GAAGnD,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC;IAC9D;EACJ,CAAC,CAAC;AACN,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
2
|
+
import { StyleSheet, Text, View } from 'react-native';
|
|
3
|
+
import { useTheme } from 'styled-components/native';
|
|
4
|
+
export default function PageCounter({
|
|
5
|
+
currentPage,
|
|
6
|
+
totalPages,
|
|
7
|
+
style
|
|
8
|
+
}) {
|
|
9
|
+
const theme = useTheme();
|
|
10
|
+
const styles = useMemo(() => makeStyles(theme), [theme]);
|
|
11
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
12
|
+
style: [styles.container, style]
|
|
13
|
+
}, /*#__PURE__*/React.createElement(Text, null, currentPage, " / ", totalPages));
|
|
14
|
+
}
|
|
15
|
+
const makeStyles = theme => {
|
|
16
|
+
return StyleSheet.create({
|
|
17
|
+
container: {
|
|
18
|
+
backgroundColor: theme.colors.pageCounterBackground,
|
|
19
|
+
borderWidth: 1,
|
|
20
|
+
borderColor: theme.colors.pageCounterBorder,
|
|
21
|
+
borderRadius: 8,
|
|
22
|
+
paddingHorizontal: 5,
|
|
23
|
+
paddingVertical: 6,
|
|
24
|
+
width: 75,
|
|
25
|
+
flexDirection: 'row',
|
|
26
|
+
alignItems: 'center',
|
|
27
|
+
justifyContent: 'center'
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=PageCounter.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useMemo","StyleSheet","Text","View","useTheme","PageCounter","currentPage","totalPages","style","theme","styles","makeStyles","createElement","container","create","backgroundColor","colors","pageCounterBackground","borderWidth","borderColor","pageCounterBorder","borderRadius","paddingHorizontal","paddingVertical","width","flexDirection","alignItems","justifyContent"],"sourceRoot":"../../src","sources":["PageCounter.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAAyBC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAwB,cAAc;AACrF,SAA4BC,QAAQ,QAAQ,0BAA0B;AAQtE,eAAe,SAASC,WAAWA,CAAC;EAAEC,WAAW;EAAEC,UAAU;EAAEC;AAAwB,CAAC,EAAE;EACtF,MAAMC,KAAK,GAAGL,QAAQ,CAAC,CAAC;EACxB,MAAMM,MAAM,GAAGV,OAAO,CAAC,MAAMW,UAAU,CAACF,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAExD,oBACIV,KAAA,CAAAa,aAAA,CAACT,IAAI;IAACK,KAAK,EAAE,CAACE,MAAM,CAACG,SAAS,EAAEL,KAAK;EAAE,gBACnCT,KAAA,CAAAa,aAAA,CAACV,IAAI,QACAI,WAAW,EAAC,KAAG,EAACC,UACf,CACJ,CAAC;AAEf;AAEA,MAAMI,UAAU,GAAIF,KAAmB,IAAK;EACxC,OAAOR,UAAU,CAACa,MAAM,CAAC;IACrBD,SAAS,EAAE;MACPE,eAAe,EAAEN,KAAK,CAACO,MAAM,CAACC,qBAAqB;MACnDC,WAAW,EAAE,CAAC;MACdC,WAAW,EAAEV,KAAK,CAACO,MAAM,CAACI,iBAAiB;MAC3CC,YAAY,EAAE,CAAC;MACfC,iBAAiB,EAAE,CAAC;MACpBC,eAAe,EAAE,CAAC;MAClBC,KAAK,EAAE,EAAE;MACTC,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE;IACpB;EACJ,CAAC,CAAC;AACN,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
import React, { useCallback, useMemo } from 'react';
|
|
2
|
+
import { useWindowDimensions } from 'react-native';
|
|
3
|
+
import Animated, { cancelAnimation, runOnJS, useAnimatedReaction, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
|
|
4
|
+
import { Gesture, GestureDetector } from 'react-native-gesture-handler';
|
|
5
|
+
import { clamp } from './utils/clamp';
|
|
6
|
+
import * as Haptics from 'expo-haptics';
|
|
7
|
+
export default function PinchToZoom({
|
|
8
|
+
minimumZoomScale = 1,
|
|
9
|
+
maximumZoomScale = 8,
|
|
10
|
+
style: propStyle,
|
|
11
|
+
onPinchStart,
|
|
12
|
+
onPinchEnd,
|
|
13
|
+
disabled,
|
|
14
|
+
onLayout,
|
|
15
|
+
onTranslationChange,
|
|
16
|
+
onScaleChange,
|
|
17
|
+
onScaleReset,
|
|
18
|
+
children,
|
|
19
|
+
onRequestClose
|
|
20
|
+
}) {
|
|
21
|
+
const {
|
|
22
|
+
height: windowHeight
|
|
23
|
+
} = useWindowDimensions();
|
|
24
|
+
const translationX = useSharedValue(0);
|
|
25
|
+
const translationY = useSharedValue(0);
|
|
26
|
+
const originX = useSharedValue(0);
|
|
27
|
+
const originY = useSharedValue(0);
|
|
28
|
+
const scale = useSharedValue(1);
|
|
29
|
+
const isPinching = useSharedValue(false);
|
|
30
|
+
const viewHeight = useSharedValue(0);
|
|
31
|
+
const viewWidth = useSharedValue(0);
|
|
32
|
+
const prevScale = useSharedValue(0);
|
|
33
|
+
const offsetScale = useSharedValue(0);
|
|
34
|
+
const prevTranslationX = useSharedValue(0);
|
|
35
|
+
const prevTranslationY = useSharedValue(0);
|
|
36
|
+
const pinchGesture = useMemo(() => Gesture.Pinch().enabled(!disabled).onStart(() => {
|
|
37
|
+
cancelAnimation(translationX);
|
|
38
|
+
cancelAnimation(translationY);
|
|
39
|
+
cancelAnimation(scale);
|
|
40
|
+
prevScale.value = scale.value;
|
|
41
|
+
offsetScale.value = scale.value;
|
|
42
|
+
if (onPinchStart) runOnJS(onPinchStart)();
|
|
43
|
+
if (onScaleChange) runOnJS(onScaleChange)();
|
|
44
|
+
}).onUpdate(e => {
|
|
45
|
+
if (e.numberOfPointers === 2) {
|
|
46
|
+
scale.value = Math.min(prevScale.value * e.scale, maximumZoomScale);
|
|
47
|
+
|
|
48
|
+
// reset the origin
|
|
49
|
+
if (!isPinching.value) {
|
|
50
|
+
isPinching.value = true;
|
|
51
|
+
originX.value = e.focalX;
|
|
52
|
+
originY.value = e.focalY;
|
|
53
|
+
prevTranslationX.value = translationX.value;
|
|
54
|
+
prevTranslationY.value = translationY.value;
|
|
55
|
+
offsetScale.value = scale.value;
|
|
56
|
+
}
|
|
57
|
+
if (isPinching.value) {
|
|
58
|
+
// translate the image to the focal point as we're zooming
|
|
59
|
+
translationX.value = clamp(prevTranslationX.value + -1 * ((scale.value - offsetScale.value) * (originX.value - viewWidth.value / 2)), -viewWidth.value * (scale.value - minimumZoomScale) / 2, viewWidth.value * (scale.value - minimumZoomScale) / 2);
|
|
60
|
+
translationY.value = clamp(prevTranslationY.value + -1 * ((scale.value - offsetScale.value) * (originY.value - viewHeight.value / 2)), -viewHeight.value * (scale.value - minimumZoomScale) / 2, viewHeight.value * (scale.value - minimumZoomScale) / 2);
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
}).onEnd(() => {
|
|
64
|
+
isPinching.value = false;
|
|
65
|
+
if (scale.value < minimumZoomScale / 2 && prevScale.value <= minimumZoomScale) {
|
|
66
|
+
if (onRequestClose) {
|
|
67
|
+
runOnJS(onRequestClose)();
|
|
68
|
+
}
|
|
69
|
+
} else if (scale.value < minimumZoomScale) {
|
|
70
|
+
runOnJS(Haptics.impactAsync)(Haptics.ImpactFeedbackStyle.Light);
|
|
71
|
+
translationX.value = withTiming(0);
|
|
72
|
+
translationY.value = withTiming(0);
|
|
73
|
+
scale.value = withTiming(minimumZoomScale);
|
|
74
|
+
if (onScaleReset) {
|
|
75
|
+
runOnJS(onScaleReset)();
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
prevScale.value = 0;
|
|
79
|
+
prevTranslationX.value = translationX.value;
|
|
80
|
+
prevTranslationY.value = translationY.value;
|
|
81
|
+
if (onPinchEnd) runOnJS(onPinchEnd)();
|
|
82
|
+
}), [disabled, translationX, translationY, scale, prevScale, offsetScale, onPinchStart, onScaleChange, maximumZoomScale, isPinching, originX, originY, prevTranslationX, prevTranslationY, viewWidth.value, viewHeight.value, minimumZoomScale, onPinchEnd, onRequestClose, onScaleReset]);
|
|
83
|
+
const panGesture = useMemo(() => Gesture.Pan().enabled(!disabled).onStart(() => {
|
|
84
|
+
cancelAnimation(translationX);
|
|
85
|
+
cancelAnimation(translationY);
|
|
86
|
+
prevTranslationX.value = translationX.value;
|
|
87
|
+
prevTranslationY.value = translationY.value;
|
|
88
|
+
}).onUpdate(e => {
|
|
89
|
+
if (prevScale.value <= minimumZoomScale) {
|
|
90
|
+
translationX.value = prevTranslationX.value + e.translationX;
|
|
91
|
+
translationY.value = prevTranslationY.value + e.translationY;
|
|
92
|
+
} else {
|
|
93
|
+
translationX.value = clamp(prevTranslationX.value + e.translationX, -viewWidth.value * (scale.value - minimumZoomScale) / 2, viewWidth.value * (scale.value - minimumZoomScale) / 2);
|
|
94
|
+
translationY.value = clamp(prevTranslationY.value + e.translationY, -viewHeight.value * (scale.value - minimumZoomScale) / 2, viewHeight.value * (scale.value - minimumZoomScale) / 2);
|
|
95
|
+
}
|
|
96
|
+
}).onEnd(() => {
|
|
97
|
+
if (scale.value <= minimumZoomScale && prevScale.value <= minimumZoomScale) {
|
|
98
|
+
if (Math.abs(translationX.value) > viewWidth.value / 2 || Math.abs(translationY.value) > viewHeight.value / 2) {
|
|
99
|
+
if (onRequestClose) {
|
|
100
|
+
runOnJS(onRequestClose)();
|
|
101
|
+
}
|
|
102
|
+
} else {
|
|
103
|
+
runOnJS(Haptics.impactAsync)(Haptics.ImpactFeedbackStyle.Light);
|
|
104
|
+
translationX.value = withTiming(0);
|
|
105
|
+
translationY.value = withTiming(0);
|
|
106
|
+
}
|
|
107
|
+
} else if (viewHeight.value * (scale.value - minimumZoomScale) <= windowHeight) {
|
|
108
|
+
translationX.value = withTiming(clamp(translationX.value, -viewWidth.value * (scale.value - minimumZoomScale) / 2, viewWidth.value * (scale.value - minimumZoomScale) / 2));
|
|
109
|
+
translationY.value = withTiming(clamp(translationY.value, -viewHeight.value * (scale.value - minimumZoomScale) / 2, viewHeight.value * (scale.value - minimumZoomScale) / 2));
|
|
110
|
+
}
|
|
111
|
+
}), [disabled, minimumZoomScale, onRequestClose, prevScale.value, prevTranslationX, prevTranslationY, scale.value, windowHeight, translationX, translationY, viewHeight.value, viewWidth.value]);
|
|
112
|
+
const tapGesture = useMemo(() => Gesture.Tap().enabled(!disabled).numberOfTaps(2).onStart(() => {
|
|
113
|
+
if (scale.value > minimumZoomScale) {
|
|
114
|
+
translationX.value = withTiming(0);
|
|
115
|
+
translationY.value = withTiming(0);
|
|
116
|
+
scale.value = withTiming(minimumZoomScale);
|
|
117
|
+
if (onScaleReset) {
|
|
118
|
+
runOnJS(onScaleReset)();
|
|
119
|
+
}
|
|
120
|
+
} else {
|
|
121
|
+
scale.value = withTiming(maximumZoomScale / 2);
|
|
122
|
+
if (onScaleChange) {
|
|
123
|
+
runOnJS(onScaleChange)();
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
}), [disabled, maximumZoomScale, minimumZoomScale, onScaleChange, onScaleReset, scale, translationX, translationY]);
|
|
127
|
+
const compositeGesture = useMemo(() => {
|
|
128
|
+
return Gesture.Exclusive(Gesture.Simultaneous(pinchGesture, panGesture), tapGesture);
|
|
129
|
+
}, [panGesture, pinchGesture, tapGesture]);
|
|
130
|
+
useAnimatedReaction(() => {
|
|
131
|
+
return {
|
|
132
|
+
scale: scale.value,
|
|
133
|
+
translationX: translationX.value,
|
|
134
|
+
translationY: translationY.value
|
|
135
|
+
};
|
|
136
|
+
}, () => {
|
|
137
|
+
if (onTranslationChange) {
|
|
138
|
+
runOnJS(onTranslationChange)(translationX, translationY, scale);
|
|
139
|
+
}
|
|
140
|
+
}, [onTranslationChange]);
|
|
141
|
+
const style = useAnimatedStyle(() => {
|
|
142
|
+
return {
|
|
143
|
+
transform: [{
|
|
144
|
+
translateX: translationX.value
|
|
145
|
+
}, {
|
|
146
|
+
translateY: translationY.value
|
|
147
|
+
}, {
|
|
148
|
+
scale: scale.value
|
|
149
|
+
}]
|
|
150
|
+
};
|
|
151
|
+
}, []);
|
|
152
|
+
const internalOnLayout = useCallback(e => {
|
|
153
|
+
viewHeight.value = e.nativeEvent.layout.height;
|
|
154
|
+
viewWidth.value = e.nativeEvent.layout.width;
|
|
155
|
+
onLayout === null || onLayout === void 0 || onLayout(e);
|
|
156
|
+
}, [viewHeight, viewWidth, onLayout]);
|
|
157
|
+
const finalStyle = useMemo(() => [style, propStyle], [style, propStyle]);
|
|
158
|
+
return /*#__PURE__*/React.createElement(GestureDetector, {
|
|
159
|
+
gesture: compositeGesture
|
|
160
|
+
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
161
|
+
onLayout: internalOnLayout,
|
|
162
|
+
style: finalStyle
|
|
163
|
+
}, children));
|
|
164
|
+
}
|
|
165
|
+
//# sourceMappingURL=PinchToZoom.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useCallback","useMemo","useWindowDimensions","Animated","cancelAnimation","runOnJS","useAnimatedReaction","useAnimatedStyle","useSharedValue","withTiming","Gesture","GestureDetector","clamp","Haptics","PinchToZoom","minimumZoomScale","maximumZoomScale","style","propStyle","onPinchStart","onPinchEnd","disabled","onLayout","onTranslationChange","onScaleChange","onScaleReset","children","onRequestClose","height","windowHeight","translationX","translationY","originX","originY","scale","isPinching","viewHeight","viewWidth","prevScale","offsetScale","prevTranslationX","prevTranslationY","pinchGesture","Pinch","enabled","onStart","value","onUpdate","e","numberOfPointers","Math","min","focalX","focalY","onEnd","impactAsync","ImpactFeedbackStyle","Light","panGesture","Pan","abs","tapGesture","Tap","numberOfTaps","compositeGesture","Exclusive","Simultaneous","transform","translateX","translateY","internalOnLayout","nativeEvent","layout","width","finalStyle","createElement","gesture","View"],"sourceRoot":"../../src","sources":["PinchToZoom.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
import React, { forwardRef, useCallback, useRef, useState } from 'react';
|
|
3
|
+
import mergeRefs from 'merge-refs';
|
|
4
|
+
import FullScreenImageSlider from './FullScreenImageSlider';
|
|
5
|
+
import BaseListImageSlider from './BaseSimpleImageSlider';
|
|
6
|
+
const SimpleImageSlider = /*#__PURE__*/forwardRef(function ListImageSlider({
|
|
7
|
+
data,
|
|
8
|
+
fullScreenEnabled = false,
|
|
9
|
+
onItemPress,
|
|
10
|
+
onViewableItemChange,
|
|
11
|
+
...props
|
|
12
|
+
}, ref) {
|
|
13
|
+
const listRef = useRef(null);
|
|
14
|
+
const fullScreenListRef = useRef(null);
|
|
15
|
+
const [fullScreen, setFullScreen] = useState(false);
|
|
16
|
+
const [currentIndex, setCurrentIndex] = useState(0);
|
|
17
|
+
const internalOnViewableItemChange = useCallback(index => {
|
|
18
|
+
setCurrentIndex(index);
|
|
19
|
+
onViewableItemChange === null || onViewableItemChange === void 0 || onViewableItemChange(index);
|
|
20
|
+
}, [onViewableItemChange]);
|
|
21
|
+
const onFullScreenViewableItemChange = useCallback(index => {
|
|
22
|
+
setCurrentIndex(index);
|
|
23
|
+
}, []);
|
|
24
|
+
const openFullScreen = useCallback(() => {
|
|
25
|
+
setFullScreen(true);
|
|
26
|
+
}, []);
|
|
27
|
+
const onRequestClose = useCallback(() => {
|
|
28
|
+
var _listRef$current;
|
|
29
|
+
(_listRef$current = listRef.current) === null || _listRef$current === void 0 || _listRef$current.scrollToIndex({
|
|
30
|
+
index: currentIndex
|
|
31
|
+
});
|
|
32
|
+
setFullScreen(false);
|
|
33
|
+
}, [currentIndex]);
|
|
34
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(BaseListImageSlider, _extends({}, props, {
|
|
35
|
+
data: data,
|
|
36
|
+
ref: mergeRefs(ref, listRef),
|
|
37
|
+
onItemPress: onItemPress ?? openFullScreen,
|
|
38
|
+
onViewableItemChange: internalOnViewableItemChange
|
|
39
|
+
})), fullScreenEnabled ? /*#__PURE__*/React.createElement(FullScreenImageSlider, _extends({}, props, {
|
|
40
|
+
ref: fullScreenListRef,
|
|
41
|
+
open: fullScreen,
|
|
42
|
+
onRequestClose: onRequestClose,
|
|
43
|
+
data: data,
|
|
44
|
+
showPageCounter: false,
|
|
45
|
+
indexOverride: currentIndex,
|
|
46
|
+
onViewableItemChange: onFullScreenViewableItemChange
|
|
47
|
+
})) : null);
|
|
48
|
+
});
|
|
49
|
+
export default SimpleImageSlider;
|
|
50
|
+
//# sourceMappingURL=SimpleImageSlider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","forwardRef","useCallback","useRef","useState","mergeRefs","FullScreenImageSlider","BaseListImageSlider","SimpleImageSlider","ListImageSlider","data","fullScreenEnabled","onItemPress","onViewableItemChange","props","ref","listRef","fullScreenListRef","fullScreen","setFullScreen","currentIndex","setCurrentIndex","internalOnViewableItemChange","index","onFullScreenViewableItemChange","openFullScreen","onRequestClose","_listRef$current","current","scrollToIndex","createElement","Fragment","_extends","open","showPageCounter","indexOverride"],"sourceRoot":"../../src","sources":["SimpleImageSlider.tsx"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,WAAW,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAExE,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,qBAAqB,MAAM,yBAAyB;AAC3D,OAAOC,mBAAmB,MAGnB,yBAAyB;AAMhC,MAAMC,iBAAiB,gBAAGP,UAAU,CAChC,SAASQ,eAAeA,CACpB;EAAEC,IAAI;EAAEC,iBAAiB,GAAG,KAAK;EAAEC,WAAW;EAAEC,oBAAoB;EAAE,GAAGC;AAAM,CAAC,EAChFC,GAAG,EACL;EACE,MAAMC,OAAO,GAAGb,MAAM,CAAmC,IAAI,CAAC;EAC9D,MAAMc,iBAAiB,GAAGd,MAAM,CAAmC,IAAI,CAAC;EAExE,MAAM,CAACe,UAAU,EAAEC,aAAa,CAAC,GAAGf,QAAQ,CAAC,KAAK,CAAC;EACnD,MAAM,CAACgB,YAAY,EAAEC,eAAe,CAAC,GAAGjB,QAAQ,CAAC,CAAC,CAAC;EAEnD,MAAMkB,4BAA4B,GAAGpB,WAAW,CAC3CqB,KAAa,IAAK;IACfF,eAAe,CAACE,KAAK,CAAC;IACtBV,oBAAoB,aAApBA,oBAAoB,eAApBA,oBAAoB,CAAGU,KAAK,CAAC;EACjC,CAAC,EACD,CAACV,oBAAoB,CACzB,CAAC;EAED,MAAMW,8BAA8B,GAAGtB,WAAW,CAAEqB,KAAa,IAAK;IAClEF,eAAe,CAACE,KAAK,CAAC;EAC1B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAME,cAAc,GAAGvB,WAAW,CAAC,MAAM;IACrCiB,aAAa,CAAC,IAAI,CAAC;EACvB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMO,cAAc,GAAGxB,WAAW,CAAC,MAAM;IAAA,IAAAyB,gBAAA;IACrC,CAAAA,gBAAA,GAAAX,OAAO,CAACY,OAAO,cAAAD,gBAAA,eAAfA,gBAAA,CAAiBE,aAAa,CAAC;MAAEN,KAAK,EAAEH;IAAa,CAAC,CAAC;IACvDD,aAAa,CAAC,KAAK,CAAC;EACxB,CAAC,EAAE,CAACC,YAAY,CAAC,CAAC;EAElB,oBACIpB,KAAA,CAAA8B,aAAA,CAAA9B,KAAA,CAAA+B,QAAA,qBACI/B,KAAA,CAAA8B,aAAA,CAACvB,mBAAmB,EAAAyB,QAAA,KACZlB,KAAK;IACTJ,IAAI,EAAEA,IAAK;IACXK,GAAG,EAAEV,SAAS,CAACU,GAAG,EAAEC,OAAO,CAAE;IAC7BJ,WAAW,EAAEA,WAAW,IAAIa,cAAe;IAC3CZ,oBAAoB,EAAES;EAA6B,EACtD,CAAC,EACDX,iBAAiB,gBACdX,KAAA,CAAA8B,aAAA,CAACxB,qBAAqB,EAAA0B,QAAA,KACdlB,KAAK;IACTC,GAAG,EAAEE,iBAAkB;IACvBgB,IAAI,EAAEf,UAAW;IACjBQ,cAAc,EAAEA,cAAe;IAC/BhB,IAAI,EAAEA,IAAK;IACXwB,eAAe,EAAE,KAAM;IACvBC,aAAa,EAAEf,YAAa;IAC5BP,oBAAoB,EAAEW;EAA+B,EACxD,CAAC,GACF,IACN,CAAC;AAEX,CACJ,CAAC;AAED,eAAehB,iBAAiB","ignoreList":[]}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
2
|
+
import { ThemeProvider } from 'styled-components/native';
|
|
3
|
+
export default function StyledComponentsThemeProvider({
|
|
4
|
+
children
|
|
5
|
+
}) {
|
|
6
|
+
const styles = useMemo(() => ({
|
|
7
|
+
spacing: {
|
|
8
|
+
xxs: 2,
|
|
9
|
+
xs: 4,
|
|
10
|
+
s: 8,
|
|
11
|
+
m: 16,
|
|
12
|
+
l: 20,
|
|
13
|
+
xl: 40
|
|
14
|
+
},
|
|
15
|
+
borderRadius: {
|
|
16
|
+
xs: 2,
|
|
17
|
+
s: 4,
|
|
18
|
+
m: 8,
|
|
19
|
+
l: 16,
|
|
20
|
+
xl: 24
|
|
21
|
+
},
|
|
22
|
+
borderWidth: {
|
|
23
|
+
xs: 1,
|
|
24
|
+
s: 2,
|
|
25
|
+
m: 4,
|
|
26
|
+
l: 8,
|
|
27
|
+
xl: 16
|
|
28
|
+
}
|
|
29
|
+
}), []);
|
|
30
|
+
const theme = useMemo(() => ({
|
|
31
|
+
colors: {
|
|
32
|
+
pageCounterBackground: '#D3D3D3',
|
|
33
|
+
pageCounterBorder: '#000000',
|
|
34
|
+
fullScreenCloseButton: '#FFFFFF',
|
|
35
|
+
descriptionContainerBorder: '#FFFFFF'
|
|
36
|
+
},
|
|
37
|
+
styles
|
|
38
|
+
}), [styles]);
|
|
39
|
+
return /*#__PURE__*/React.createElement(ThemeProvider, {
|
|
40
|
+
theme: theme
|
|
41
|
+
}, children);
|
|
42
|
+
}
|
|
43
|
+
//# sourceMappingURL=StyledComponentsThemeProvider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useMemo","ThemeProvider","StyledComponentsThemeProvider","children","styles","spacing","xxs","xs","s","m","l","xl","borderRadius","borderWidth","theme","colors","pageCounterBackground","pageCounterBorder","fullScreenCloseButton","descriptionContainerBorder","createElement"],"sourceRoot":"../../src","sources":["StyledComponentsThemeProvider.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAA4BC,OAAO,QAAQ,OAAO;AAC9D,SAA4BC,aAAa,QAAQ,0BAA0B;AAE3E,eAAe,SAASC,6BAA6BA,CAAC;EAAEC;AAA4B,CAAC,EAAE;EACnF,MAAMC,MAAM,GAAGJ,OAAO,CAClB,OAAO;IACHK,OAAO,EAAE;MACLC,GAAG,EAAE,CAAC;MACNC,EAAE,EAAE,CAAC;MACLC,CAAC,EAAE,CAAC;MACJC,CAAC,EAAE,EAAE;MACLC,CAAC,EAAE,EAAE;MACLC,EAAE,EAAE;IACR,CAAC;IACDC,YAAY,EAAE;MACVL,EAAE,EAAE,CAAC;MACLC,CAAC,EAAE,CAAC;MACJC,CAAC,EAAE,CAAC;MACJC,CAAC,EAAE,EAAE;MACLC,EAAE,EAAE;IACR,CAAC;IACDE,WAAW,EAAE;MACTN,EAAE,EAAE,CAAC;MACLC,CAAC,EAAE,CAAC;MACJC,CAAC,EAAE,CAAC;MACJC,CAAC,EAAE,CAAC;MACJC,EAAE,EAAE;IACR;EACJ,CAAC,CAAC,EAEF,EACJ,CAAC;EAED,MAAMG,KAAmB,GAAGd,OAAO,CAC/B,OAAO;IACHe,MAAM,EAAE;MACJC,qBAAqB,EAAE,SAAS;MAChCC,iBAAiB,EAAE,SAAS;MAC5BC,qBAAqB,EAAE,SAAS;MAChCC,0BAA0B,EAAE;IAChC,CAAC;IACDf;EACJ,CAAC,CAAC,EACF,CAACA,MAAM,CACX,CAAC;EAED,oBAAOL,KAAA,CAAAqB,aAAA,CAACnB,aAAa;IAACa,KAAK,EAAEA;EAAM,GAAEX,QAAwB,CAAC;AAClE","ignoreList":[]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import StyledComponentsThemeProvider from './StyledComponentsThemeProvider';
|
|
2
|
+
import BaseListImageSlider from './BaseSimpleImageSlider';
|
|
3
|
+
import SimpleImageSlider from './SimpleImageSlider';
|
|
4
|
+
import FullScreenImageSlider from './FullScreenImageSlider';
|
|
5
|
+
export { StyledComponentsThemeProvider as SimpleImageSliderThemeProvider, BaseListImageSlider, SimpleImageSlider, FullScreenImageSlider };
|
|
6
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["StyledComponentsThemeProvider","BaseListImageSlider","SimpleImageSlider","FullScreenImageSlider","SimpleImageSliderThemeProvider"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"AAAA,OAAOA,6BAA6B,MAAM,iCAAiC;AAC3E,OAAOC,mBAAmB,MAA2C,yBAAyB;AAC9F,OAAOC,iBAAiB,MAAuC,qBAAqB;AACpF,OAAOC,qBAAqB,MAA2C,yBAAyB;AAEhG,SACIH,6BAA6B,IAAII,8BAA8B,EAC/DH,mBAAmB,EAEnBC,iBAAiB,EAEjBC,qBAAqB","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["clamp","value","min","max","Math"],"sourceRoot":"../../../src","sources":["utils/clamp.ts"],"mappings":"AAAA,OAAO,MAAMA,KAAK,GAAGA,CAACC,KAAa,EAAEC,GAAW,EAAEC,GAAW,KAAK;EAC9D,SAAS;;EACT,OAAOC,IAAI,CAACF,GAAG,CAACE,IAAI,CAACD,GAAG,CAACF,KAAK,EAAEC,GAAG,CAAC,EAAEC,GAAG,CAAC;AAC9C,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React, { isValidElement } from 'react';
|
|
2
|
+
export default function renderProp(Component) {
|
|
3
|
+
return Component ? typeof Component === 'string' ? Component : /*#__PURE__*/isValidElement(Component) ? Component :
|
|
4
|
+
/*#__PURE__*/
|
|
5
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
6
|
+
// @ts-ignore
|
|
7
|
+
React.createElement(Component, null) : null;
|
|
8
|
+
}
|
|
9
|
+
//# sourceMappingURL=renderProp.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","isValidElement","renderProp","Component","createElement"],"sourceRoot":"../../../src","sources":["utils/renderProp.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,cAAc,QAAQ,OAAO;AAS7C,eAAe,SAASC,UAAUA,CAACC,SAAqB,EAAE;EACtD,OAAOA,SAAS,GACZ,OAAOA,SAAS,KAAK,QAAQ,GACzBA,SAAS,GACT,aAAAF,cAAc,CAACE,SAAS,CAAC,GACzBA,SAAS;EAAA;EAET;EACA;EACAH,KAAA,CAAAI,aAAA,CAACD,SAAS,MAAE,CACf,GACD,IAAI;AACZ","ignoreList":[]}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import React, { type ReactElement } from 'react';
|
|
2
|
+
import { FlashList } from '@shopify/flash-list';
|
|
3
|
+
import { type ImageProps } from 'expo-image';
|
|
4
|
+
import { type StyleProp, type ViewStyle } from 'react-native';
|
|
5
|
+
import { type SharedValue } from 'react-native-reanimated';
|
|
6
|
+
import { type RenderProp } from './utils/renderProp';
|
|
7
|
+
export type SimpleImageSliderItem = ImageProps & {
|
|
8
|
+
key: string;
|
|
9
|
+
};
|
|
10
|
+
export type BaseSimpleImageSliderProps = {
|
|
11
|
+
data: SimpleImageSliderItem[] | undefined;
|
|
12
|
+
style?: StyleProp<ViewStyle>;
|
|
13
|
+
imageWidth?: number;
|
|
14
|
+
imageHeight?: number;
|
|
15
|
+
imageAspectRatio?: number;
|
|
16
|
+
onItemPress?: (item: SimpleImageSliderItem, index: number) => void;
|
|
17
|
+
maxPreviewItems?: number;
|
|
18
|
+
showPageCounter?: boolean;
|
|
19
|
+
pageCounterPosition?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
|
|
20
|
+
renderPageCounter?: (currentPage: number, totalPages: number) => ReactElement;
|
|
21
|
+
TopRightComponent?: RenderProp;
|
|
22
|
+
TopLeftComponent?: RenderProp;
|
|
23
|
+
BottomRightComponent?: RenderProp;
|
|
24
|
+
BottomLeftComponent?: RenderProp;
|
|
25
|
+
indexOverride?: number;
|
|
26
|
+
onViewableItemChange?: (index: number) => void;
|
|
27
|
+
enablePinchToZoom?: boolean;
|
|
28
|
+
onPinchToZoomTranslationChange?: (x: SharedValue<number>, y: SharedValue<number>, scale: SharedValue<number>) => void;
|
|
29
|
+
onPinchToZoomRequestClose?: () => void;
|
|
30
|
+
};
|
|
31
|
+
declare const BaseListImageSlider: React.ForwardRefExoticComponent<BaseSimpleImageSliderProps & React.RefAttributes<FlashList<SimpleImageSliderItem>>>;
|
|
32
|
+
export default BaseListImageSlider;
|
|
33
|
+
//# sourceMappingURL=BaseSimpleImageSlider.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BaseSimpleImageSlider.d.ts","sourceRoot":"","sources":["../../../src/BaseSimpleImageSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEV,KAAK,YAAY,EAMpB,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,SAAS,EAA2B,MAAM,qBAAqB,CAAC;AAEzE,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AACpD,OAAO,EAAa,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAKzE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,OAAmB,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAEjE,MAAM,MAAM,qBAAqB,GAAG,UAAU,GAAG;IAC7C,GAAG,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACrC,IAAI,EAAE,qBAAqB,EAAE,GAAG,SAAS,CAAC;IAC1C,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,qBAAqB,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnE,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,mBAAmB,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,CAAC;IAChF,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,YAAY,CAAC;IAC9E,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC/B,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B,oBAAoB,CAAC,EAAE,UAAU,CAAC;IAClC,mBAAmB,CAAC,EAAE,UAAU,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,8BAA8B,CAAC,EAAE,CAC7B,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,EACtB,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,EACtB,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,KACzB,IAAI,CAAC;IACV,yBAAyB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1C,CAAC;AAqEF,QAAA,MAAM,mBAAmB,qHAgKvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React, { type ReactNode } from 'react';
|
|
2
|
+
import { FlashList } from '@shopify/flash-list';
|
|
3
|
+
import { type BaseSimpleImageSliderProps, type SimpleImageSliderItem } from './BaseSimpleImageSlider';
|
|
4
|
+
export type FullScreenImageSliderProps = BaseSimpleImageSliderProps & {
|
|
5
|
+
open?: boolean;
|
|
6
|
+
onRequestClose?: () => void;
|
|
7
|
+
renderDescription?: (index: number) => ReactNode;
|
|
8
|
+
};
|
|
9
|
+
declare const FullScreenImageSlider: React.ForwardRefExoticComponent<BaseSimpleImageSliderProps & {
|
|
10
|
+
open?: boolean | undefined;
|
|
11
|
+
onRequestClose?: (() => void) | undefined;
|
|
12
|
+
renderDescription?: ((index: number) => ReactNode) | undefined;
|
|
13
|
+
} & React.RefAttributes<FlashList<SimpleImageSliderItem>>>;
|
|
14
|
+
export default FullScreenImageSlider;
|
|
15
|
+
//# sourceMappingURL=FullScreenImageSlider.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FullScreenImageSlider.d.ts","sourceRoot":"","sources":["../../../src/FullScreenImageSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEV,KAAK,SAAS,EAKjB,MAAM,OAAO,CAAC;AAYf,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAA4B,EACxB,KAAK,0BAA0B,EAC/B,KAAK,qBAAqB,EAC7B,MAAM,yBAAyB,CAAC;AAGjC,MAAM,MAAM,0BAA0B,GAAG,0BAA0B,GAAG;IAClE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;CACpD,CAAC;AAqBF,QAAA,MAAM,qBAAqB;;4BAvBA,IAAI;iCACC,MAAM,KAAK,SAAS;0DA8GlD,CAAC;AAEH,eAAe,qBAAqB,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { type StyleProp, type ViewStyle } from 'react-native';
|
|
3
|
+
type PageCounterProps = {
|
|
4
|
+
currentPage: number;
|
|
5
|
+
totalPages: number;
|
|
6
|
+
style?: StyleProp<ViewStyle>;
|
|
7
|
+
};
|
|
8
|
+
export default function PageCounter({ currentPage, totalPages, style }: PageCounterProps): React.JSX.Element;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=PageCounter.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PageCounter.d.ts","sourceRoot":"","sources":["../../../src/PageCounter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,KAAK,SAAS,EAA0B,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAGtF,KAAK,gBAAgB,GAAG;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAChC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,gBAAgB,qBAWvF"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { type PropsWithChildren } from 'react';
|
|
2
|
+
import { type LayoutChangeEvent, type StyleProp, type ViewStyle } from 'react-native';
|
|
3
|
+
import { type SharedValue } from 'react-native-reanimated';
|
|
4
|
+
export type PinchToZoomProps = PropsWithChildren<{
|
|
5
|
+
minimumZoomScale?: number;
|
|
6
|
+
maximumZoomScale?: number;
|
|
7
|
+
style?: StyleProp<ViewStyle>;
|
|
8
|
+
onPinchStart?: () => void;
|
|
9
|
+
onPinchEnd?: () => void;
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
onLayout?: (e: LayoutChangeEvent) => void;
|
|
12
|
+
onScaleChange?: () => void;
|
|
13
|
+
onScaleReset?: () => void;
|
|
14
|
+
onTranslationChange?: (x: SharedValue<number>, y: SharedValue<number>, scale: SharedValue<number>) => void;
|
|
15
|
+
onRequestClose?: () => void;
|
|
16
|
+
}>;
|
|
17
|
+
export default function PinchToZoom({ minimumZoomScale, maximumZoomScale, style: propStyle, onPinchStart, onPinchEnd, disabled, onLayout, onTranslationChange, onScaleChange, onScaleReset, children, onRequestClose, }: PinchToZoomProps): React.JSX.Element;
|
|
18
|
+
//# sourceMappingURL=PinchToZoom.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PinchToZoom.d.ts","sourceRoot":"","sources":["../../../src/PinchToZoom.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAC5E,OAAO,EACH,KAAK,iBAAiB,EACtB,KAAK,SAAS,EAEd,KAAK,SAAS,EACjB,MAAM,cAAc,CAAC;AACtB,OAAiB,EAGb,KAAK,WAAW,EAKnB,MAAM,yBAAyB,CAAC;AAKjC,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,CAAC;IAC7C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC1C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,mBAAmB,CAAC,EAAE,CAClB,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,EACtB,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,EACtB,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,KACzB,IAAI,CAAC;IACV,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAChC,gBAAoB,EACpB,gBAAoB,EACpB,KAAK,EAAE,SAAS,EAChB,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,mBAAmB,EACnB,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,cAAc,GACjB,EAAE,gBAAgB,qBA+QlB"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { FlashList } from '@shopify/flash-list';
|
|
3
|
+
import { type BaseSimpleImageSliderProps, type SimpleImageSliderItem } from './BaseSimpleImageSlider';
|
|
4
|
+
export type SimpleImageSliderProps = BaseSimpleImageSliderProps & {
|
|
5
|
+
fullScreenEnabled?: boolean;
|
|
6
|
+
};
|
|
7
|
+
declare const SimpleImageSlider: React.ForwardRefExoticComponent<BaseSimpleImageSliderProps & {
|
|
8
|
+
fullScreenEnabled?: boolean | undefined;
|
|
9
|
+
} & React.RefAttributes<FlashList<SimpleImageSliderItem>>>;
|
|
10
|
+
export default SimpleImageSlider;
|
|
11
|
+
//# sourceMappingURL=SimpleImageSlider.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SimpleImageSlider.d.ts","sourceRoot":"","sources":["../../../src/SimpleImageSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAC;AACzE,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAGhD,OAA4B,EACxB,KAAK,0BAA0B,EAC/B,KAAK,qBAAqB,EAC7B,MAAM,yBAAyB,CAAC;AAEjC,MAAM,MAAM,sBAAsB,GAAG,0BAA0B,GAAG;IAC9D,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC/B,CAAC;AAEF,QAAA,MAAM,iBAAiB;;0DAwDtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StyledComponentsThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/StyledComponentsThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAW,MAAM,OAAO,CAAC;AAG/D,MAAM,CAAC,OAAO,UAAU,6BAA6B,CAAC,EAAE,QAAQ,EAAE,EAAE,iBAAiB,qBA4CpF"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import StyledComponentsThemeProvider from './StyledComponentsThemeProvider';
|
|
2
|
+
import BaseListImageSlider, { type BaseSimpleImageSliderProps } from './BaseSimpleImageSlider';
|
|
3
|
+
import SimpleImageSlider, { type SimpleImageSliderProps } from './SimpleImageSlider';
|
|
4
|
+
import FullScreenImageSlider, { type FullScreenImageSliderProps } from './FullScreenImageSlider';
|
|
5
|
+
export { StyledComponentsThemeProvider as SimpleImageSliderThemeProvider, BaseListImageSlider, type BaseSimpleImageSliderProps, SimpleImageSlider, type SimpleImageSliderProps, FullScreenImageSlider, type FullScreenImageSliderProps, };
|
|
6
|
+
//# sourceMappingURL=index.d.ts.map
|