@fountain-ui/core 2.0.0-beta.10 → 2.0.0-beta.13
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/build/commonjs/Accordion/Accordion.js +3 -3
- package/build/commonjs/Accordion/Accordion.js.map +1 -1
- package/build/commonjs/ButtonBase/ButtonBase.js +56 -52
- package/build/commonjs/ButtonBase/ButtonBase.js.map +1 -1
- package/build/commonjs/CircularProgress/CircularProgress.js +19 -24
- package/build/commonjs/CircularProgress/CircularProgress.js.map +1 -1
- package/build/commonjs/ImageCore/ImageCoreNative.js +24 -26
- package/build/commonjs/ImageCore/ImageCoreNative.js.map +1 -1
- package/build/commonjs/Slide/Slide.js +12 -13
- package/build/commonjs/Slide/Slide.js.map +1 -1
- package/build/commonjs/Tabs/TabIndicator.js +2 -6
- package/build/commonjs/Tabs/TabIndicator.js.map +1 -1
- package/build/commonjs/Tabs/Tabs.js +46 -48
- package/build/commonjs/Tabs/Tabs.js.map +1 -1
- package/build/commonjs/Tabs/useTabCoordinates.js +44 -0
- package/build/commonjs/Tabs/useTabCoordinates.js.map +1 -0
- package/build/commonjs/Tabs/useTabsWidth.js +26 -0
- package/build/commonjs/Tabs/useTabsWidth.js.map +1 -0
- package/build/commonjs/Tooltip/Tooltip.js +18 -22
- package/build/commonjs/Tooltip/Tooltip.js.map +1 -1
- package/build/commonjs/animated/AnimatedPressable.js +2 -3
- package/build/commonjs/animated/AnimatedPressable.js.map +1 -1
- package/build/commonjs/hooks/useCollapsibleAppBar.js +46 -36
- package/build/commonjs/hooks/useCollapsibleAppBar.js.map +1 -1
- package/build/commonjs/hooks/useFadeInAppBar.js +35 -18
- package/build/commonjs/hooks/useFadeInAppBar.js.map +1 -1
- package/build/commonjs/hooks/useThrottle.js +3 -7
- package/build/commonjs/hooks/useThrottle.js.map +1 -1
- package/build/commonjs/internal/hooks/index.js +0 -8
- package/build/commonjs/internal/hooks/index.js.map +1 -1
- package/build/commonjs/internal/hooks/useHeight.js +2 -6
- package/build/commonjs/internal/hooks/useHeight.js.map +1 -1
- package/build/module/Accordion/Accordion.js +3 -3
- package/build/module/Accordion/Accordion.js.map +1 -1
- package/build/module/ButtonBase/ButtonBase.js +54 -48
- package/build/module/ButtonBase/ButtonBase.js.map +1 -1
- package/build/module/CircularProgress/CircularProgress.js +20 -21
- package/build/module/CircularProgress/CircularProgress.js.map +1 -1
- package/build/module/ImageCore/ImageCoreNative.js +20 -23
- package/build/module/ImageCore/ImageCoreNative.js.map +1 -1
- package/build/module/Slide/Slide.js +14 -10
- package/build/module/Slide/Slide.js.map +1 -1
- package/build/module/Tabs/TabIndicator.js +3 -7
- package/build/module/Tabs/TabIndicator.js.map +1 -1
- package/build/module/Tabs/Tabs.js +39 -39
- package/build/module/Tabs/Tabs.js.map +1 -1
- package/build/module/Tabs/useTabCoordinates.js +30 -0
- package/build/module/Tabs/useTabCoordinates.js.map +1 -0
- package/build/module/Tabs/useTabsWidth.js +18 -0
- package/build/module/Tabs/useTabsWidth.js.map +1 -0
- package/build/module/Tooltip/Tooltip.js +15 -15
- package/build/module/Tooltip/Tooltip.js.map +1 -1
- package/build/module/animated/AnimatedPressable.js +2 -3
- package/build/module/animated/AnimatedPressable.js.map +1 -1
- package/build/module/hooks/useCollapsibleAppBar.js +46 -34
- package/build/module/hooks/useCollapsibleAppBar.js.map +1 -1
- package/build/module/hooks/useFadeInAppBar.js +35 -14
- package/build/module/hooks/useFadeInAppBar.js.map +1 -1
- package/build/module/hooks/useThrottle.js +3 -3
- package/build/module/hooks/useThrottle.js.map +1 -1
- package/build/module/internal/hooks/index.js +0 -1
- package/build/module/internal/hooks/index.js.map +1 -1
- package/build/module/internal/hooks/useHeight.js +2 -2
- package/build/module/internal/hooks/useHeight.js.map +1 -1
- package/build/typescript/Tabs/useTabCoordinates.d.ts +7 -0
- package/build/typescript/Tabs/useTabsWidth.d.ts +2 -0
- package/build/typescript/animated/AnimatedPressable.d.ts +2 -2
- package/build/typescript/internal/hooks/index.d.ts +0 -1
- package/package.json +2 -2
- package/src/Accordion/Accordion.tsx +5 -3
- package/src/ButtonBase/ButtonBase.tsx +65 -43
- package/src/CircularProgress/CircularProgress.tsx +24 -30
- package/src/ImageCore/ImageCoreNative.tsx +17 -19
- package/src/Slide/Slide.tsx +17 -15
- package/src/Tabs/TabIndicator.tsx +4 -8
- package/src/Tabs/Tabs.tsx +37 -39
- package/src/Tabs/useTabCoordinates.ts +36 -0
- package/src/Tabs/useTabsWidth.ts +20 -0
- package/src/Tooltip/Tooltip.tsx +16 -16
- package/src/animated/AnimatedPressable.tsx +1 -2
- package/src/hooks/useCollapsibleAppBar.ts +41 -31
- package/src/hooks/useFadeInAppBar.ts +31 -15
- package/src/hooks/useThrottle.ts +3 -3
- package/src/internal/hooks/index.ts +0 -1
- package/src/internal/hooks/useHeight.ts +2 -2
- package/build/commonjs/ButtonBase/ButtonBase.ios.js +0 -101
- package/build/commonjs/ButtonBase/ButtonBase.ios.js.map +0 -1
- package/build/commonjs/ButtonBase/useDisabledReaction/index.js +0 -21
- package/build/commonjs/ButtonBase/useDisabledReaction/index.js.map +0 -1
- package/build/commonjs/ButtonBase/useDisabledReaction/index.native.js +0 -9
- package/build/commonjs/ButtonBase/useDisabledReaction/index.native.js.map +0 -1
- package/build/commonjs/ImageCore/ImageCoreNative.ios.js +0 -60
- package/build/commonjs/ImageCore/ImageCoreNative.ios.js.map +0 -1
- package/build/commonjs/internal/hooks/useWidth.js +0 -29
- package/build/commonjs/internal/hooks/useWidth.js.map +0 -1
- package/build/module/ButtonBase/ButtonBase.ios.js +0 -82
- package/build/module/ButtonBase/ButtonBase.ios.js.map +0 -1
- package/build/module/ButtonBase/useDisabledReaction/index.js +0 -12
- package/build/module/ButtonBase/useDisabledReaction/index.js.map +0 -1
- package/build/module/ButtonBase/useDisabledReaction/index.native.js +0 -2
- package/build/module/ButtonBase/useDisabledReaction/index.native.js.map +0 -1
- package/build/module/ImageCore/ImageCoreNative.ios.js +0 -45
- package/build/module/ImageCore/ImageCoreNative.ios.js.map +0 -1
- package/build/module/internal/hooks/useWidth.js +0 -15
- package/build/module/internal/hooks/useWidth.js.map +0 -1
- package/build/typescript/ButtonBase/ButtonBase.ios.d.ts +0 -2
- package/build/typescript/ButtonBase/useDisabledReaction/index.d.ts +0 -2
- package/build/typescript/ButtonBase/useDisabledReaction/index.native.d.ts +0 -2
- package/build/typescript/ImageCore/ImageCoreNative.ios.d.ts +0 -2
- package/build/typescript/internal/hooks/useWidth.d.ts +0 -2
- package/src/ButtonBase/ButtonBase.ios.tsx +0 -95
- package/src/ButtonBase/useDisabledReaction/index.native.ts +0 -4
- package/src/ButtonBase/useDisabledReaction/index.ts +0 -16
- package/src/ImageCore/ImageCoreNative.ios.tsx +0 -46
- package/src/internal/hooks/useWidth.ts +0 -17
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { useMemo } from 'react';
|
|
2
2
|
import { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';
|
|
3
3
|
import type { SharedValue } from 'react-native-reanimated';
|
|
4
4
|
import { runOnJS, useAnimatedScrollHandler, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';
|
|
@@ -58,7 +58,7 @@ export default function useFadeInAppBar(userOptions: Options = defaultOptions):
|
|
|
58
58
|
|
|
59
59
|
const [appBarHeight, onAppBarLayout] = useHeight();
|
|
60
60
|
|
|
61
|
-
const [fromOffsetY, toOffsetY] =
|
|
61
|
+
const [fromOffsetY, toOffsetY] = useMemo(() => {
|
|
62
62
|
const endY = typeof fadeInEndY === 'function'
|
|
63
63
|
? fadeInEndY(appBarHeight)
|
|
64
64
|
: fadeInEndY;
|
|
@@ -74,21 +74,37 @@ export default function useFadeInAppBar(userOptions: Options = defaultOptions):
|
|
|
74
74
|
const lastOffsetY = useSharedValue<number>(0);
|
|
75
75
|
const normalized = useSharedValue<number>(0);
|
|
76
76
|
|
|
77
|
-
const
|
|
78
|
-
const
|
|
79
|
-
|
|
80
|
-
const animatedAppBarStyle = useAnimatedStyle(() =>
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
77
|
+
const originalBackgroundColor = theme.palette.background.default;
|
|
78
|
+
const rgbValues = useMemo(() => rgb(originalBackgroundColor), [originalBackgroundColor]);
|
|
79
|
+
|
|
80
|
+
const animatedAppBarStyle = useAnimatedStyle(() => {
|
|
81
|
+
const [r, g, b] = rgbValues;
|
|
82
|
+
const backgroundColor = `rgba(${r}, ${g}, ${b}, ${normalized.value})`;
|
|
83
|
+
|
|
84
|
+
if (Platform.OS === 'web') {
|
|
85
|
+
return { backgroundColor };
|
|
86
|
+
}
|
|
87
|
+
if (Platform.OS === 'android') {
|
|
88
|
+
return {
|
|
89
|
+
backgroundColor,
|
|
90
|
+
elevation: normalized.value >= 1 ? 6 : 0,
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
if (Platform.OS === 'ios') {
|
|
94
|
+
return {
|
|
95
|
+
backgroundColor,
|
|
96
|
+
shadowColor: '#000',
|
|
97
|
+
shadowOffset,
|
|
98
|
+
shadowRadius: 4.65,
|
|
99
|
+
shadowOpacity: normalized.value >= 1 ? 0.25 : 0,
|
|
100
|
+
};
|
|
101
|
+
}
|
|
102
|
+
return {};
|
|
103
|
+
}, [rgbValues]);
|
|
88
104
|
|
|
89
105
|
const animatedTitleStyle = useAnimatedStyle(() => ({
|
|
90
106
|
opacity: normalized.value,
|
|
91
|
-
}));
|
|
107
|
+
}), []);
|
|
92
108
|
|
|
93
109
|
const scrollHandler = useAnimatedScrollHandler({
|
|
94
110
|
onBeginDrag: () => {
|
|
@@ -112,7 +128,7 @@ export default function useFadeInAppBar(userOptions: Options = defaultOptions):
|
|
|
112
128
|
onMomentumEnd: (event) => {
|
|
113
129
|
lastOffsetY.value = event.contentOffset.y;
|
|
114
130
|
},
|
|
115
|
-
});
|
|
131
|
+
}, [keyboardDismissMode]);
|
|
116
132
|
|
|
117
133
|
const appBarStyle = [
|
|
118
134
|
animatedAppBarStyle,
|
package/src/hooks/useThrottle.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { useCallback, useRef } from 'react';
|
|
2
2
|
|
|
3
3
|
export interface ThrottleOptions {
|
|
4
4
|
periodMillis: number;
|
|
@@ -8,9 +8,9 @@ export interface ThrottleOptions {
|
|
|
8
8
|
export default function useThrottle(options: ThrottleOptions) {
|
|
9
9
|
const { periodMillis, callback } = options;
|
|
10
10
|
|
|
11
|
-
const lastExecMillisRef =
|
|
11
|
+
const lastExecMillisRef = useRef(0);
|
|
12
12
|
|
|
13
|
-
return
|
|
13
|
+
return useCallback((...args: any[]) => {
|
|
14
14
|
const now = Date.now();
|
|
15
15
|
const millisAfterExecuted = now - lastExecMillisRef.current;
|
|
16
16
|
lastExecMillisRef.current = now;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { useState } from 'react';
|
|
2
2
|
import { ViewProps } from 'react-native';
|
|
3
3
|
import { useWorkletCallback } from 'react-native-reanimated';
|
|
4
4
|
|
|
5
5
|
type OnLayoutCallback = ViewProps['onLayout'];
|
|
6
6
|
|
|
7
7
|
export default function useHeight(initialHeight = 0): [number, OnLayoutCallback] {
|
|
8
|
-
const [height, setHeight] =
|
|
8
|
+
const [height, setHeight] = useState<number>(initialHeight);
|
|
9
9
|
|
|
10
10
|
const onLayout = useWorkletCallback((e) => {
|
|
11
11
|
setHeight(e.nativeEvent.layout.height);
|
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = ButtonBase;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
|
-
var _hooks = require("../hooks");
|
|
13
|
-
|
|
14
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
|
-
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); }
|
|
17
|
-
|
|
18
|
-
const ORIGINAL_OPACITY = 1;
|
|
19
|
-
const ACTIVE_OPACITY = .65;
|
|
20
|
-
const DISABLED_OPACITY = .3;
|
|
21
|
-
const ORIGINAL_SCALE = 1;
|
|
22
|
-
const MINIFIED_SCALE = .96;
|
|
23
|
-
const animatedDuration = 150;
|
|
24
|
-
|
|
25
|
-
const AnimatedPressable = _reactNative.Animated.createAnimatedComponent(_reactNative.Pressable);
|
|
26
|
-
|
|
27
|
-
function ButtonBase(props) {
|
|
28
|
-
const {
|
|
29
|
-
children,
|
|
30
|
-
disabled = false,
|
|
31
|
-
disableThrottle = false,
|
|
32
|
-
onPress,
|
|
33
|
-
pressEffect = 'opacity',
|
|
34
|
-
style,
|
|
35
|
-
throttleMillis = 650,
|
|
36
|
-
...otherProps
|
|
37
|
-
} = props;
|
|
38
|
-
const handlePress = (0, _hooks.useThrottle)({
|
|
39
|
-
periodMillis: disableThrottle ? 0 : throttleMillis,
|
|
40
|
-
callback: onPress
|
|
41
|
-
});
|
|
42
|
-
|
|
43
|
-
const [opacity] = _react.default.useState(() => new _reactNative.Animated.Value(ORIGINAL_OPACITY));
|
|
44
|
-
|
|
45
|
-
const [scale] = _react.default.useState(() => new _reactNative.Animated.Value(ORIGINAL_SCALE));
|
|
46
|
-
|
|
47
|
-
const startAnimation = _react.default.useCallback(function (pressIn) {
|
|
48
|
-
let isHovered = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
49
|
-
|
|
50
|
-
if (pressEffect === 'none') {
|
|
51
|
-
return;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
if (pressEffect === 'opacity') {
|
|
55
|
-
if (pressIn) {
|
|
56
|
-
_reactNative.Animated.timing(opacity, {
|
|
57
|
-
toValue: ACTIVE_OPACITY,
|
|
58
|
-
duration: animatedDuration,
|
|
59
|
-
useNativeDriver: true
|
|
60
|
-
}).start();
|
|
61
|
-
} else {
|
|
62
|
-
_reactNative.Animated.timing(opacity, {
|
|
63
|
-
toValue: ORIGINAL_OPACITY,
|
|
64
|
-
duration: 0,
|
|
65
|
-
useNativeDriver: true
|
|
66
|
-
}).start();
|
|
67
|
-
}
|
|
68
|
-
} else if (!isHovered) {
|
|
69
|
-
if (pressIn) {
|
|
70
|
-
_reactNative.Animated.timing(scale, {
|
|
71
|
-
toValue: MINIFIED_SCALE,
|
|
72
|
-
duration: animatedDuration,
|
|
73
|
-
delay: 100,
|
|
74
|
-
useNativeDriver: true
|
|
75
|
-
}).start();
|
|
76
|
-
} else {
|
|
77
|
-
_reactNative.Animated.timing(scale, {
|
|
78
|
-
toValue: ORIGINAL_SCALE,
|
|
79
|
-
duration: 150,
|
|
80
|
-
useNativeDriver: true
|
|
81
|
-
}).start();
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
}, [pressEffect]);
|
|
85
|
-
|
|
86
|
-
return /*#__PURE__*/_react.default.createElement(AnimatedPressable, _extends({
|
|
87
|
-
disabled: disabled,
|
|
88
|
-
onPress: handlePress,
|
|
89
|
-
onPressIn: () => startAnimation(true),
|
|
90
|
-
onPressOut: () => startAnimation(false),
|
|
91
|
-
style: [style, {
|
|
92
|
-
opacity: disabled ? DISABLED_OPACITY : opacity,
|
|
93
|
-
transform: [{
|
|
94
|
-
scale: disabled ? ORIGINAL_SCALE : scale
|
|
95
|
-
}]
|
|
96
|
-
}]
|
|
97
|
-
}, otherProps), children);
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
;
|
|
101
|
-
//# sourceMappingURL=ButtonBase.ios.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["ORIGINAL_OPACITY","ACTIVE_OPACITY","DISABLED_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","animatedDuration","AnimatedPressable","Animated","createAnimatedComponent","Pressable","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","useThrottle","periodMillis","callback","opacity","React","useState","Value","scale","startAnimation","useCallback","pressIn","isHovered","timing","toValue","duration","useNativeDriver","start","delay","transform"],"sources":["ButtonBase.ios.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated, Pressable } from 'react-native';\nimport { useThrottle } from '../hooks';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\nconst ORIGINAL_OPACITY = 1;\nconst ACTIVE_OPACITY = .65;\nconst DISABLED_OPACITY = .3;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\nconst animatedDuration = 150;\n\nconst AnimatedPressable = Animated.createAnimatedComponent(Pressable);\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n const {\n children,\n disabled = false,\n disableThrottle = false,\n onPress,\n pressEffect = 'opacity',\n style,\n throttleMillis = 650,\n ...otherProps\n } = props;\n\n const handlePress = useThrottle({\n periodMillis: disableThrottle ? 0 : throttleMillis,\n callback: onPress,\n });\n\n const [opacity] = React.useState(() => new Animated.Value(ORIGINAL_OPACITY));\n const [scale] = React.useState(() => new Animated.Value(ORIGINAL_SCALE));\n\n const startAnimation = React.useCallback((pressIn: boolean, isHovered: boolean = false) => {\n if (pressEffect === 'none') {\n return;\n }\n\n if (pressEffect === 'opacity') {\n if (pressIn) {\n Animated.timing(opacity, {\n toValue: ACTIVE_OPACITY,\n duration: animatedDuration,\n useNativeDriver: true,\n }).start();\n } else {\n Animated.timing(opacity, {\n toValue: ORIGINAL_OPACITY,\n duration: 0,\n useNativeDriver: true,\n }).start();\n }\n } else if (!isHovered) {\n if (pressIn) {\n Animated.timing(scale, {\n toValue: MINIFIED_SCALE,\n duration: animatedDuration,\n delay: 100,\n useNativeDriver: true,\n }).start();\n } else {\n Animated.timing(scale, {\n toValue: ORIGINAL_SCALE,\n duration: 150,\n useNativeDriver: true,\n }).start();\n }\n }\n }, [pressEffect]);\n\n return (\n <AnimatedPressable\n disabled={disabled}\n onPress={handlePress}\n onPressIn={() => startAnimation(true)}\n onPressOut={() => startAnimation(false)}\n style={[style,\n {\n opacity: disabled ? DISABLED_OPACITY : opacity,\n transform: [\n {\n scale: disabled ? ORIGINAL_SCALE : scale,\n },\n ],\n },\n ]}\n {...otherProps}\n >\n {children}\n </AnimatedPressable>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;;;AAGA,MAAMA,gBAAgB,GAAG,CAAzB;AACA,MAAMC,cAAc,GAAG,GAAvB;AACA,MAAMC,gBAAgB,GAAG,EAAzB;AAEA,MAAMC,cAAc,GAAG,CAAvB;AACA,MAAMC,cAAc,GAAG,GAAvB;AAEA,MAAMC,gBAAgB,GAAG,GAAzB;;AAEA,MAAMC,iBAAiB,GAAGC,qBAAA,CAASC,uBAAT,CAAiCC,sBAAjC,CAA1B;;AAEe,SAASC,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,QADE;IAEFC,QAAQ,GAAG,KAFT;IAGFC,eAAe,GAAG,KAHhB;IAIFC,OAJE;IAKFC,WAAW,GAAG,SALZ;IAMFC,KANE;IAOFC,cAAc,GAAG,GAPf;IAQF,GAAGC;EARD,IASFR,KATJ;EAWA,MAAMS,WAAW,GAAG,IAAAC,kBAAA,EAAY;IAC5BC,YAAY,EAAER,eAAe,GAAG,CAAH,GAAOI,cADR;IAE5BK,QAAQ,EAAER;EAFkB,CAAZ,CAApB;;EAKA,MAAM,CAACS,OAAD,IAAYC,cAAA,CAAMC,QAAN,CAAe,MAAM,IAAInB,qBAAA,CAASoB,KAAb,CAAmB3B,gBAAnB,CAArB,CAAlB;;EACA,MAAM,CAAC4B,KAAD,IAAUH,cAAA,CAAMC,QAAN,CAAe,MAAM,IAAInB,qBAAA,CAASoB,KAAb,CAAmBxB,cAAnB,CAArB,CAAhB;;EAEA,MAAM0B,cAAc,GAAGJ,cAAA,CAAMK,WAAN,CAAkB,UAACC,OAAD,EAAkD;IAAA,IAA/BC,SAA+B,uEAAV,KAAU;;IACvF,IAAIhB,WAAW,KAAK,MAApB,EAA4B;MACxB;IACH;;IAED,IAAIA,WAAW,KAAK,SAApB,EAA+B;MAC3B,IAAIe,OAAJ,EAAa;QACTxB,qBAAA,CAAS0B,MAAT,CAAgBT,OAAhB,EAAyB;UACrBU,OAAO,EAAEjC,cADY;UAErBkC,QAAQ,EAAE9B,gBAFW;UAGrB+B,eAAe,EAAE;QAHI,CAAzB,EAIGC,KAJH;MAKH,CAND,MAMO;QACH9B,qBAAA,CAAS0B,MAAT,CAAgBT,OAAhB,EAAyB;UACrBU,OAAO,EAAElC,gBADY;UAErBmC,QAAQ,EAAE,CAFW;UAGrBC,eAAe,EAAE;QAHI,CAAzB,EAIGC,KAJH;MAKH;IACJ,CAdD,MAcO,IAAI,CAACL,SAAL,EAAgB;MACnB,IAAID,OAAJ,EAAa;QACTxB,qBAAA,CAAS0B,MAAT,CAAgBL,KAAhB,EAAuB;UACnBM,OAAO,EAAE9B,cADU;UAEnB+B,QAAQ,EAAE9B,gBAFS;UAGnBiC,KAAK,EAAE,GAHY;UAInBF,eAAe,EAAE;QAJE,CAAvB,EAKGC,KALH;MAMH,CAPD,MAOO;QACH9B,qBAAA,CAAS0B,MAAT,CAAgBL,KAAhB,EAAuB;UACnBM,OAAO,EAAE/B,cADU;UAEnBgC,QAAQ,EAAE,GAFS;UAGnBC,eAAe,EAAE;QAHE,CAAvB,EAIGC,KAJH;MAKH;IACJ;EACJ,CAnCsB,EAmCpB,CAACrB,WAAD,CAnCoB,CAAvB;;EAqCA,oBACI,6BAAC,iBAAD;IACI,QAAQ,EAAEH,QADd;IAEI,OAAO,EAAEO,WAFb;IAGI,SAAS,EAAE,MAAMS,cAAc,CAAC,IAAD,CAHnC;IAII,UAAU,EAAE,MAAMA,cAAc,CAAC,KAAD,CAJpC;IAKI,KAAK,EAAE,CAACZ,KAAD,EACH;MACIO,OAAO,EAAEX,QAAQ,GAAGX,gBAAH,GAAsBsB,OAD3C;MAEIe,SAAS,EAAE,CACP;QACIX,KAAK,EAAEf,QAAQ,GAAGV,cAAH,GAAoByB;MADvC,CADO;IAFf,CADG;EALX,GAeQT,UAfR,GAiBKP,QAjBL,CADJ;AAqBH;;AAAA"}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = useDisabledReaction;
|
|
7
|
-
|
|
8
|
-
var _reactNativeReanimated = require("react-native-reanimated");
|
|
9
|
-
|
|
10
|
-
var _ButtonBase = require("../ButtonBase");
|
|
11
|
-
|
|
12
|
-
function useDisabledReaction(disabled, opacity) {
|
|
13
|
-
(0, _reactNativeReanimated.useAnimatedReaction)(() => disabled, result => {
|
|
14
|
-
if (result) {
|
|
15
|
-
opacity.value = _ButtonBase.DISABLED_OPACITY;
|
|
16
|
-
} else {
|
|
17
|
-
opacity.value = _ButtonBase.ORIGINAL_OPACITY;
|
|
18
|
-
}
|
|
19
|
-
});
|
|
20
|
-
}
|
|
21
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["useDisabledReaction","disabled","opacity","useAnimatedReaction","result","value","DISABLED_OPACITY","ORIGINAL_OPACITY"],"sources":["index.ts"],"sourcesContent":["import type { SharedValue } from 'react-native-reanimated';\nimport { useAnimatedReaction } from 'react-native-reanimated';\nimport { DISABLED_OPACITY, ORIGINAL_OPACITY } from '../ButtonBase';\n\nexport default function useDisabledReaction(disabled: boolean, opacity: SharedValue<number>) {\n useAnimatedReaction(\n () => disabled,\n (result) => {\n if (result) {\n opacity.value = DISABLED_OPACITY;\n } else {\n opacity.value = ORIGINAL_OPACITY;\n }\n },\n );\n}\n"],"mappings":";;;;;;;AACA;;AACA;;AAEe,SAASA,mBAAT,CAA6BC,QAA7B,EAAgDC,OAAhD,EAA8E;EACzF,IAAAC,0CAAA,EACI,MAAMF,QADV,EAEKG,MAAD,IAAY;IACR,IAAIA,MAAJ,EAAY;MACRF,OAAO,CAACG,KAAR,GAAgBC,4BAAhB;IACH,CAFD,MAEO;MACHJ,OAAO,CAACG,KAAR,GAAgBE,4BAAhB;IACH;EACJ,CARL;AAUH"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["useDisabledReaction","disabled","opacity"],"sources":["index.native.ts"],"sourcesContent":["import Animated from 'react-native-reanimated';\n\nexport default function useDisabledReaction(disabled: boolean, opacity: Animated.SharedValue<number>) {\n}"],"mappings":";;;;;;;AAEe,SAASA,mBAAT,CAA6BC,QAA7B,EAAgDC,OAAhD,EAAuF,CACrG"}
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = ImageCore;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
|
-
var _reactNativeFastImage = _interopRequireDefault(require("react-native-fast-image"));
|
|
13
|
-
|
|
14
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
|
-
const AnimatedFastImage = _reactNative.Animated.createAnimatedComponent(_reactNativeFastImage.default);
|
|
17
|
-
|
|
18
|
-
function ImageCore(props) {
|
|
19
|
-
const {
|
|
20
|
-
height,
|
|
21
|
-
onError,
|
|
22
|
-
onLoad,
|
|
23
|
-
resizeMode,
|
|
24
|
-
source,
|
|
25
|
-
width
|
|
26
|
-
} = props;
|
|
27
|
-
const style = {
|
|
28
|
-
width,
|
|
29
|
-
height
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
const [opacity] = _react.default.useState(() => new _reactNative.Animated.Value(0));
|
|
33
|
-
|
|
34
|
-
const handleLoad = () => {
|
|
35
|
-
_reactNative.Animated.timing(opacity, {
|
|
36
|
-
toValue: 1,
|
|
37
|
-
duration: 200,
|
|
38
|
-
useNativeDriver: true
|
|
39
|
-
}).start();
|
|
40
|
-
|
|
41
|
-
if (onLoad) {
|
|
42
|
-
onLoad();
|
|
43
|
-
}
|
|
44
|
-
};
|
|
45
|
-
|
|
46
|
-
return /*#__PURE__*/_react.default.createElement(AnimatedFastImage, {
|
|
47
|
-
onError: onError,
|
|
48
|
-
onLoad: handleLoad,
|
|
49
|
-
resizeMode: resizeMode,
|
|
50
|
-
source: {
|
|
51
|
-
uri: source.uri
|
|
52
|
-
},
|
|
53
|
-
style: [style, {
|
|
54
|
-
opacity
|
|
55
|
-
}]
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
;
|
|
60
|
-
//# sourceMappingURL=ImageCoreNative.ios.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["AnimatedFastImage","Animated","createAnimatedComponent","FastImage","ImageCore","props","height","onError","onLoad","resizeMode","source","width","style","opacity","React","useState","Value","handleLoad","timing","toValue","duration","useNativeDriver","start","uri"],"sources":["ImageCoreNative.ios.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated } from 'react-native';\nimport FastImage from 'react-native-fast-image';\nimport type ImageCoreProps from './ImageCoreProps';\n\nconst AnimatedFastImage = Animated.createAnimatedComponent(FastImage);\n\nexport default function ImageCore(props: ImageCoreProps) {\n const {\n height,\n onError,\n onLoad,\n resizeMode,\n source,\n width,\n } = props;\n\n const style = { width, height };\n\n const [opacity] = React.useState(() => new Animated.Value(0));\n\n const handleLoad = () => {\n Animated.timing(opacity, {\n toValue: 1,\n duration: 200,\n useNativeDriver: true,\n }).start();\n\n if (onLoad) {\n onLoad();\n }\n };\n\n return (\n <AnimatedFastImage\n onError={onError}\n onLoad={handleLoad}\n resizeMode={resizeMode}\n source={{ uri: source.uri }}\n style={[\n style,\n { opacity },\n ]}\n />\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAGA,MAAMA,iBAAiB,GAAGC,qBAAA,CAASC,uBAAT,CAAiCC,6BAAjC,CAA1B;;AAEe,SAASC,SAAT,CAAmBC,KAAnB,EAA0C;EACrD,MAAM;IACFC,MADE;IAEFC,OAFE;IAGFC,MAHE;IAIFC,UAJE;IAKFC,MALE;IAMFC;EANE,IAOFN,KAPJ;EASA,MAAMO,KAAK,GAAG;IAAED,KAAF;IAASL;EAAT,CAAd;;EAEA,MAAM,CAACO,OAAD,IAAYC,cAAA,CAAMC,QAAN,CAAe,MAAM,IAAId,qBAAA,CAASe,KAAb,CAAmB,CAAnB,CAArB,CAAlB;;EAEA,MAAMC,UAAU,GAAG,MAAM;IACrBhB,qBAAA,CAASiB,MAAT,CAAgBL,OAAhB,EAAyB;MACrBM,OAAO,EAAE,CADY;MAErBC,QAAQ,EAAE,GAFW;MAGrBC,eAAe,EAAE;IAHI,CAAzB,EAIGC,KAJH;;IAMA,IAAId,MAAJ,EAAY;MACRA,MAAM;IACT;EACJ,CAVD;;EAYA,oBACI,6BAAC,iBAAD;IACI,OAAO,EAAED,OADb;IAEI,MAAM,EAAEU,UAFZ;IAGI,UAAU,EAAER,UAHhB;IAII,MAAM,EAAE;MAAEc,GAAG,EAAEb,MAAM,CAACa;IAAd,CAJZ;IAKI,KAAK,EAAE,CACHX,KADG,EAEH;MAAEC;IAAF,CAFG;EALX,EADJ;AAYH;;AAAA"}
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = useWidth;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
14
|
-
function useWidth() {
|
|
15
|
-
const window = (0, _reactNative.useWindowDimensions)();
|
|
16
|
-
|
|
17
|
-
const [width, setWidth] = _react.default.useState(window.width);
|
|
18
|
-
|
|
19
|
-
const onLayout = _react.default.useCallback(e => {
|
|
20
|
-
const newWidth = e.nativeEvent.layout.width;
|
|
21
|
-
|
|
22
|
-
if (newWidth > 0 && Math.round(newWidth) !== Math.round(width)) {
|
|
23
|
-
setWidth(newWidth);
|
|
24
|
-
}
|
|
25
|
-
}, []);
|
|
26
|
-
|
|
27
|
-
return [width, onLayout];
|
|
28
|
-
}
|
|
29
|
-
//# sourceMappingURL=useWidth.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["useWidth","window","useWindowDimensions","width","setWidth","React","useState","onLayout","useCallback","e","newWidth","nativeEvent","layout","Math","round"],"sources":["useWidth.ts"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, useWindowDimensions, ViewProps } from 'react-native';\n\nexport default function useWidth(): [number, ViewProps['onLayout']] {\n const window = useWindowDimensions();\n const [width, setWidth] = React.useState(window.width);\n\n const onLayout = React.useCallback((e: LayoutChangeEvent) => {\n const newWidth = e.nativeEvent.layout.width;\n\n if (newWidth > 0 && Math.round(newWidth) !== Math.round(width)) {\n setWidth(newWidth);\n }\n }, []);\n\n return [width, onLayout];\n}"],"mappings":";;;;;;;AAAA;;AACA;;;;AAEe,SAASA,QAAT,GAAqD;EAChE,MAAMC,MAAM,GAAG,IAAAC,gCAAA,GAAf;;EACA,MAAM,CAACC,KAAD,EAAQC,QAAR,IAAoBC,cAAA,CAAMC,QAAN,CAAeL,MAAM,CAACE,KAAtB,CAA1B;;EAEA,MAAMI,QAAQ,GAAGF,cAAA,CAAMG,WAAN,CAAmBC,CAAD,IAA0B;IACzD,MAAMC,QAAQ,GAAGD,CAAC,CAACE,WAAF,CAAcC,MAAd,CAAqBT,KAAtC;;IAEA,IAAIO,QAAQ,GAAG,CAAX,IAAgBG,IAAI,CAACC,KAAL,CAAWJ,QAAX,MAAyBG,IAAI,CAACC,KAAL,CAAWX,KAAX,CAA7C,EAAgE;MAC5DC,QAAQ,CAACM,QAAD,CAAR;IACH;EACJ,CANgB,EAMd,EANc,CAAjB;;EAQA,OAAO,CAACP,KAAD,EAAQI,QAAR,CAAP;AACH"}
|
|
@@ -1,82 +0,0 @@
|
|
|
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
|
-
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { Animated, Pressable } from 'react-native';
|
|
5
|
-
import { useThrottle } from '../hooks';
|
|
6
|
-
const ORIGINAL_OPACITY = 1;
|
|
7
|
-
const ACTIVE_OPACITY = .65;
|
|
8
|
-
const DISABLED_OPACITY = .3;
|
|
9
|
-
const ORIGINAL_SCALE = 1;
|
|
10
|
-
const MINIFIED_SCALE = .96;
|
|
11
|
-
const animatedDuration = 150;
|
|
12
|
-
const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
|
|
13
|
-
export default function ButtonBase(props) {
|
|
14
|
-
const {
|
|
15
|
-
children,
|
|
16
|
-
disabled = false,
|
|
17
|
-
disableThrottle = false,
|
|
18
|
-
onPress,
|
|
19
|
-
pressEffect = 'opacity',
|
|
20
|
-
style,
|
|
21
|
-
throttleMillis = 650,
|
|
22
|
-
...otherProps
|
|
23
|
-
} = props;
|
|
24
|
-
const handlePress = useThrottle({
|
|
25
|
-
periodMillis: disableThrottle ? 0 : throttleMillis,
|
|
26
|
-
callback: onPress
|
|
27
|
-
});
|
|
28
|
-
const [opacity] = React.useState(() => new Animated.Value(ORIGINAL_OPACITY));
|
|
29
|
-
const [scale] = React.useState(() => new Animated.Value(ORIGINAL_SCALE));
|
|
30
|
-
const startAnimation = React.useCallback(function (pressIn) {
|
|
31
|
-
let isHovered = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
32
|
-
|
|
33
|
-
if (pressEffect === 'none') {
|
|
34
|
-
return;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
if (pressEffect === 'opacity') {
|
|
38
|
-
if (pressIn) {
|
|
39
|
-
Animated.timing(opacity, {
|
|
40
|
-
toValue: ACTIVE_OPACITY,
|
|
41
|
-
duration: animatedDuration,
|
|
42
|
-
useNativeDriver: true
|
|
43
|
-
}).start();
|
|
44
|
-
} else {
|
|
45
|
-
Animated.timing(opacity, {
|
|
46
|
-
toValue: ORIGINAL_OPACITY,
|
|
47
|
-
duration: 0,
|
|
48
|
-
useNativeDriver: true
|
|
49
|
-
}).start();
|
|
50
|
-
}
|
|
51
|
-
} else if (!isHovered) {
|
|
52
|
-
if (pressIn) {
|
|
53
|
-
Animated.timing(scale, {
|
|
54
|
-
toValue: MINIFIED_SCALE,
|
|
55
|
-
duration: animatedDuration,
|
|
56
|
-
delay: 100,
|
|
57
|
-
useNativeDriver: true
|
|
58
|
-
}).start();
|
|
59
|
-
} else {
|
|
60
|
-
Animated.timing(scale, {
|
|
61
|
-
toValue: ORIGINAL_SCALE,
|
|
62
|
-
duration: 150,
|
|
63
|
-
useNativeDriver: true
|
|
64
|
-
}).start();
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
}, [pressEffect]);
|
|
68
|
-
return /*#__PURE__*/React.createElement(AnimatedPressable, _extends({
|
|
69
|
-
disabled: disabled,
|
|
70
|
-
onPress: handlePress,
|
|
71
|
-
onPressIn: () => startAnimation(true),
|
|
72
|
-
onPressOut: () => startAnimation(false),
|
|
73
|
-
style: [style, {
|
|
74
|
-
opacity: disabled ? DISABLED_OPACITY : opacity,
|
|
75
|
-
transform: [{
|
|
76
|
-
scale: disabled ? ORIGINAL_SCALE : scale
|
|
77
|
-
}]
|
|
78
|
-
}]
|
|
79
|
-
}, otherProps), children);
|
|
80
|
-
}
|
|
81
|
-
;
|
|
82
|
-
//# sourceMappingURL=ButtonBase.ios.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["React","Animated","Pressable","useThrottle","ORIGINAL_OPACITY","ACTIVE_OPACITY","DISABLED_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","animatedDuration","AnimatedPressable","createAnimatedComponent","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","periodMillis","callback","opacity","useState","Value","scale","startAnimation","useCallback","pressIn","isHovered","timing","toValue","duration","useNativeDriver","start","delay","transform"],"sources":["ButtonBase.ios.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated, Pressable } from 'react-native';\nimport { useThrottle } from '../hooks';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\nconst ORIGINAL_OPACITY = 1;\nconst ACTIVE_OPACITY = .65;\nconst DISABLED_OPACITY = .3;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\nconst animatedDuration = 150;\n\nconst AnimatedPressable = Animated.createAnimatedComponent(Pressable);\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n const {\n children,\n disabled = false,\n disableThrottle = false,\n onPress,\n pressEffect = 'opacity',\n style,\n throttleMillis = 650,\n ...otherProps\n } = props;\n\n const handlePress = useThrottle({\n periodMillis: disableThrottle ? 0 : throttleMillis,\n callback: onPress,\n });\n\n const [opacity] = React.useState(() => new Animated.Value(ORIGINAL_OPACITY));\n const [scale] = React.useState(() => new Animated.Value(ORIGINAL_SCALE));\n\n const startAnimation = React.useCallback((pressIn: boolean, isHovered: boolean = false) => {\n if (pressEffect === 'none') {\n return;\n }\n\n if (pressEffect === 'opacity') {\n if (pressIn) {\n Animated.timing(opacity, {\n toValue: ACTIVE_OPACITY,\n duration: animatedDuration,\n useNativeDriver: true,\n }).start();\n } else {\n Animated.timing(opacity, {\n toValue: ORIGINAL_OPACITY,\n duration: 0,\n useNativeDriver: true,\n }).start();\n }\n } else if (!isHovered) {\n if (pressIn) {\n Animated.timing(scale, {\n toValue: MINIFIED_SCALE,\n duration: animatedDuration,\n delay: 100,\n useNativeDriver: true,\n }).start();\n } else {\n Animated.timing(scale, {\n toValue: ORIGINAL_SCALE,\n duration: 150,\n useNativeDriver: true,\n }).start();\n }\n }\n }, [pressEffect]);\n\n return (\n <AnimatedPressable\n disabled={disabled}\n onPress={handlePress}\n onPressIn={() => startAnimation(true)}\n onPressOut={() => startAnimation(false)}\n style={[style,\n {\n opacity: disabled ? DISABLED_OPACITY : opacity,\n transform: [\n {\n scale: disabled ? ORIGINAL_SCALE : scale,\n },\n ],\n },\n ]}\n {...otherProps}\n >\n {children}\n </AnimatedPressable>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { useAnimatedReaction } from 'react-native-reanimated';
|
|
2
|
-
import { DISABLED_OPACITY, ORIGINAL_OPACITY } from '../ButtonBase';
|
|
3
|
-
export default function useDisabledReaction(disabled, opacity) {
|
|
4
|
-
useAnimatedReaction(() => disabled, result => {
|
|
5
|
-
if (result) {
|
|
6
|
-
opacity.value = DISABLED_OPACITY;
|
|
7
|
-
} else {
|
|
8
|
-
opacity.value = ORIGINAL_OPACITY;
|
|
9
|
-
}
|
|
10
|
-
});
|
|
11
|
-
}
|
|
12
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["useAnimatedReaction","DISABLED_OPACITY","ORIGINAL_OPACITY","useDisabledReaction","disabled","opacity","result","value"],"sources":["index.ts"],"sourcesContent":["import type { SharedValue } from 'react-native-reanimated';\nimport { useAnimatedReaction } from 'react-native-reanimated';\nimport { DISABLED_OPACITY, ORIGINAL_OPACITY } from '../ButtonBase';\n\nexport default function useDisabledReaction(disabled: boolean, opacity: SharedValue<number>) {\n useAnimatedReaction(\n () => disabled,\n (result) => {\n if (result) {\n opacity.value = DISABLED_OPACITY;\n } else {\n opacity.value = ORIGINAL_OPACITY;\n }\n },\n );\n}\n"],"mappings":"AACA,SAASA,mBAAT,QAAoC,yBAApC;AACA,SAASC,gBAAT,EAA2BC,gBAA3B,QAAmD,eAAnD;AAEA,eAAe,SAASC,mBAAT,CAA6BC,QAA7B,EAAgDC,OAAhD,EAA8E;EACzFL,mBAAmB,CACf,MAAMI,QADS,EAEdE,MAAD,IAAY;IACR,IAAIA,MAAJ,EAAY;MACRD,OAAO,CAACE,KAAR,GAAgBN,gBAAhB;IACH,CAFD,MAEO;MACHI,OAAO,CAACE,KAAR,GAAgBL,gBAAhB;IACH;EACJ,CARc,CAAnB;AAUH"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["useDisabledReaction","disabled","opacity"],"sources":["index.native.ts"],"sourcesContent":["import Animated from 'react-native-reanimated';\n\nexport default function useDisabledReaction(disabled: boolean, opacity: Animated.SharedValue<number>) {\n}"],"mappings":"AAEA,eAAe,SAASA,mBAAT,CAA6BC,QAA7B,EAAgDC,OAAhD,EAAuF,CACrG"}
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Animated } from 'react-native';
|
|
3
|
-
import FastImage from 'react-native-fast-image';
|
|
4
|
-
const AnimatedFastImage = Animated.createAnimatedComponent(FastImage);
|
|
5
|
-
export default function ImageCore(props) {
|
|
6
|
-
const {
|
|
7
|
-
height,
|
|
8
|
-
onError,
|
|
9
|
-
onLoad,
|
|
10
|
-
resizeMode,
|
|
11
|
-
source,
|
|
12
|
-
width
|
|
13
|
-
} = props;
|
|
14
|
-
const style = {
|
|
15
|
-
width,
|
|
16
|
-
height
|
|
17
|
-
};
|
|
18
|
-
const [opacity] = React.useState(() => new Animated.Value(0));
|
|
19
|
-
|
|
20
|
-
const handleLoad = () => {
|
|
21
|
-
Animated.timing(opacity, {
|
|
22
|
-
toValue: 1,
|
|
23
|
-
duration: 200,
|
|
24
|
-
useNativeDriver: true
|
|
25
|
-
}).start();
|
|
26
|
-
|
|
27
|
-
if (onLoad) {
|
|
28
|
-
onLoad();
|
|
29
|
-
}
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
return /*#__PURE__*/React.createElement(AnimatedFastImage, {
|
|
33
|
-
onError: onError,
|
|
34
|
-
onLoad: handleLoad,
|
|
35
|
-
resizeMode: resizeMode,
|
|
36
|
-
source: {
|
|
37
|
-
uri: source.uri
|
|
38
|
-
},
|
|
39
|
-
style: [style, {
|
|
40
|
-
opacity
|
|
41
|
-
}]
|
|
42
|
-
});
|
|
43
|
-
}
|
|
44
|
-
;
|
|
45
|
-
//# sourceMappingURL=ImageCoreNative.ios.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["React","Animated","FastImage","AnimatedFastImage","createAnimatedComponent","ImageCore","props","height","onError","onLoad","resizeMode","source","width","style","opacity","useState","Value","handleLoad","timing","toValue","duration","useNativeDriver","start","uri"],"sources":["ImageCoreNative.ios.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated } from 'react-native';\nimport FastImage from 'react-native-fast-image';\nimport type ImageCoreProps from './ImageCoreProps';\n\nconst AnimatedFastImage = Animated.createAnimatedComponent(FastImage);\n\nexport default function ImageCore(props: ImageCoreProps) {\n const {\n height,\n onError,\n onLoad,\n resizeMode,\n source,\n width,\n } = props;\n\n const style = { width, height };\n\n const [opacity] = React.useState(() => new Animated.Value(0));\n\n const handleLoad = () => {\n Animated.timing(opacity, {\n toValue: 1,\n duration: 200,\n useNativeDriver: true,\n }).start();\n\n if (onLoad) {\n onLoad();\n }\n };\n\n return (\n <AnimatedFastImage\n onError={onError}\n onLoad={handleLoad}\n resizeMode={resizeMode}\n source={{ uri: source.uri }}\n style={[\n style,\n { opacity },\n ]}\n />\n );\n};\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAT,QAAyB,cAAzB;AACA,OAAOC,SAAP,MAAsB,yBAAtB;AAGA,MAAMC,iBAAiB,GAAGF,QAAQ,CAACG,uBAAT,CAAiCF,SAAjC,CAA1B;AAEA,eAAe,SAASG,SAAT,CAAmBC,KAAnB,EAA0C;EACrD,MAAM;IACFC,MADE;IAEFC,OAFE;IAGFC,MAHE;IAIFC,UAJE;IAKFC,MALE;IAMFC;EANE,IAOFN,KAPJ;EASA,MAAMO,KAAK,GAAG;IAAED,KAAF;IAASL;EAAT,CAAd;EAEA,MAAM,CAACO,OAAD,IAAYd,KAAK,CAACe,QAAN,CAAe,MAAM,IAAId,QAAQ,CAACe,KAAb,CAAmB,CAAnB,CAArB,CAAlB;;EAEA,MAAMC,UAAU,GAAG,MAAM;IACrBhB,QAAQ,CAACiB,MAAT,CAAgBJ,OAAhB,EAAyB;MACrBK,OAAO,EAAE,CADY;MAErBC,QAAQ,EAAE,GAFW;MAGrBC,eAAe,EAAE;IAHI,CAAzB,EAIGC,KAJH;;IAMA,IAAIb,MAAJ,EAAY;MACRA,MAAM;IACT;EACJ,CAVD;;EAYA,oBACI,oBAAC,iBAAD;IACI,OAAO,EAAED,OADb;IAEI,MAAM,EAAES,UAFZ;IAGI,UAAU,EAAEP,UAHhB;IAII,MAAM,EAAE;MAAEa,GAAG,EAAEZ,MAAM,CAACY;IAAd,CAJZ;IAKI,KAAK,EAAE,CACHV,KADG,EAEH;MAAEC;IAAF,CAFG;EALX,EADJ;AAYH;AAAA"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { useWindowDimensions } from 'react-native';
|
|
3
|
-
export default function useWidth() {
|
|
4
|
-
const window = useWindowDimensions();
|
|
5
|
-
const [width, setWidth] = React.useState(window.width);
|
|
6
|
-
const onLayout = React.useCallback(e => {
|
|
7
|
-
const newWidth = e.nativeEvent.layout.width;
|
|
8
|
-
|
|
9
|
-
if (newWidth > 0 && Math.round(newWidth) !== Math.round(width)) {
|
|
10
|
-
setWidth(newWidth);
|
|
11
|
-
}
|
|
12
|
-
}, []);
|
|
13
|
-
return [width, onLayout];
|
|
14
|
-
}
|
|
15
|
-
//# sourceMappingURL=useWidth.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["React","useWindowDimensions","useWidth","window","width","setWidth","useState","onLayout","useCallback","e","newWidth","nativeEvent","layout","Math","round"],"sources":["useWidth.ts"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, useWindowDimensions, ViewProps } from 'react-native';\n\nexport default function useWidth(): [number, ViewProps['onLayout']] {\n const window = useWindowDimensions();\n const [width, setWidth] = React.useState(window.width);\n\n const onLayout = React.useCallback((e: LayoutChangeEvent) => {\n const newWidth = e.nativeEvent.layout.width;\n\n if (newWidth > 0 && Math.round(newWidth) !== Math.round(width)) {\n setWidth(newWidth);\n }\n }, []);\n\n return [width, onLayout];\n}"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAA4BC,mBAA5B,QAAkE,cAAlE;AAEA,eAAe,SAASC,QAAT,GAAqD;EAChE,MAAMC,MAAM,GAAGF,mBAAmB,EAAlC;EACA,MAAM,CAACG,KAAD,EAAQC,QAAR,IAAoBL,KAAK,CAACM,QAAN,CAAeH,MAAM,CAACC,KAAtB,CAA1B;EAEA,MAAMG,QAAQ,GAAGP,KAAK,CAACQ,WAAN,CAAmBC,CAAD,IAA0B;IACzD,MAAMC,QAAQ,GAAGD,CAAC,CAACE,WAAF,CAAcC,MAAd,CAAqBR,KAAtC;;IAEA,IAAIM,QAAQ,GAAG,CAAX,IAAgBG,IAAI,CAACC,KAAL,CAAWJ,QAAX,MAAyBG,IAAI,CAACC,KAAL,CAAWV,KAAX,CAA7C,EAAgE;MAC5DC,QAAQ,CAACK,QAAD,CAAR;IACH;EACJ,CANgB,EAMd,EANc,CAAjB;EAQA,OAAO,CAACN,KAAD,EAAQG,QAAR,CAAP;AACH"}
|