@fountain-ui/core 2.0.0-beta.25 → 2.0.0-beta.26
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.
|
@@ -58,7 +58,7 @@ function ButtonBase(props) {
|
|
|
58
58
|
const scale = (0, _hooks.useAnimatedValue)(ORIGINAL_SCALE);
|
|
59
59
|
(0, _react.useEffect)(() => {
|
|
60
60
|
opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);
|
|
61
|
-
}, [disabled]);
|
|
61
|
+
}, [disabled, pressEffect]);
|
|
62
62
|
const startScaleAnimation = (0, _react.useCallback)((pressIn, isHover) => {
|
|
63
63
|
if (!isHover) {
|
|
64
64
|
startTimingAnimationWithDefaults(scale, pressIn ? MINIFIED_SCALE : ORIGINAL_SCALE);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["ORIGINAL_OPACITY","DISABLED_OPACITY","ACTIVE_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","SCALE_EFFECT_PRESS_IN_DELAY","startTimingAnimationWithDefaults","value","toValue","Animated","timing","duration","useNativeDriver","start","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","styleProp","throttleMillis","otherProps","handlePress","useThrottle","periodMillis","callback","opacity","useAnimatedValue","scale","useEffect","setValue","startScaleAnimation","useCallback","pressIn","isHover","startOpacityAnimation","startPressAnimation","handlePressIn","handlePressOut","animatedStyle","transform","pressDelay","hovered","undefined"],"sources":["ButtonBase.tsx"],"sourcesContent":["import React, { useCallback, useEffect } from 'react';\nimport { Animated } from 'react-native';\nimport { useAnimatedValue, useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\ninterface StartPressAnimation {\n (pressIn: boolean, isHover: boolean): void;\n}\n\nexport const ORIGINAL_OPACITY = 1;\nexport const DISABLED_OPACITY = .3;\nconst ACTIVE_OPACITY = .65;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\n// at \"node_modules/react-native/Libraries/Pressability.js\"\n// const DEFAULT_MIN_PRESS_DURATION = 130;\nconst SCALE_EFFECT_PRESS_IN_DELAY = 130;\n\ntype TimingAnimationValue = Animated.Value | Animated.ValueXY;\ntype TimingAnimationToValue = Animated.TimingAnimationConfig['toValue'];\n\nconst startTimingAnimationWithDefaults = (\n value: TimingAnimationValue,\n toValue: TimingAnimationToValue,\n) => {\n Animated.timing(value, {\n toValue,\n duration: 150,\n useNativeDriver: true,\n }).start();\n};\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n const {\n children,\n disabled = false,\n disableThrottle = false,\n onPress,\n pressEffect = 'opacity',\n style: styleProp,\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 = useAnimatedValue(ORIGINAL_OPACITY);\n const scale = useAnimatedValue(ORIGINAL_SCALE);\n\n useEffect(() => {\n opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);\n }, [disabled]);\n\n const startScaleAnimation = useCallback<StartPressAnimation>((pressIn, isHover) => {\n if (!isHover) {\n startTimingAnimationWithDefaults(\n scale,\n pressIn ? MINIFIED_SCALE : ORIGINAL_SCALE,\n );\n }\n }, []);\n\n const startOpacityAnimation = useCallback<StartPressAnimation>((pressIn) => {\n if (pressIn) {\n opacity.setValue(ACTIVE_OPACITY);\n } else {\n startTimingAnimationWithDefaults(opacity, ORIGINAL_OPACITY);\n }\n }, []);\n\n const startPressAnimation = useCallback<StartPressAnimation>((pressIn, isHover = false) => {\n if (pressEffect === 'scale') {\n startScaleAnimation(pressIn, isHover);\n } else if (pressEffect === 'opacity') {\n startOpacityAnimation(pressIn, isHover);\n }\n }, [pressEffect]);\n\n const handlePressIn = useCallback(() => {\n startPressAnimation(true, false);\n }, [startPressAnimation]);\n\n const handlePressOut = useCallback(() => {\n startPressAnimation(false, false);\n }, [startPressAnimation]);\n\n const animatedStyle = {\n opacity,\n transform: [{ scale }],\n };\n\n const pressDelay = pressEffect === 'scale'\n ? SCALE_EFFECT_PRESS_IN_DELAY\n : 0;\n\n return (\n <AnimatedPressable\n disabled={disabled}\n onPress={handlePress}\n onPressIn={handlePressIn}\n onPressOut={handlePressOut}\n style={[\n animatedStyle,\n styleProp,\n ]}\n unstable_pressDelay={pressDelay}\n {...otherProps}\n >\n {typeof children !== 'function' ? (\n ({ hovered }) => {\n if (hovered !== undefined && !disabled) {\n startPressAnimation(hovered, true);\n }\n\n return children;\n }\n ) : children}\n </AnimatedPressable>\n );\n};\n"],"mappings":";;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;AAOO,MAAMA,gBAAgB,GAAG,CAAzB;;AACA,MAAMC,gBAAgB,GAAG,EAAzB;;AACP,MAAMC,cAAc,GAAG,GAAvB;AAEA,MAAMC,cAAc,GAAG,CAAvB;AACA,MAAMC,cAAc,GAAG,GAAvB,C,CAEA;AACA;;AACA,MAAMC,2BAA2B,GAAG,GAApC;;AAKA,MAAMC,gCAAgC,GAAG,CACrCC,KADqC,EAErCC,OAFqC,KAGpC;EACDC,qBAAA,CAASC,MAAT,CAAgBH,KAAhB,EAAuB;IACnBC,OADmB;IAEnBG,QAAQ,EAAE,GAFS;IAGnBC,eAAe,EAAE;EAHE,CAAvB,EAIGC,KAJH;AAKH,CATD;;AAWe,SAASC,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,QADE;IAEFC,QAAQ,GAAG,KAFT;IAGFC,eAAe,GAAG,KAHhB;IAIFC,OAJE;IAKFC,WAAW,GAAG,SALZ;IAMFC,KAAK,EAAEC,SANL;IAOFC,cAAc,GAAG,GAPf;IAQF,GAAGC;EARD,IASFT,KATJ;EAWA,MAAMU,WAAW,GAAG,IAAAC,kBAAA,EAAY;IAC5BC,YAAY,EAAET,eAAe,GAAG,CAAH,GAAOK,cADR;IAE5BK,QAAQ,EAAET;EAFkB,CAAZ,CAApB;EAKA,MAAMU,OAAO,GAAG,IAAAC,uBAAA,EAAiB9B,gBAAjB,CAAhB;EACA,MAAM+B,KAAK,GAAG,IAAAD,uBAAA,EAAiB3B,cAAjB,CAAd;EAEA,IAAA6B,gBAAA,EAAU,MAAM;IACZH,OAAO,CAACI,QAAR,CAAiBhB,QAAQ,GAAGhB,gBAAH,GAAsBD,gBAA/C;EACH,CAFD,EAEG,CAACiB,QAAD,CAFH;EAIA,
|
|
1
|
+
{"version":3,"names":["ORIGINAL_OPACITY","DISABLED_OPACITY","ACTIVE_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","SCALE_EFFECT_PRESS_IN_DELAY","startTimingAnimationWithDefaults","value","toValue","Animated","timing","duration","useNativeDriver","start","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","styleProp","throttleMillis","otherProps","handlePress","useThrottle","periodMillis","callback","opacity","useAnimatedValue","scale","useEffect","setValue","startScaleAnimation","useCallback","pressIn","isHover","startOpacityAnimation","startPressAnimation","handlePressIn","handlePressOut","animatedStyle","transform","pressDelay","hovered","undefined"],"sources":["ButtonBase.tsx"],"sourcesContent":["import React, { useCallback, useEffect } from 'react';\nimport { Animated } from 'react-native';\nimport { useAnimatedValue, useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\ninterface StartPressAnimation {\n (pressIn: boolean, isHover: boolean): void;\n}\n\nexport const ORIGINAL_OPACITY = 1;\nexport const DISABLED_OPACITY = .3;\nconst ACTIVE_OPACITY = .65;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\n// at \"node_modules/react-native/Libraries/Pressability.js\"\n// const DEFAULT_MIN_PRESS_DURATION = 130;\nconst SCALE_EFFECT_PRESS_IN_DELAY = 130;\n\ntype TimingAnimationValue = Animated.Value | Animated.ValueXY;\ntype TimingAnimationToValue = Animated.TimingAnimationConfig['toValue'];\n\nconst startTimingAnimationWithDefaults = (\n value: TimingAnimationValue,\n toValue: TimingAnimationToValue,\n) => {\n Animated.timing(value, {\n toValue,\n duration: 150,\n useNativeDriver: true,\n }).start();\n};\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n const {\n children,\n disabled = false,\n disableThrottle = false,\n onPress,\n pressEffect = 'opacity',\n style: styleProp,\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 = useAnimatedValue(ORIGINAL_OPACITY);\n const scale = useAnimatedValue(ORIGINAL_SCALE);\n\n useEffect(() => {\n opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);\n }, [disabled, pressEffect]);\n\n const startScaleAnimation = useCallback<StartPressAnimation>((pressIn, isHover) => {\n if (!isHover) {\n startTimingAnimationWithDefaults(\n scale,\n pressIn ? MINIFIED_SCALE : ORIGINAL_SCALE,\n );\n }\n }, []);\n\n const startOpacityAnimation = useCallback<StartPressAnimation>((pressIn) => {\n if (pressIn) {\n opacity.setValue(ACTIVE_OPACITY);\n } else {\n startTimingAnimationWithDefaults(opacity, ORIGINAL_OPACITY);\n }\n }, []);\n\n const startPressAnimation = useCallback<StartPressAnimation>((pressIn, isHover = false) => {\n if (pressEffect === 'scale') {\n startScaleAnimation(pressIn, isHover);\n } else if (pressEffect === 'opacity') {\n startOpacityAnimation(pressIn, isHover);\n }\n }, [pressEffect]);\n\n const handlePressIn = useCallback(() => {\n startPressAnimation(true, false);\n }, [startPressAnimation]);\n\n const handlePressOut = useCallback(() => {\n startPressAnimation(false, false);\n }, [startPressAnimation]);\n\n const animatedStyle = {\n opacity,\n transform: [{ scale }],\n };\n\n const pressDelay = pressEffect === 'scale'\n ? SCALE_EFFECT_PRESS_IN_DELAY\n : 0;\n\n return (\n <AnimatedPressable\n disabled={disabled}\n onPress={handlePress}\n onPressIn={handlePressIn}\n onPressOut={handlePressOut}\n style={[\n animatedStyle,\n styleProp,\n ]}\n unstable_pressDelay={pressDelay}\n {...otherProps}\n >\n {typeof children !== 'function' ? (\n ({ hovered }) => {\n if (hovered !== undefined && !disabled) {\n startPressAnimation(hovered, true);\n }\n\n return children;\n }\n ) : children}\n </AnimatedPressable>\n );\n};\n"],"mappings":";;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;AAOO,MAAMA,gBAAgB,GAAG,CAAzB;;AACA,MAAMC,gBAAgB,GAAG,EAAzB;;AACP,MAAMC,cAAc,GAAG,GAAvB;AAEA,MAAMC,cAAc,GAAG,CAAvB;AACA,MAAMC,cAAc,GAAG,GAAvB,C,CAEA;AACA;;AACA,MAAMC,2BAA2B,GAAG,GAApC;;AAKA,MAAMC,gCAAgC,GAAG,CACrCC,KADqC,EAErCC,OAFqC,KAGpC;EACDC,qBAAA,CAASC,MAAT,CAAgBH,KAAhB,EAAuB;IACnBC,OADmB;IAEnBG,QAAQ,EAAE,GAFS;IAGnBC,eAAe,EAAE;EAHE,CAAvB,EAIGC,KAJH;AAKH,CATD;;AAWe,SAASC,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,QADE;IAEFC,QAAQ,GAAG,KAFT;IAGFC,eAAe,GAAG,KAHhB;IAIFC,OAJE;IAKFC,WAAW,GAAG,SALZ;IAMFC,KAAK,EAAEC,SANL;IAOFC,cAAc,GAAG,GAPf;IAQF,GAAGC;EARD,IASFT,KATJ;EAWA,MAAMU,WAAW,GAAG,IAAAC,kBAAA,EAAY;IAC5BC,YAAY,EAAET,eAAe,GAAG,CAAH,GAAOK,cADR;IAE5BK,QAAQ,EAAET;EAFkB,CAAZ,CAApB;EAKA,MAAMU,OAAO,GAAG,IAAAC,uBAAA,EAAiB9B,gBAAjB,CAAhB;EACA,MAAM+B,KAAK,GAAG,IAAAD,uBAAA,EAAiB3B,cAAjB,CAAd;EAEA,IAAA6B,gBAAA,EAAU,MAAM;IACZH,OAAO,CAACI,QAAR,CAAiBhB,QAAQ,GAAGhB,gBAAH,GAAsBD,gBAA/C;EACH,CAFD,EAEG,CAACiB,QAAD,EAAWG,WAAX,CAFH;EAIA,MAAMc,mBAAmB,GAAG,IAAAC,kBAAA,EAAiC,CAACC,OAAD,EAAUC,OAAV,KAAsB;IAC/E,IAAI,CAACA,OAAL,EAAc;MACV/B,gCAAgC,CAC5ByB,KAD4B,EAE5BK,OAAO,GAAGhC,cAAH,GAAoBD,cAFC,CAAhC;IAIH;EACJ,CAP2B,EAOzB,EAPyB,CAA5B;EASA,MAAMmC,qBAAqB,GAAG,IAAAH,kBAAA,EAAkCC,OAAD,IAAa;IACxE,IAAIA,OAAJ,EAAa;MACTP,OAAO,CAACI,QAAR,CAAiB/B,cAAjB;IACH,CAFD,MAEO;MACHI,gCAAgC,CAACuB,OAAD,EAAU7B,gBAAV,CAAhC;IACH;EACJ,CAN6B,EAM3B,EAN2B,CAA9B;EAQA,MAAMuC,mBAAmB,GAAG,IAAAJ,kBAAA,EAAiC,UAACC,OAAD,EAA8B;IAAA,IAApBC,OAAoB,uEAAV,KAAU;;IACvF,IAAIjB,WAAW,KAAK,OAApB,EAA6B;MACzBc,mBAAmB,CAACE,OAAD,EAAUC,OAAV,CAAnB;IACH,CAFD,MAEO,IAAIjB,WAAW,KAAK,SAApB,EAA+B;MAClCkB,qBAAqB,CAACF,OAAD,EAAUC,OAAV,CAArB;IACH;EACJ,CAN2B,EAMzB,CAACjB,WAAD,CANyB,CAA5B;EAQA,MAAMoB,aAAa,GAAG,IAAAL,kBAAA,EAAY,MAAM;IACpCI,mBAAmB,CAAC,IAAD,EAAO,KAAP,CAAnB;EACH,CAFqB,EAEnB,CAACA,mBAAD,CAFmB,CAAtB;EAIA,MAAME,cAAc,GAAG,IAAAN,kBAAA,EAAY,MAAM;IACrCI,mBAAmB,CAAC,KAAD,EAAQ,KAAR,CAAnB;EACH,CAFsB,EAEpB,CAACA,mBAAD,CAFoB,CAAvB;EAIA,MAAMG,aAAa,GAAG;IAClBb,OADkB;IAElBc,SAAS,EAAE,CAAC;MAAEZ;IAAF,CAAD;EAFO,CAAtB;EAKA,MAAMa,UAAU,GAAGxB,WAAW,KAAK,OAAhB,GACbf,2BADa,GAEb,CAFN;EAIA,oBACI,6BAAC,2BAAD;IACI,QAAQ,EAAEY,QADd;IAEI,OAAO,EAAEQ,WAFb;IAGI,SAAS,EAAEe,aAHf;IAII,UAAU,EAAEC,cAJhB;IAKI,KAAK,EAAE,CACHC,aADG,EAEHpB,SAFG,CALX;IASI,mBAAmB,EAAEsB;EATzB,GAUQpB,UAVR,GAYK,OAAOR,QAAP,KAAoB,UAApB,GACG,QAAiB;IAAA,IAAhB;MAAE6B;IAAF,CAAgB;;IACb,IAAIA,OAAO,KAAKC,SAAZ,IAAyB,CAAC7B,QAA9B,EAAwC;MACpCsB,mBAAmB,CAACM,OAAD,EAAU,IAAV,CAAnB;IACH;;IAED,OAAO7B,QAAP;EACH,CAPJ,GAQGA,QApBR,CADJ;AAwBH;;AAAA"}
|
|
@@ -40,7 +40,7 @@ export default function ButtonBase(props) {
|
|
|
40
40
|
const scale = useAnimatedValue(ORIGINAL_SCALE);
|
|
41
41
|
useEffect(() => {
|
|
42
42
|
opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);
|
|
43
|
-
}, [disabled]);
|
|
43
|
+
}, [disabled, pressEffect]);
|
|
44
44
|
const startScaleAnimation = useCallback((pressIn, isHover) => {
|
|
45
45
|
if (!isHover) {
|
|
46
46
|
startTimingAnimationWithDefaults(scale, pressIn ? MINIFIED_SCALE : ORIGINAL_SCALE);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useCallback","useEffect","Animated","useAnimatedValue","useThrottle","AnimatedPressable","ORIGINAL_OPACITY","DISABLED_OPACITY","ACTIVE_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","SCALE_EFFECT_PRESS_IN_DELAY","startTimingAnimationWithDefaults","value","toValue","timing","duration","useNativeDriver","start","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","styleProp","throttleMillis","otherProps","handlePress","periodMillis","callback","opacity","scale","setValue","startScaleAnimation","pressIn","isHover","startOpacityAnimation","startPressAnimation","handlePressIn","handlePressOut","animatedStyle","transform","pressDelay","hovered","undefined"],"sources":["ButtonBase.tsx"],"sourcesContent":["import React, { useCallback, useEffect } from 'react';\nimport { Animated } from 'react-native';\nimport { useAnimatedValue, useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\ninterface StartPressAnimation {\n (pressIn: boolean, isHover: boolean): void;\n}\n\nexport const ORIGINAL_OPACITY = 1;\nexport const DISABLED_OPACITY = .3;\nconst ACTIVE_OPACITY = .65;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\n// at \"node_modules/react-native/Libraries/Pressability.js\"\n// const DEFAULT_MIN_PRESS_DURATION = 130;\nconst SCALE_EFFECT_PRESS_IN_DELAY = 130;\n\ntype TimingAnimationValue = Animated.Value | Animated.ValueXY;\ntype TimingAnimationToValue = Animated.TimingAnimationConfig['toValue'];\n\nconst startTimingAnimationWithDefaults = (\n value: TimingAnimationValue,\n toValue: TimingAnimationToValue,\n) => {\n Animated.timing(value, {\n toValue,\n duration: 150,\n useNativeDriver: true,\n }).start();\n};\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n const {\n children,\n disabled = false,\n disableThrottle = false,\n onPress,\n pressEffect = 'opacity',\n style: styleProp,\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 = useAnimatedValue(ORIGINAL_OPACITY);\n const scale = useAnimatedValue(ORIGINAL_SCALE);\n\n useEffect(() => {\n opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);\n }, [disabled]);\n\n const startScaleAnimation = useCallback<StartPressAnimation>((pressIn, isHover) => {\n if (!isHover) {\n startTimingAnimationWithDefaults(\n scale,\n pressIn ? MINIFIED_SCALE : ORIGINAL_SCALE,\n );\n }\n }, []);\n\n const startOpacityAnimation = useCallback<StartPressAnimation>((pressIn) => {\n if (pressIn) {\n opacity.setValue(ACTIVE_OPACITY);\n } else {\n startTimingAnimationWithDefaults(opacity, ORIGINAL_OPACITY);\n }\n }, []);\n\n const startPressAnimation = useCallback<StartPressAnimation>((pressIn, isHover = false) => {\n if (pressEffect === 'scale') {\n startScaleAnimation(pressIn, isHover);\n } else if (pressEffect === 'opacity') {\n startOpacityAnimation(pressIn, isHover);\n }\n }, [pressEffect]);\n\n const handlePressIn = useCallback(() => {\n startPressAnimation(true, false);\n }, [startPressAnimation]);\n\n const handlePressOut = useCallback(() => {\n startPressAnimation(false, false);\n }, [startPressAnimation]);\n\n const animatedStyle = {\n opacity,\n transform: [{ scale }],\n };\n\n const pressDelay = pressEffect === 'scale'\n ? SCALE_EFFECT_PRESS_IN_DELAY\n : 0;\n\n return (\n <AnimatedPressable\n disabled={disabled}\n onPress={handlePress}\n onPressIn={handlePressIn}\n onPressOut={handlePressOut}\n style={[\n animatedStyle,\n styleProp,\n ]}\n unstable_pressDelay={pressDelay}\n {...otherProps}\n >\n {typeof children !== 'function' ? (\n ({ hovered }) => {\n if (hovered !== undefined && !disabled) {\n startPressAnimation(hovered, true);\n }\n\n return children;\n }\n ) : children}\n </AnimatedPressable>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,WAAhB,EAA6BC,SAA7B,QAA8C,OAA9C;AACA,SAASC,QAAT,QAAyB,cAAzB;AACA,SAASC,gBAAT,EAA2BC,WAA3B,QAA8C,UAA9C;AACA,SAASC,iBAAT,QAAkC,aAAlC;AAOA,OAAO,MAAMC,gBAAgB,GAAG,CAAzB;AACP,OAAO,MAAMC,gBAAgB,GAAG,EAAzB;AACP,MAAMC,cAAc,GAAG,GAAvB;AAEA,MAAMC,cAAc,GAAG,CAAvB;AACA,MAAMC,cAAc,GAAG,GAAvB,C,CAEA;AACA;;AACA,MAAMC,2BAA2B,GAAG,GAApC;;AAKA,MAAMC,gCAAgC,GAAG,CACrCC,KADqC,EAErCC,OAFqC,KAGpC;EACDZ,QAAQ,CAACa,MAAT,CAAgBF,KAAhB,EAAuB;IACnBC,OADmB;IAEnBE,QAAQ,EAAE,GAFS;IAGnBC,eAAe,EAAE;EAHE,CAAvB,EAIGC,KAJH;AAKH,CATD;;AAWA,eAAe,SAASC,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,QADE;IAEFC,QAAQ,GAAG,KAFT;IAGFC,eAAe,GAAG,KAHhB;IAIFC,OAJE;IAKFC,WAAW,GAAG,SALZ;IAMFC,KAAK,EAAEC,SANL;IAOFC,cAAc,GAAG,GAPf;IAQF,GAAGC;EARD,IASFT,KATJ;EAWA,MAAMU,WAAW,GAAG1B,WAAW,CAAC;IAC5B2B,YAAY,EAAER,eAAe,GAAG,CAAH,GAAOK,cADR;IAE5BI,QAAQ,EAAER;EAFkB,CAAD,CAA/B;EAKA,MAAMS,OAAO,GAAG9B,gBAAgB,CAACG,gBAAD,CAAhC;EACA,MAAM4B,KAAK,GAAG/B,gBAAgB,CAACM,cAAD,CAA9B;EAEAR,SAAS,CAAC,MAAM;IACZgC,OAAO,CAACE,QAAR,CAAiBb,QAAQ,GAAGf,gBAAH,GAAsBD,gBAA/C;EACH,CAFQ,EAEN,CAACgB,QAAD,CAFM,CAAT;EAIA,
|
|
1
|
+
{"version":3,"names":["React","useCallback","useEffect","Animated","useAnimatedValue","useThrottle","AnimatedPressable","ORIGINAL_OPACITY","DISABLED_OPACITY","ACTIVE_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","SCALE_EFFECT_PRESS_IN_DELAY","startTimingAnimationWithDefaults","value","toValue","timing","duration","useNativeDriver","start","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","styleProp","throttleMillis","otherProps","handlePress","periodMillis","callback","opacity","scale","setValue","startScaleAnimation","pressIn","isHover","startOpacityAnimation","startPressAnimation","handlePressIn","handlePressOut","animatedStyle","transform","pressDelay","hovered","undefined"],"sources":["ButtonBase.tsx"],"sourcesContent":["import React, { useCallback, useEffect } from 'react';\nimport { Animated } from 'react-native';\nimport { useAnimatedValue, useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\ninterface StartPressAnimation {\n (pressIn: boolean, isHover: boolean): void;\n}\n\nexport const ORIGINAL_OPACITY = 1;\nexport const DISABLED_OPACITY = .3;\nconst ACTIVE_OPACITY = .65;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\n// at \"node_modules/react-native/Libraries/Pressability.js\"\n// const DEFAULT_MIN_PRESS_DURATION = 130;\nconst SCALE_EFFECT_PRESS_IN_DELAY = 130;\n\ntype TimingAnimationValue = Animated.Value | Animated.ValueXY;\ntype TimingAnimationToValue = Animated.TimingAnimationConfig['toValue'];\n\nconst startTimingAnimationWithDefaults = (\n value: TimingAnimationValue,\n toValue: TimingAnimationToValue,\n) => {\n Animated.timing(value, {\n toValue,\n duration: 150,\n useNativeDriver: true,\n }).start();\n};\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n const {\n children,\n disabled = false,\n disableThrottle = false,\n onPress,\n pressEffect = 'opacity',\n style: styleProp,\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 = useAnimatedValue(ORIGINAL_OPACITY);\n const scale = useAnimatedValue(ORIGINAL_SCALE);\n\n useEffect(() => {\n opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);\n }, [disabled, pressEffect]);\n\n const startScaleAnimation = useCallback<StartPressAnimation>((pressIn, isHover) => {\n if (!isHover) {\n startTimingAnimationWithDefaults(\n scale,\n pressIn ? MINIFIED_SCALE : ORIGINAL_SCALE,\n );\n }\n }, []);\n\n const startOpacityAnimation = useCallback<StartPressAnimation>((pressIn) => {\n if (pressIn) {\n opacity.setValue(ACTIVE_OPACITY);\n } else {\n startTimingAnimationWithDefaults(opacity, ORIGINAL_OPACITY);\n }\n }, []);\n\n const startPressAnimation = useCallback<StartPressAnimation>((pressIn, isHover = false) => {\n if (pressEffect === 'scale') {\n startScaleAnimation(pressIn, isHover);\n } else if (pressEffect === 'opacity') {\n startOpacityAnimation(pressIn, isHover);\n }\n }, [pressEffect]);\n\n const handlePressIn = useCallback(() => {\n startPressAnimation(true, false);\n }, [startPressAnimation]);\n\n const handlePressOut = useCallback(() => {\n startPressAnimation(false, false);\n }, [startPressAnimation]);\n\n const animatedStyle = {\n opacity,\n transform: [{ scale }],\n };\n\n const pressDelay = pressEffect === 'scale'\n ? SCALE_EFFECT_PRESS_IN_DELAY\n : 0;\n\n return (\n <AnimatedPressable\n disabled={disabled}\n onPress={handlePress}\n onPressIn={handlePressIn}\n onPressOut={handlePressOut}\n style={[\n animatedStyle,\n styleProp,\n ]}\n unstable_pressDelay={pressDelay}\n {...otherProps}\n >\n {typeof children !== 'function' ? (\n ({ hovered }) => {\n if (hovered !== undefined && !disabled) {\n startPressAnimation(hovered, true);\n }\n\n return children;\n }\n ) : children}\n </AnimatedPressable>\n );\n};\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fountain-ui/core",
|
|
3
|
-
"version": "2.0.0-beta.
|
|
3
|
+
"version": "2.0.0-beta.26",
|
|
4
4
|
"author": "Fountain-UI Team",
|
|
5
5
|
"description": "React components that implement Tappytoon's Fountain Design.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"access": "public"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "5d8b55fc97c2848d3d37b07350433446a5dfc7e5"
|
|
71
71
|
}
|
|
@@ -55,7 +55,7 @@ export default function ButtonBase(props: ButtonBaseProps) {
|
|
|
55
55
|
|
|
56
56
|
useEffect(() => {
|
|
57
57
|
opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);
|
|
58
|
-
}, [disabled]);
|
|
58
|
+
}, [disabled, pressEffect]);
|
|
59
59
|
|
|
60
60
|
const startScaleAnimation = useCallback<StartPressAnimation>((pressIn, isHover) => {
|
|
61
61
|
if (!isHover) {
|