@fountain-ui/core 1.11.2 → 1.11.3

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.11.3](https://github.com/tappytoon/tappytoon/compare/@fountain-ui/core@1.11.0...@fountain-ui/core@1.11.3) (2021-10-06)
+
+**Note:** Version bump only for package @fountain-ui/core
+
+
+
+
+
 ## [1.11.2](https://github.com/tappytoon/tappytoon/compare/@fountain-ui/core@1.11.0...@fountain-ui/core@1.11.2) (2021-10-01)
 
 **Note:** Version bump only for package @fountain-ui/core

package/build/commonjs/ButtonBase/ButtonBase.js

@@ -13,6 +13,8 @@ var _hooks = require("../hooks");
 
 var _animated = require("../animated");
 
+var _styles = require("../styles");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _extends() { _extends = Object.assign || 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); }
@@ -26,6 +28,15 @@ const animationTimingConfig = {
   duration: 150
 };
 
+const styles = _styles.StyleSheet.create({
+  disabled: {
+    opacity: DISABLED_OPACITY,
+    transform: [{
+      scale: ORIGINAL_SCALE
+    }]
+  }
+});
+
 function ButtonBase(props) {
   const {
     children,
@@ -47,13 +58,13 @@ function ButtonBase(props) {
   const scale = _reactNativeReanimated.default.useSharedValue(ORIGINAL_SCALE);
 
   const animatedStyle = _reactNativeReanimated.default.useAnimatedStyle(() => ({
-    opacity: disabled ? DISABLED_OPACITY : opacity.value,
+    opacity: opacity.value,
     transform: [{
-      scale: disabled ? ORIGINAL_SCALE : scale.value
+      scale: scale.value
     }]
   }));
 
-  const startAnimation = _react.default.useCallback((pressIn, isHovered = false) => {
+  const startAnimation = (pressIn, isHovered = false) => {
     if (pressEffect === 'none') {
       return;
     }
@@ -71,14 +82,14 @@ function ButtonBase(props) {
         scale.value = _reactNativeReanimated.default.withTiming(ORIGINAL_SCALE, animationTimingConfig);
       }
     }
-  }, [pressEffect]);
+  };
 
   return /*#__PURE__*/_react.default.createElement(_animated.AnimatedPressable, _extends({
     disabled: disabled,
     onPress: handlePress,
     onPressIn: () => startAnimation(true),
     onPressOut: () => startAnimation(false),
-    style: [animatedStyle, style]
+    style: [animatedStyle, disabled ? styles.disabled : undefined, style]
   }, otherProps), typeof children !== 'function' ? ({
     hovered
   }) => {

package/build/commonjs/ButtonBase/ButtonBase.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ButtonBase.tsx"],"names":["ORIGINAL_OPACITY","ACTIVE_OPACITY","DISABLED_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","animationTimingConfig","duration","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","periodMillis","callback","opacity","Animated","useSharedValue","scale","animatedStyle","useAnimatedStyle","value","transform","startAnimation","React","useCallback","pressIn","isHovered","withTiming","withDelay","hovered","undefined"],"mappings":"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","sourcesContent":["import React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\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 animationTimingConfig: Animated.WithTimingConfig = { duration: 150 };\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 = Animated.useSharedValue(ORIGINAL_OPACITY);\n    const scale = Animated.useSharedValue(ORIGINAL_SCALE);\n\n    const animatedStyle = Animated.useAnimatedStyle(() => ({\n        opacity: disabled ? DISABLED_OPACITY : opacity.value,\n        transform: [{ scale: disabled ? ORIGINAL_SCALE : scale.value }],\n    }));\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                opacity.value = ACTIVE_OPACITY;\n            } else {\n                opacity.value = Animated.withTiming(ORIGINAL_OPACITY, animationTimingConfig);\n            }\n        } else if (!isHovered) {\n            if (pressIn) {\n                scale.value = Animated.withDelay(\n                    100,\n                    Animated.withTiming(MINIFIED_SCALE, animationTimingConfig),\n                );\n            } else {\n                scale.value = Animated.withTiming(ORIGINAL_SCALE, animationTimingConfig);\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={[animatedStyle, style]}\n            {...otherProps}\n        >\n            {typeof children !== 'function' ? (\n                ({ hovered }) => {\n                    if (hovered !== undefined) {\n                        startAnimation(hovered, true);\n                    }\n\n                    return children;\n                }\n            ) : children}\n        </AnimatedPressable>\n    );\n};\n"]}
+{"version":3,"sources":["ButtonBase.tsx"],"names":["ORIGINAL_OPACITY","ACTIVE_OPACITY","DISABLED_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","animationTimingConfig","duration","styles","StyleSheet","create","disabled","opacity","transform","scale","ButtonBase","props","children","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","periodMillis","callback","Animated","useSharedValue","animatedStyle","useAnimatedStyle","value","startAnimation","pressIn","isHovered","withTiming","withDelay","undefined","hovered"],"mappings":"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","sourcesContent":["import React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport { StyleSheet } from '../styles';\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 animationTimingConfig: Animated.WithTimingConfig = { duration: 150 };\n\nconst styles = StyleSheet.create({\n    disabled: {\n        opacity: DISABLED_OPACITY,\n        transform: [{ scale: ORIGINAL_SCALE }],\n    },\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,\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 = Animated.useSharedValue(ORIGINAL_OPACITY);\n    const scale = Animated.useSharedValue(ORIGINAL_SCALE);\n\n    const animatedStyle = Animated.useAnimatedStyle(() => ({\n        opacity: opacity.value,\n        transform: [{ scale: scale.value }],\n    }));\n\n    const startAnimation = (pressIn: boolean, isHovered: boolean = false) => {\n        if (pressEffect === 'none') {\n            return;\n        }\n\n        if (pressEffect === 'opacity') {\n            if (pressIn) {\n                opacity.value = ACTIVE_OPACITY;\n            } else {\n                opacity.value = Animated.withTiming(ORIGINAL_OPACITY, animationTimingConfig);\n            }\n        } else if (!isHovered) {\n            if (pressIn) {\n                scale.value = Animated.withDelay(\n                    100,\n                    Animated.withTiming(MINIFIED_SCALE, animationTimingConfig),\n                );\n            } else {\n                scale.value = Animated.withTiming(ORIGINAL_SCALE, animationTimingConfig);\n            }\n        }\n    };\n\n    return (\n        <AnimatedPressable\n            disabled={disabled}\n            onPress={handlePress}\n            onPressIn={() => startAnimation(true)}\n            onPressOut={() => startAnimation(false)}\n            style={[\n                animatedStyle,\n                disabled ? styles.disabled : undefined,\n                style,\n            ]}\n            {...otherProps}\n        >\n            {typeof children !== 'function' ? (\n                ({ hovered }) => {\n                    if (hovered !== undefined) {\n                        startAnimation(hovered, true);\n                    }\n\n                    return children;\n                }\n            ) : children}\n        </AnimatedPressable>\n    );\n};\n"]}

package/build/commonjs/Link/Link.js

@@ -19,12 +19,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 function _extends() { _extends = Object.assign || 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); }
 
-function preventDefault(event) {
-  if (_reactNative.Platform.OS === 'web') {
-    event.preventDefault();
-  }
-}
-
 const useStyles = function () {
   return {
     root: {},
@@ -46,6 +40,10 @@ function Link(props) {
   const styles = useStyles();
 
   const handlePress = async event => {
+    if (_reactNative.Platform.OS === 'web') {
+      event.preventDefault();
+    }
+
     if (onPress) {
       onPress(event);
       return;
@@ -58,7 +56,7 @@ function Link(props) {
 
   return /*#__PURE__*/_react.default.createElement(_Pressable.default, {
     disabled: disabled,
-    onPress: handlePress,
+    onPress: _reactNative.Platform.OS === 'web' ? undefined : handlePress,
     style: (0, _styles.css)([styles.root, style])
   }, ({
     hovered
@@ -67,7 +65,7 @@ function Link(props) {
     return /*#__PURE__*/_react.default.createElement(_Typography.default, _extends({
       href: href,
       style: underlineStyle,
-      onPress: preventDefault
+      onPress: _reactNative.Platform.OS === 'web' ? handlePress : undefined
     }, otherProps));
   });
 }

package/build/commonjs/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Link.tsx"],"names":["preventDefault","event","Platform","OS","useStyles","root","underline","textDecorationLine","Link","props","disabled","href","onPress","style","otherProps","styles","handlePress","Linking","canOpenURL","openURL","hovered","underlineStyle","undefined"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;AAKA,SAASA,cAAT,CAAwBC,KAAxB,EAAsD;AAClD,MAAIC,sBAASC,EAAT,KAAgB,KAApB,EAA2B;AACvBF,IAAAA,KAAK,CAACD,cAAN;AACH;AACJ;;AAED,MAAMI,SAAgC,GAAG,YAAwB;AAC7D,SAAO;AACHC,IAAAA,IAAI,EAAE,EADH;AAEHC,IAAAA,SAAS,EAAE;AACPC,MAAAA,kBAAkB,EAAE;AADb;AAFR,GAAP;AAMH,CAPD;;AASe,SAASC,IAAT,CAAcC,KAAd,EAAgC;AAC3C,QAAM;AACFC,IAAAA,QAAQ,GAAG,KADT;AAEFC,IAAAA,IAFE;AAGFC,IAAAA,OAHE;AAIFC,IAAAA,KAJE;AAKFP,IAAAA,SAAS,GAAG,QALV;AAMF,OAAGQ;AAND,MAOFL,KAPJ;AASA,QAAMM,MAAM,GAAGX,SAAS,EAAxB;;AAEA,QAAMY,WAAW,GAAG,MAAOf,KAAP,IAAwC;AACxD,QAAIW,OAAJ,EAAa;AACTA,MAAAA,OAAO,CAACX,KAAD,CAAP;AACA;AACH;;AAED,QAAI,MAAMgB,qBAAQC,UAAR,CAAmBP,IAAnB,CAAV,EAAoC;AAChC,YAAMM,qBAAQE,OAAR,CAAgBR,IAAhB,CAAN;AACH;AACJ,GATD;;AAWA,sBACI,6BAAC,kBAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,OAAO,EAAEM,WAFb;AAGI,IAAA,KAAK,EAAE,iBAAI,CAACD,MAAM,CAACV,IAAR,EAAcQ,KAAd,CAAJ;AAHX,KAKK,CAAC;AAAEO,IAAAA;AAAF,GAAD,KAAiB;AACd,UAAMC,cAAc,GAAIf,SAAS,KAAK,QAAd,IAA2BA,SAAS,KAAK,OAAd,IAAyBc,OAArD,GACjBL,MAAM,CAACT,SADU,GAEjBgB,SAFN;AAIA,wBACI,6BAAC,mBAAD;AACI,MAAA,IAAI,EAAEX,IADV;AAEI,MAAA,KAAK,EAAEU,cAFX;AAGI,MAAA,OAAO,EAAErB;AAHb,OAIQc,UAJR,EADJ;AAQH,GAlBL,CADJ;AAsBH;;AAAA","sourcesContent":["import React from 'react';\nimport { GestureResponderEvent, Linking, Platform } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Pressable from '../Pressable';\nimport Typography from '../Typography';\nimport { css } from '../styles';\nimport type LinkProps from './LinkProps';\n\ntype LinkStyles = NamedStylesStringUnion<'root' | 'underline'>;\n\nfunction preventDefault(event: GestureResponderEvent) {\n    if (Platform.OS === 'web') {\n        event.preventDefault();\n    }\n}\n\nconst useStyles: UseStyles<LinkStyles> = function (): LinkStyles {\n    return {\n        root: {},\n        underline: {\n            textDecorationLine: 'underline',\n        },\n    };\n};\n\nexport default function Link(props: LinkProps) {\n    const {\n        disabled = false,\n        href,\n        onPress,\n        style,\n        underline = 'always',\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const handlePress = async (event: GestureResponderEvent) => {\n        if (onPress) {\n            onPress(event);\n            return;\n        }\n\n        if (await Linking.canOpenURL(href)) {\n            await Linking.openURL(href);\n        }\n    };\n\n    return (\n        <Pressable\n            disabled={disabled}\n            onPress={handlePress}\n            style={css([styles.root, style])}\n        >\n            {({ hovered }) => {\n                const underlineStyle = (underline === 'always' || (underline === 'hover' && hovered))\n                    ? styles.underline\n                    : undefined;\n\n                return (\n                    <Typography\n                        href={href}\n                        style={underlineStyle}\n                        onPress={preventDefault}\n                        {...otherProps}\n                    />\n                );\n            }}\n        </Pressable>\n    );\n};\n"]}
+{"version":3,"sources":["Link.tsx"],"names":["useStyles","root","underline","textDecorationLine","Link","props","disabled","href","onPress","style","otherProps","styles","handlePress","event","Platform","OS","preventDefault","Linking","canOpenURL","openURL","undefined","hovered","underlineStyle"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAAgC,GAAG,YAAwB;AAC7D,SAAO;AACHC,IAAAA,IAAI,EAAE,EADH;AAEHC,IAAAA,SAAS,EAAE;AACPC,MAAAA,kBAAkB,EAAE;AADb;AAFR,GAAP;AAMH,CAPD;;AASe,SAASC,IAAT,CAAcC,KAAd,EAAgC;AAC3C,QAAM;AACFC,IAAAA,QAAQ,GAAG,KADT;AAEFC,IAAAA,IAFE;AAGFC,IAAAA,OAHE;AAIFC,IAAAA,KAJE;AAKFP,IAAAA,SAAS,GAAG,QALV;AAMF,OAAGQ;AAND,MAOFL,KAPJ;AASA,QAAMM,MAAM,GAAGX,SAAS,EAAxB;;AAEA,QAAMY,WAAW,GAAG,MAAOC,KAAP,IAAwC;AACxD,QAAIC,sBAASC,EAAT,KAAgB,KAApB,EAA2B;AACvBF,MAAAA,KAAK,CAACG,cAAN;AACH;;AAED,QAAIR,OAAJ,EAAa;AACTA,MAAAA,OAAO,CAACK,KAAD,CAAP;AACA;AACH;;AAED,QAAI,MAAMI,qBAAQC,UAAR,CAAmBX,IAAnB,CAAV,EAAoC;AAChC,YAAMU,qBAAQE,OAAR,CAAgBZ,IAAhB,CAAN;AACH;AACJ,GAbD;;AAeA,sBACI,6BAAC,kBAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,OAAO,EAAEQ,sBAASC,EAAT,KAAgB,KAAhB,GAAwBK,SAAxB,GAAoCR,WAFjD;AAGI,IAAA,KAAK,EAAE,iBAAI,CAACD,MAAM,CAACV,IAAR,EAAcQ,KAAd,CAAJ;AAHX,KAKK,CAAC;AAAEY,IAAAA;AAAF,GAAD,KAAiB;AACd,UAAMC,cAAc,GAAIpB,SAAS,KAAK,QAAd,IAA2BA,SAAS,KAAK,OAAd,IAAyBmB,OAArD,GACjBV,MAAM,CAACT,SADU,GAEjBkB,SAFN;AAIA,wBACI,6BAAC,mBAAD;AACI,MAAA,IAAI,EAAEb,IADV;AAEI,MAAA,KAAK,EAAEe,cAFX;AAGI,MAAA,OAAO,EAAER,sBAASC,EAAT,KAAgB,KAAhB,GAAwBH,WAAxB,GAAsCQ;AAHnD,OAIQV,UAJR,EADJ;AAQH,GAlBL,CADJ;AAsBH;;AAAA","sourcesContent":["import React from 'react';\nimport { GestureResponderEvent, Linking, Platform } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Pressable from '../Pressable';\nimport Typography from '../Typography';\nimport { css } from '../styles';\nimport type LinkProps from './LinkProps';\n\ntype LinkStyles = NamedStylesStringUnion<'root' | 'underline'>;\n\nconst useStyles: UseStyles<LinkStyles> = function (): LinkStyles {\n    return {\n        root: {},\n        underline: {\n            textDecorationLine: 'underline',\n        },\n    };\n};\n\nexport default function Link(props: LinkProps) {\n    const {\n        disabled = false,\n        href,\n        onPress,\n        style,\n        underline = 'always',\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const handlePress = async (event: GestureResponderEvent) => {\n        if (Platform.OS === 'web') {\n            event.preventDefault();\n        }\n\n        if (onPress) {\n            onPress(event);\n            return;\n        }\n\n        if (await Linking.canOpenURL(href)) {\n            await Linking.openURL(href);\n        }\n    };\n\n    return (\n        <Pressable\n            disabled={disabled}\n            onPress={Platform.OS === 'web' ? undefined : handlePress}\n            style={css([styles.root, style])}\n        >\n            {({ hovered }) => {\n                const underlineStyle = (underline === 'always' || (underline === 'hover' && hovered))\n                    ? styles.underline\n                    : undefined;\n\n                return (\n                    <Typography\n                        href={href}\n                        style={underlineStyle}\n                        onPress={Platform.OS === 'web' ? handlePress : undefined}\n                        {...otherProps}\n                    />\n                );\n            }}\n        </Pressable>\n    );\n};\n"]}

package/build/commonjs/Tab/Tab.js

@@ -60,10 +60,10 @@ function Tab(props) {
   return /*#__PURE__*/_react.default.createElement(_TabBase.default, _extends({
     vertical: vertical,
     style: tabBaseStyle
-  }, otherProps), iconElement && badgeVisible ? /*#__PURE__*/_react.default.createElement(_Badge.default, {
+  }, otherProps), /*#__PURE__*/_react.default.createElement(_Badge.default, {
     children: iconElement,
-    invisible: false
-  }) : iconElement, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    invisible: !badgeVisible
+  }), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
     children: children,
     style: (0, _styles.css)(fontStyle)
   }), enableIndicator ? /*#__PURE__*/_react.default.createElement(_TabIndicator.default, null) : null);

package/build/commonjs/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Tab.tsx"],"names":["styles","StyleSheet","create","primary","minHeight","secondary","bottomNavigation","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","selected","selectedIcon","variant","style","otherProps","theme","vertical","color","palette","text","hint","tabBaseStyle","fontStyle","selector","typo","h2","button2","flag","iconElement","React","cloneElement","fill"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;AAEA,MAAMA,MAAM,GAAGC,mBAAWC,MAAX,CAAkB;AAC7BC,EAAAA,OAAO,EAAE;AACLC,IAAAA,SAAS,EAAE;AADN,GADoB;AAI7BC,EAAAA,SAAS,EAAE;AACPD,IAAAA,SAAS,EAAE;AADJ,GAJkB;AAO7BE,EAAAA,gBAAgB,EAAE;AACdF,IAAAA,SAAS,EAAE;AADG;AAPW,CAAlB,CAAf;;AAYe,SAASG,GAAT,CAAaC,KAAb,EAA8B;AACzC,QAAM;AACFC,IAAAA,YAAY,GAAG,KADb;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,eAHE;AAIFC,IAAAA,IAAI,EAAEC,WAJJ;AAKFC,IAAAA,QALE;AAMFC,IAAAA,YANE;AAOFC,IAAAA,OAAO,GAAG,SAPR;AAQFC,IAAAA,KARE;AASF,OAAGC;AATD,MAUFV,KAVJ;AAYA,QAAMW,KAAK,GAAG,uBAAd;AAEA,QAAMC,QAAQ,GAAGJ,OAAO,KAAK,mBAA7B;AAEA,QAAMK,KAAK,GAAGP,QAAQ,GAAGK,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBpB,OAAtB,GAAgCgB,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBC,IAAzE;AAEA,QAAMC,YAAY,GAAG,iBAAI,CACrBT,OAAO,KAAK,SAAZ,GACMhB,MAAM,CAACG,OADb,GAEOa,OAAO,KAAK,WAAZ,GAA0BhB,MAAM,CAACK,SAAjC,GAA6CL,MAAM,CAACM,gBAHtC,EAIrBW,KAJqB,CAAJ,CAArB;AAOA,QAAMS,SAAS,GAAG,6BAAgBP,KAAhB,EAAuB;AACrCQ,IAAAA,QAAQ,EAAGC,IAAD,IAAUZ,OAAO,KAAK,SAAZ,GACdY,IAAI,CAACC,EADS,GAEbb,OAAO,KAAK,WAAZ,GAA0BY,IAAI,CAACE,OAA/B,GAAyCF,IAAI,CAACG,IAHhB;AAIrCV,IAAAA;AAJqC,GAAvB,CAAlB;AAOA,QAAMT,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;AACA,QAAMmB,WAAW,GAAGpB,IAAI,gBAAGqB,eAAMC,YAAN,CAAmBtB,IAAnB,EAAyB;AAAEuB,IAAAA,IAAI,EAAEd;AAAR,GAAzB,CAAH,GAA+C,IAAvE;AAEA,sBACI,6BAAC,gBAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,KAAK,EAAEK;AAFX,KAGQP,UAHR,GAKKc,WAAW,IAAIvB,YAAf,gBACG,6BAAC,cAAD;AACI,IAAA,QAAQ,EAAEuB,WADd;AAEI,IAAA,SAAS,EAAE;AAFf,IADH,GAKGA,WAVR,eAYI,6BAAC,iBAAD;AACI,IAAA,QAAQ,EAAEtB,QADd;AAEI,IAAA,KAAK,EAAE,iBAAIgB,SAAJ;AAFX,IAZJ,EAiBKf,eAAe,gBAAG,6BAAC,qBAAD,OAAH,GAAqB,IAjBzC,CADJ;AAqBH;;AAAA","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport type TabProps from './TabProps';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport TabIndicator from './TabIndicator';\n\nconst styles = StyleSheet.create({\n    primary: {\n        minHeight: 48,\n    },\n    secondary: {\n        minHeight: 48,\n    },\n    bottomNavigation: {\n        minHeight: 56,\n    },\n});\n\nexport default function Tab(props: TabProps) {\n    const {\n        badgeVisible = false,\n        children,\n        enableIndicator,\n        icon: defaultIcon,\n        selected,\n        selectedIcon,\n        variant = 'primary',\n        style,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const vertical = variant === 'bottom-navigation';\n\n    const color = selected ? theme.palette.text.primary : theme.palette.text.hint;\n\n    const tabBaseStyle = css([\n        variant === 'primary'\n            ? styles.primary\n            : (variant === 'secondary' ? styles.secondary : styles.bottomNavigation),\n        style,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => variant === 'primary'\n            ? typo.h2\n            : (variant === 'secondary' ? typo.button2 : typo.flag),\n        color,\n    });\n\n    const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n    const iconElement = icon ? React.cloneElement(icon, { fill: color }) : null;\n\n    return (\n        <TabBase\n            vertical={vertical}\n            style={tabBaseStyle}\n            {...otherProps}\n        >\n            {iconElement && badgeVisible ? (\n                <Badge\n                    children={iconElement}\n                    invisible={false}\n                />\n            ) : iconElement}\n\n            <Text\n                children={children}\n                style={css(fontStyle)}\n            />\n\n            {enableIndicator ? <TabIndicator/> : null}\n        </TabBase>\n    );\n};\n"]}
+{"version":3,"sources":["Tab.tsx"],"names":["styles","StyleSheet","create","primary","minHeight","secondary","bottomNavigation","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","selected","selectedIcon","variant","style","otherProps","theme","vertical","color","palette","text","hint","tabBaseStyle","fontStyle","selector","typo","h2","button2","flag","iconElement","React","cloneElement","fill"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;AAEA,MAAMA,MAAM,GAAGC,mBAAWC,MAAX,CAAkB;AAC7BC,EAAAA,OAAO,EAAE;AACLC,IAAAA,SAAS,EAAE;AADN,GADoB;AAI7BC,EAAAA,SAAS,EAAE;AACPD,IAAAA,SAAS,EAAE;AADJ,GAJkB;AAO7BE,EAAAA,gBAAgB,EAAE;AACdF,IAAAA,SAAS,EAAE;AADG;AAPW,CAAlB,CAAf;;AAYe,SAASG,GAAT,CAAaC,KAAb,EAA8B;AACzC,QAAM;AACFC,IAAAA,YAAY,GAAG,KADb;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,eAHE;AAIFC,IAAAA,IAAI,EAAEC,WAJJ;AAKFC,IAAAA,QALE;AAMFC,IAAAA,YANE;AAOFC,IAAAA,OAAO,GAAG,SAPR;AAQFC,IAAAA,KARE;AASF,OAAGC;AATD,MAUFV,KAVJ;AAYA,QAAMW,KAAK,GAAG,uBAAd;AAEA,QAAMC,QAAQ,GAAGJ,OAAO,KAAK,mBAA7B;AAEA,QAAMK,KAAK,GAAGP,QAAQ,GAAGK,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBpB,OAAtB,GAAgCgB,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBC,IAAzE;AAEA,QAAMC,YAAY,GAAG,iBAAI,CACrBT,OAAO,KAAK,SAAZ,GACMhB,MAAM,CAACG,OADb,GAEOa,OAAO,KAAK,WAAZ,GAA0BhB,MAAM,CAACK,SAAjC,GAA6CL,MAAM,CAACM,gBAHtC,EAIrBW,KAJqB,CAAJ,CAArB;AAOA,QAAMS,SAAS,GAAG,6BAAgBP,KAAhB,EAAuB;AACrCQ,IAAAA,QAAQ,EAAGC,IAAD,IAAUZ,OAAO,KAAK,SAAZ,GACdY,IAAI,CAACC,EADS,GAEbb,OAAO,KAAK,WAAZ,GAA0BY,IAAI,CAACE,OAA/B,GAAyCF,IAAI,CAACG,IAHhB;AAIrCV,IAAAA;AAJqC,GAAvB,CAAlB;AAOA,QAAMT,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;AACA,QAAMmB,WAAW,GAAGpB,IAAI,gBAAGqB,eAAMC,YAAN,CAAmBtB,IAAnB,EAAyB;AAAEuB,IAAAA,IAAI,EAAEd;AAAR,GAAzB,CAAH,GAA+C,IAAvE;AAEA,sBACI,6BAAC,gBAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,KAAK,EAAEK;AAFX,KAGQP,UAHR,gBAKI,6BAAC,cAAD;AACI,IAAA,QAAQ,EAAEc,WADd;AAEI,IAAA,SAAS,EAAE,CAACvB;AAFhB,IALJ,eAUI,6BAAC,iBAAD;AACI,IAAA,QAAQ,EAAEC,QADd;AAEI,IAAA,KAAK,EAAE,iBAAIgB,SAAJ;AAFX,IAVJ,EAeKf,eAAe,gBAAG,6BAAC,qBAAD,OAAH,GAAqB,IAfzC,CADJ;AAmBH;;AAAA","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport type TabProps from './TabProps';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport TabIndicator from './TabIndicator';\n\nconst styles = StyleSheet.create({\n    primary: {\n        minHeight: 48,\n    },\n    secondary: {\n        minHeight: 48,\n    },\n    bottomNavigation: {\n        minHeight: 56,\n    },\n});\n\nexport default function Tab(props: TabProps) {\n    const {\n        badgeVisible = false,\n        children,\n        enableIndicator,\n        icon: defaultIcon,\n        selected,\n        selectedIcon,\n        variant = 'primary',\n        style,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const vertical = variant === 'bottom-navigation';\n\n    const color = selected ? theme.palette.text.primary : theme.palette.text.hint;\n\n    const tabBaseStyle = css([\n        variant === 'primary'\n            ? styles.primary\n            : (variant === 'secondary' ? styles.secondary : styles.bottomNavigation),\n        style,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => variant === 'primary'\n            ? typo.h2\n            : (variant === 'secondary' ? typo.button2 : typo.flag),\n        color,\n    });\n\n    const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n    const iconElement = icon ? React.cloneElement(icon, { fill: color }) : null;\n\n    return (\n        <TabBase\n            vertical={vertical}\n            style={tabBaseStyle}\n            {...otherProps}\n        >\n            <Badge\n                children={iconElement}\n                invisible={!badgeVisible}\n            />\n\n            <Text\n                children={children}\n                style={css(fontStyle)}\n            />\n\n            {enableIndicator ? <TabIndicator/> : null}\n        </TabBase>\n    );\n};\n"]}

package/build/commonjs/hooks/useCollapsibleAppBar.js

@@ -50,16 +50,23 @@ function useCollapsibleAppBar(userOptions = defaultOptions) {
 
   const elevationStyle = (0, _hooks.useElevationStyle)(6);
 
-  const animatedStyle = _reactNativeReanimated.default.useAnimatedStyle(() => ({
-    transform: [{
-      translateY: translateY.value
-    }],
-    elevation: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.elevation : 0,
-    shadowColor: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowColor,
-    shadowOffset: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowOffset,
-    shadowRadius: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowRadius,
-    shadowOpacity: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowOpacity : 0
-  }));
+  const animatedStyle = _reactNativeReanimated.default.useAnimatedStyle(() => {
+    return _reactNative.Platform.OS === 'web' ? {
+      transform: [{
+        translateY: translateY.value
+      }],
+      boxShadow: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.boxShadow : 0
+    } : {
+      transform: [{
+        translateY: translateY.value
+      }],
+      elevation: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.elevation : 0,
+      shadowColor: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowColor,
+      shadowOffset: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowOffset,
+      shadowRadius: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowRadius,
+      shadowOpacity: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowOpacity : 0
+    };
+  });
 
   const indexRef = _react.default.useRef(0);
 
@@ -119,6 +126,7 @@ function useCollapsibleAppBar(userOptions = defaultOptions) {
           }
         }
 
+        overlapped.value = offsetY > 0;
         lastOffsetY.value = offsetY;
       }
     },
@@ -147,9 +155,7 @@ function useCollapsibleAppBar(userOptions = defaultOptions) {
   const hasCollapsible = collapsibleToolbarHeight > 0;
   const appBarStyle = [animatedStyle, translucent ? {
     paddingTop: safeAreaInsets.top
-  } : undefined, hasCollapsible ? styles.floating : undefined, _reactNative.Platform.OS === 'web' ? {
-    boxShadow: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.boxShadow
-  } : undefined];
+  } : undefined, hasCollapsible ? styles.floating : undefined];
   return {
     appBarStyle,
     onAppBarLayout,

package/build/commonjs/hooks/useCollapsibleAppBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useCollapsibleAppBar.ts"],"names":["defaultOptions","translucent","ANIMATION_DURATION_MILLIS","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","Animated","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","animatedStyle","useAnimatedStyle","transform","value","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","React","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","duration","scrollHandler","useAnimatedScrollHandler","onBeginDrag","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","undefined","floating","boxShadow","scrollContentInsets"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Falsy, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport Animated from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useElevationStyle } from '../hooks';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    translucent?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n    translucent: false,\n};\n\nconst ANIMATION_DURATION_MILLIS = 100;\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { translucent }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n    const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n    const maxTranslateY = Animated.useDerivedValue(() => -collapsibleToolbarHeight);\n\n    const translateY = Animated.useSharedValue<number>(0);\n    const lastTranslateY = Animated.useSharedValue<number>(0);\n    const lastOffsetY = Animated.useSharedValue<number>(0);\n    const overlapped = Animated.useSharedValue<boolean>(false);\n\n    const elevationStyle = useElevationStyle(6);\n    const animatedStyle = Animated.useAnimatedStyle(() => ({\n        transform: [{ translateY: translateY.value }],\n        elevation: overlapped.value ? elevationStyle?.elevation : 0,\n        shadowColor: elevationStyle?.shadowColor,\n        shadowOffset: elevationStyle?.shadowOffset,\n        shadowRadius: elevationStyle?.shadowRadius,\n        shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n    }));\n\n    const indexRef = React.useRef<number>(0);\n    const offsetsRef = React.useRef<Array<number>>([]);\n\n    const onScrollViewChanged = (nextIndex: number) => {\n        const prevIndex = indexRef.current;\n        if (prevIndex === nextIndex) {\n            return;\n        }\n\n        offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n        const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n        lastOffsetY.value = savedOffsetY;\n\n        indexRef.current = nextIndex;\n\n        // Determine whether to overlap every time index is changed.\n        overlapped.value = savedOffsetY > 0;\n\n        // If next ScrollView's offset is too short, expand app bar.\n        if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n            translateY.value = Animated.withTiming(0, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        }\n    };\n\n    const scrollHandler = Animated.useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onMomentumBegin: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            if (SUPPORTS_DRAG_DETECTION) {\n                const dy = offsetY - lastOffsetY.value;\n\n                translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n                overlapped.value = offsetY + translateY.value > 0;\n            } else {\n                if (offsetY > -maxTy) {\n                    if (ty === 0) {\n                        translateY.value = Animated.withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                } else {\n                    if (ty === maxTy) {\n                        translateY.value = Animated.withTiming(0, {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                }\n\n                lastOffsetY.value = offsetY;\n            }\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            lastOffsetY.value = offsetY;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            // If toolbar is already positioned on edge, do nothing.\n            if (ty <= maxTy || ty >= 0) {\n                return;\n            }\n\n            const threshold = maxTy * 0.5;\n\n            const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n            overlapped.value = offsetY + nextTranslateY > 0;\n\n            translateY.value = Animated.withTiming(nextTranslateY, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        translucent ? { paddingTop: safeAreaInsets.top } : undefined,\n        hasCollapsible ? styles.floating : undefined,\n        Platform.OS === 'web' ? { boxShadow: elevationStyle?.boxShadow } : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        onAppBarLayout,\n        onCollapsibleToolbarLayout,\n        onScroll: scrollHandler,\n        onScrollViewChanged,\n        scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n    };\n};\n"]}
+{"version":3,"sources":["useCollapsibleAppBar.ts"],"names":["defaultOptions","translucent","ANIMATION_DURATION_MILLIS","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","Animated","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","animatedStyle","useAnimatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","React","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","duration","scrollHandler","useAnimatedScrollHandler","onBeginDrag","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","undefined","floating","scrollContentInsets"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Falsy, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport Animated from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useElevationStyle } from '../hooks';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    translucent?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n    translucent: false,\n};\n\nconst ANIMATION_DURATION_MILLIS = 100;\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { translucent }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n    const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n    const maxTranslateY = Animated.useDerivedValue(() => -collapsibleToolbarHeight);\n\n    const translateY = Animated.useSharedValue<number>(0);\n    const lastTranslateY = Animated.useSharedValue<number>(0);\n    const lastOffsetY = Animated.useSharedValue<number>(0);\n    const overlapped = Animated.useSharedValue<boolean>(false);\n\n    const elevationStyle = useElevationStyle(6);\n    const animatedStyle = Animated.useAnimatedStyle(() => {\n        return Platform.OS === 'web' ? ({\n            transform: [{ translateY: translateY.value }],\n            boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n        }) : ({\n            transform: [{ translateY: translateY.value }],\n            elevation: overlapped.value ? elevationStyle?.elevation : 0,\n            shadowColor: elevationStyle?.shadowColor,\n            shadowOffset: elevationStyle?.shadowOffset,\n            shadowRadius: elevationStyle?.shadowRadius,\n            shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n        });\n    });\n\n    const indexRef = React.useRef<number>(0);\n    const offsetsRef = React.useRef<Array<number>>([]);\n\n    const onScrollViewChanged = (nextIndex: number) => {\n        const prevIndex = indexRef.current;\n        if (prevIndex === nextIndex) {\n            return;\n        }\n\n        offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n        const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n        lastOffsetY.value = savedOffsetY;\n\n        indexRef.current = nextIndex;\n\n        // Determine whether to overlap every time index is changed.\n        overlapped.value = savedOffsetY > 0;\n\n        // If next ScrollView's offset is too short, expand app bar.\n        if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n            translateY.value = Animated.withTiming(0, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        }\n    };\n\n    const scrollHandler = Animated.useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onMomentumBegin: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            if (SUPPORTS_DRAG_DETECTION) {\n                const dy = offsetY - lastOffsetY.value;\n\n                translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n                overlapped.value = offsetY + translateY.value > 0;\n            } else {\n                if (offsetY > -maxTy) {\n                    if (ty === 0) {\n                        translateY.value = Animated.withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                } else {\n                    if (ty === maxTy) {\n                        translateY.value = Animated.withTiming(0, {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                }\n\n                overlapped.value = offsetY > 0;\n\n                lastOffsetY.value = offsetY;\n            }\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            lastOffsetY.value = offsetY;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            // If toolbar is already positioned on edge, do nothing.\n            if (ty <= maxTy || ty >= 0) {\n                return;\n            }\n\n            const threshold = maxTy * 0.5;\n\n            const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n            overlapped.value = offsetY + nextTranslateY > 0;\n\n            translateY.value = Animated.withTiming(nextTranslateY, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        translucent ? { paddingTop: safeAreaInsets.top } : undefined,\n        hasCollapsible ? styles.floating : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        onAppBarLayout,\n        onCollapsibleToolbarLayout,\n        onScroll: scrollHandler,\n        onScrollViewChanged,\n        scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n    };\n};\n"]}

package/build/module/ButtonBase/ButtonBase.js

@@ -4,6 +4,7 @@ import React from 'react';
 import Animated from 'react-native-reanimated';
 import { useThrottle } from '../hooks';
 import { AnimatedPressable } from '../animated';
+import { StyleSheet } from '../styles';
 const ORIGINAL_OPACITY = 1;
 const ACTIVE_OPACITY = .65;
 const DISABLED_OPACITY = .3;
@@ -12,6 +13,14 @@ const MINIFIED_SCALE = .96;
 const animationTimingConfig = {
   duration: 150
 };
+const styles = StyleSheet.create({
+  disabled: {
+    opacity: DISABLED_OPACITY,
+    transform: [{
+      scale: ORIGINAL_SCALE
+    }]
+  }
+});
 export default function ButtonBase(props) {
   const {
     children,
@@ -30,12 +39,13 @@ export default function ButtonBase(props) {
   const opacity = Animated.useSharedValue(ORIGINAL_OPACITY);
   const scale = Animated.useSharedValue(ORIGINAL_SCALE);
   const animatedStyle = Animated.useAnimatedStyle(() => ({
-    opacity: disabled ? DISABLED_OPACITY : opacity.value,
+    opacity: opacity.value,
     transform: [{
-      scale: disabled ? ORIGINAL_SCALE : scale.value
+      scale: scale.value
     }]
   }));
-  const startAnimation = React.useCallback((pressIn, isHovered = false) => {
+
+  const startAnimation = (pressIn, isHovered = false) => {
     if (pressEffect === 'none') {
       return;
     }
@@ -53,13 +63,14 @@ export default function ButtonBase(props) {
         scale.value = Animated.withTiming(ORIGINAL_SCALE, animationTimingConfig);
       }
     }
-  }, [pressEffect]);
+  };
+
   return /*#__PURE__*/React.createElement(AnimatedPressable, _extends({
     disabled: disabled,
     onPress: handlePress,
     onPressIn: () => startAnimation(true),
     onPressOut: () => startAnimation(false),
-    style: [animatedStyle, style]
+    style: [animatedStyle, disabled ? styles.disabled : undefined, style]
   }, otherProps), typeof children !== 'function' ? ({
     hovered
   }) => {

package/build/module/ButtonBase/ButtonBase.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ButtonBase.tsx"],"names":["React","Animated","useThrottle","AnimatedPressable","ORIGINAL_OPACITY","ACTIVE_OPACITY","DISABLED_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","animationTimingConfig","duration","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","periodMillis","callback","opacity","useSharedValue","scale","animatedStyle","useAnimatedStyle","value","transform","startAnimation","useCallback","pressIn","isHovered","withTiming","withDelay","hovered","undefined"],"mappings":"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","sourcesContent":["import React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\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 animationTimingConfig: Animated.WithTimingConfig = { duration: 150 };\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 = Animated.useSharedValue(ORIGINAL_OPACITY);\n    const scale = Animated.useSharedValue(ORIGINAL_SCALE);\n\n    const animatedStyle = Animated.useAnimatedStyle(() => ({\n        opacity: disabled ? DISABLED_OPACITY : opacity.value,\n        transform: [{ scale: disabled ? ORIGINAL_SCALE : scale.value }],\n    }));\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                opacity.value = ACTIVE_OPACITY;\n            } else {\n                opacity.value = Animated.withTiming(ORIGINAL_OPACITY, animationTimingConfig);\n            }\n        } else if (!isHovered) {\n            if (pressIn) {\n                scale.value = Animated.withDelay(\n                    100,\n                    Animated.withTiming(MINIFIED_SCALE, animationTimingConfig),\n                );\n            } else {\n                scale.value = Animated.withTiming(ORIGINAL_SCALE, animationTimingConfig);\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={[animatedStyle, style]}\n            {...otherProps}\n        >\n            {typeof children !== 'function' ? (\n                ({ hovered }) => {\n                    if (hovered !== undefined) {\n                        startAnimation(hovered, true);\n                    }\n\n                    return children;\n                }\n            ) : children}\n        </AnimatedPressable>\n    );\n};\n"]}
+{"version":3,"sources":["ButtonBase.tsx"],"names":["React","Animated","useThrottle","AnimatedPressable","StyleSheet","ORIGINAL_OPACITY","ACTIVE_OPACITY","DISABLED_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","animationTimingConfig","duration","styles","create","disabled","opacity","transform","scale","ButtonBase","props","children","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","periodMillis","callback","useSharedValue","animatedStyle","useAnimatedStyle","value","startAnimation","pressIn","isHovered","withTiming","withDelay","undefined","hovered"],"mappings":"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","sourcesContent":["import React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport { StyleSheet } from '../styles';\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 animationTimingConfig: Animated.WithTimingConfig = { duration: 150 };\n\nconst styles = StyleSheet.create({\n    disabled: {\n        opacity: DISABLED_OPACITY,\n        transform: [{ scale: ORIGINAL_SCALE }],\n    },\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,\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 = Animated.useSharedValue(ORIGINAL_OPACITY);\n    const scale = Animated.useSharedValue(ORIGINAL_SCALE);\n\n    const animatedStyle = Animated.useAnimatedStyle(() => ({\n        opacity: opacity.value,\n        transform: [{ scale: scale.value }],\n    }));\n\n    const startAnimation = (pressIn: boolean, isHovered: boolean = false) => {\n        if (pressEffect === 'none') {\n            return;\n        }\n\n        if (pressEffect === 'opacity') {\n            if (pressIn) {\n                opacity.value = ACTIVE_OPACITY;\n            } else {\n                opacity.value = Animated.withTiming(ORIGINAL_OPACITY, animationTimingConfig);\n            }\n        } else if (!isHovered) {\n            if (pressIn) {\n                scale.value = Animated.withDelay(\n                    100,\n                    Animated.withTiming(MINIFIED_SCALE, animationTimingConfig),\n                );\n            } else {\n                scale.value = Animated.withTiming(ORIGINAL_SCALE, animationTimingConfig);\n            }\n        }\n    };\n\n    return (\n        <AnimatedPressable\n            disabled={disabled}\n            onPress={handlePress}\n            onPressIn={() => startAnimation(true)}\n            onPressOut={() => startAnimation(false)}\n            style={[\n                animatedStyle,\n                disabled ? styles.disabled : undefined,\n                style,\n            ]}\n            {...otherProps}\n        >\n            {typeof children !== 'function' ? (\n                ({ hovered }) => {\n                    if (hovered !== undefined) {\n                        startAnimation(hovered, true);\n                    }\n\n                    return children;\n                }\n            ) : children}\n        </AnimatedPressable>\n    );\n};\n"]}

package/build/module/Link/Link.js

@@ -6,12 +6,6 @@ import Pressable from '../Pressable';
 import Typography from '../Typography';
 import { css } from '../styles';
 
-function preventDefault(event) {
-  if (Platform.OS === 'web') {
-    event.preventDefault();
-  }
-}
-
 const useStyles = function () {
   return {
     root: {},
@@ -33,6 +27,10 @@ export default function Link(props) {
   const styles = useStyles();
 
   const handlePress = async event => {
+    if (Platform.OS === 'web') {
+      event.preventDefault();
+    }
+
     if (onPress) {
       onPress(event);
       return;
@@ -45,7 +43,7 @@ export default function Link(props) {
 
   return /*#__PURE__*/React.createElement(Pressable, {
     disabled: disabled,
-    onPress: handlePress,
+    onPress: Platform.OS === 'web' ? undefined : handlePress,
     style: css([styles.root, style])
   }, ({
     hovered
@@ -54,7 +52,7 @@ export default function Link(props) {
     return /*#__PURE__*/React.createElement(Typography, _extends({
       href: href,
       style: underlineStyle,
-      onPress: preventDefault
+      onPress: Platform.OS === 'web' ? handlePress : undefined
     }, otherProps));
   });
 }

package/build/module/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Link.tsx"],"names":["React","Linking","Platform","Pressable","Typography","css","preventDefault","event","OS","useStyles","root","underline","textDecorationLine","Link","props","disabled","href","onPress","style","otherProps","styles","handlePress","canOpenURL","openURL","hovered","underlineStyle","undefined"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAgCC,OAAhC,EAAyCC,QAAzC,QAAyD,cAAzD;AAEA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,GAAT,QAAoB,WAApB;;AAKA,SAASC,cAAT,CAAwBC,KAAxB,EAAsD;AAClD,MAAIL,QAAQ,CAACM,EAAT,KAAgB,KAApB,EAA2B;AACvBD,IAAAA,KAAK,CAACD,cAAN;AACH;AACJ;;AAED,MAAMG,SAAgC,GAAG,YAAwB;AAC7D,SAAO;AACHC,IAAAA,IAAI,EAAE,EADH;AAEHC,IAAAA,SAAS,EAAE;AACPC,MAAAA,kBAAkB,EAAE;AADb;AAFR,GAAP;AAMH,CAPD;;AASA,eAAe,SAASC,IAAT,CAAcC,KAAd,EAAgC;AAC3C,QAAM;AACFC,IAAAA,QAAQ,GAAG,KADT;AAEFC,IAAAA,IAFE;AAGFC,IAAAA,OAHE;AAIFC,IAAAA,KAJE;AAKFP,IAAAA,SAAS,GAAG,QALV;AAMF,OAAGQ;AAND,MAOFL,KAPJ;AASA,QAAMM,MAAM,GAAGX,SAAS,EAAxB;;AAEA,QAAMY,WAAW,GAAG,MAAOd,KAAP,IAAwC;AACxD,QAAIU,OAAJ,EAAa;AACTA,MAAAA,OAAO,CAACV,KAAD,CAAP;AACA;AACH;;AAED,QAAI,MAAMN,OAAO,CAACqB,UAAR,CAAmBN,IAAnB,CAAV,EAAoC;AAChC,YAAMf,OAAO,CAACsB,OAAR,CAAgBP,IAAhB,CAAN;AACH;AACJ,GATD;;AAWA,sBACI,oBAAC,SAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,OAAO,EAAEM,WAFb;AAGI,IAAA,KAAK,EAAEhB,GAAG,CAAC,CAACe,MAAM,CAACV,IAAR,EAAcQ,KAAd,CAAD;AAHd,KAKK,CAAC;AAAEM,IAAAA;AAAF,GAAD,KAAiB;AACd,UAAMC,cAAc,GAAId,SAAS,KAAK,QAAd,IAA2BA,SAAS,KAAK,OAAd,IAAyBa,OAArD,GACjBJ,MAAM,CAACT,SADU,GAEjBe,SAFN;AAIA,wBACI,oBAAC,UAAD;AACI,MAAA,IAAI,EAAEV,IADV;AAEI,MAAA,KAAK,EAAES,cAFX;AAGI,MAAA,OAAO,EAAEnB;AAHb,OAIQa,UAJR,EADJ;AAQH,GAlBL,CADJ;AAsBH;AAAA","sourcesContent":["import React from 'react';\nimport { GestureResponderEvent, Linking, Platform } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Pressable from '../Pressable';\nimport Typography from '../Typography';\nimport { css } from '../styles';\nimport type LinkProps from './LinkProps';\n\ntype LinkStyles = NamedStylesStringUnion<'root' | 'underline'>;\n\nfunction preventDefault(event: GestureResponderEvent) {\n    if (Platform.OS === 'web') {\n        event.preventDefault();\n    }\n}\n\nconst useStyles: UseStyles<LinkStyles> = function (): LinkStyles {\n    return {\n        root: {},\n        underline: {\n            textDecorationLine: 'underline',\n        },\n    };\n};\n\nexport default function Link(props: LinkProps) {\n    const {\n        disabled = false,\n        href,\n        onPress,\n        style,\n        underline = 'always',\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const handlePress = async (event: GestureResponderEvent) => {\n        if (onPress) {\n            onPress(event);\n            return;\n        }\n\n        if (await Linking.canOpenURL(href)) {\n            await Linking.openURL(href);\n        }\n    };\n\n    return (\n        <Pressable\n            disabled={disabled}\n            onPress={handlePress}\n            style={css([styles.root, style])}\n        >\n            {({ hovered }) => {\n                const underlineStyle = (underline === 'always' || (underline === 'hover' && hovered))\n                    ? styles.underline\n                    : undefined;\n\n                return (\n                    <Typography\n                        href={href}\n                        style={underlineStyle}\n                        onPress={preventDefault}\n                        {...otherProps}\n                    />\n                );\n            }}\n        </Pressable>\n    );\n};\n"]}
+{"version":3,"sources":["Link.tsx"],"names":["React","Linking","Platform","Pressable","Typography","css","useStyles","root","underline","textDecorationLine","Link","props","disabled","href","onPress","style","otherProps","styles","handlePress","event","OS","preventDefault","canOpenURL","openURL","undefined","hovered","underlineStyle"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAgCC,OAAhC,EAAyCC,QAAzC,QAAyD,cAAzD;AAEA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,GAAT,QAAoB,WAApB;;AAKA,MAAMC,SAAgC,GAAG,YAAwB;AAC7D,SAAO;AACHC,IAAAA,IAAI,EAAE,EADH;AAEHC,IAAAA,SAAS,EAAE;AACPC,MAAAA,kBAAkB,EAAE;AADb;AAFR,GAAP;AAMH,CAPD;;AASA,eAAe,SAASC,IAAT,CAAcC,KAAd,EAAgC;AAC3C,QAAM;AACFC,IAAAA,QAAQ,GAAG,KADT;AAEFC,IAAAA,IAFE;AAGFC,IAAAA,OAHE;AAIFC,IAAAA,KAJE;AAKFP,IAAAA,SAAS,GAAG,QALV;AAMF,OAAGQ;AAND,MAOFL,KAPJ;AASA,QAAMM,MAAM,GAAGX,SAAS,EAAxB;;AAEA,QAAMY,WAAW,GAAG,MAAOC,KAAP,IAAwC;AACxD,QAAIjB,QAAQ,CAACkB,EAAT,KAAgB,KAApB,EAA2B;AACvBD,MAAAA,KAAK,CAACE,cAAN;AACH;;AAED,QAAIP,OAAJ,EAAa;AACTA,MAAAA,OAAO,CAACK,KAAD,CAAP;AACA;AACH;;AAED,QAAI,MAAMlB,OAAO,CAACqB,UAAR,CAAmBT,IAAnB,CAAV,EAAoC;AAChC,YAAMZ,OAAO,CAACsB,OAAR,CAAgBV,IAAhB,CAAN;AACH;AACJ,GAbD;;AAeA,sBACI,oBAAC,SAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,OAAO,EAAEV,QAAQ,CAACkB,EAAT,KAAgB,KAAhB,GAAwBI,SAAxB,GAAoCN,WAFjD;AAGI,IAAA,KAAK,EAAEb,GAAG,CAAC,CAACY,MAAM,CAACV,IAAR,EAAcQ,KAAd,CAAD;AAHd,KAKK,CAAC;AAAEU,IAAAA;AAAF,GAAD,KAAiB;AACd,UAAMC,cAAc,GAAIlB,SAAS,KAAK,QAAd,IAA2BA,SAAS,KAAK,OAAd,IAAyBiB,OAArD,GACjBR,MAAM,CAACT,SADU,GAEjBgB,SAFN;AAIA,wBACI,oBAAC,UAAD;AACI,MAAA,IAAI,EAAEX,IADV;AAEI,MAAA,KAAK,EAAEa,cAFX;AAGI,MAAA,OAAO,EAAExB,QAAQ,CAACkB,EAAT,KAAgB,KAAhB,GAAwBF,WAAxB,GAAsCM;AAHnD,OAIQR,UAJR,EADJ;AAQH,GAlBL,CADJ;AAsBH;AAAA","sourcesContent":["import React from 'react';\nimport { GestureResponderEvent, Linking, Platform } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Pressable from '../Pressable';\nimport Typography from '../Typography';\nimport { css } from '../styles';\nimport type LinkProps from './LinkProps';\n\ntype LinkStyles = NamedStylesStringUnion<'root' | 'underline'>;\n\nconst useStyles: UseStyles<LinkStyles> = function (): LinkStyles {\n    return {\n        root: {},\n        underline: {\n            textDecorationLine: 'underline',\n        },\n    };\n};\n\nexport default function Link(props: LinkProps) {\n    const {\n        disabled = false,\n        href,\n        onPress,\n        style,\n        underline = 'always',\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const handlePress = async (event: GestureResponderEvent) => {\n        if (Platform.OS === 'web') {\n            event.preventDefault();\n        }\n\n        if (onPress) {\n            onPress(event);\n            return;\n        }\n\n        if (await Linking.canOpenURL(href)) {\n            await Linking.openURL(href);\n        }\n    };\n\n    return (\n        <Pressable\n            disabled={disabled}\n            onPress={Platform.OS === 'web' ? undefined : handlePress}\n            style={css([styles.root, style])}\n        >\n            {({ hovered }) => {\n                const underlineStyle = (underline === 'always' || (underline === 'hover' && hovered))\n                    ? styles.underline\n                    : undefined;\n\n                return (\n                    <Typography\n                        href={href}\n                        style={underlineStyle}\n                        onPress={Platform.OS === 'web' ? handlePress : undefined}\n                        {...otherProps}\n                    />\n                );\n            }}\n        </Pressable>\n    );\n};\n"]}

package/build/module/Tab/Tab.js

@@ -44,10 +44,10 @@ export default function Tab(props) {
   return /*#__PURE__*/React.createElement(TabBase, _extends({
     vertical: vertical,
     style: tabBaseStyle
-  }, otherProps), iconElement && badgeVisible ? /*#__PURE__*/React.createElement(Badge, {
+  }, otherProps), /*#__PURE__*/React.createElement(Badge, {
     children: iconElement,
-    invisible: false
-  }) : iconElement, /*#__PURE__*/React.createElement(Text, {
+    invisible: !badgeVisible
+  }), /*#__PURE__*/React.createElement(Text, {
     children: children,
     style: css(fontStyle)
   }), enableIndicator ? /*#__PURE__*/React.createElement(TabIndicator, null) : null);

package/build/module/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Tab.tsx"],"names":["React","Text","Badge","TabBase","createFontStyle","css","StyleSheet","useTheme","TabIndicator","styles","create","primary","minHeight","secondary","bottomNavigation","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","selected","selectedIcon","variant","style","otherProps","theme","vertical","color","palette","text","hint","tabBaseStyle","fontStyle","selector","typo","h2","button2","flag","iconElement","cloneElement","fill"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AACA,OAAOC,KAAP,MAAkB,UAAlB;AACA,OAAOC,OAAP,MAAoB,YAApB;AAEA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,UAA/B,EAA2CC,QAA3C,QAA2D,WAA3D;AACA,OAAOC,YAAP,MAAyB,gBAAzB;AAEA,MAAMC,MAAM,GAAGH,UAAU,CAACI,MAAX,CAAkB;AAC7BC,EAAAA,OAAO,EAAE;AACLC,IAAAA,SAAS,EAAE;AADN,GADoB;AAI7BC,EAAAA,SAAS,EAAE;AACPD,IAAAA,SAAS,EAAE;AADJ,GAJkB;AAO7BE,EAAAA,gBAAgB,EAAE;AACdF,IAAAA,SAAS,EAAE;AADG;AAPW,CAAlB,CAAf;AAYA,eAAe,SAASG,GAAT,CAAaC,KAAb,EAA8B;AACzC,QAAM;AACFC,IAAAA,YAAY,GAAG,KADb;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,eAHE;AAIFC,IAAAA,IAAI,EAAEC,WAJJ;AAKFC,IAAAA,QALE;AAMFC,IAAAA,YANE;AAOFC,IAAAA,OAAO,GAAG,SAPR;AAQFC,IAAAA,KARE;AASF,OAAGC;AATD,MAUFV,KAVJ;AAYA,QAAMW,KAAK,GAAGpB,QAAQ,EAAtB;AAEA,QAAMqB,QAAQ,GAAGJ,OAAO,KAAK,mBAA7B;AAEA,QAAMK,KAAK,GAAGP,QAAQ,GAAGK,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBpB,OAAtB,GAAgCgB,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBC,IAAzE;AAEA,QAAMC,YAAY,GAAG5B,GAAG,CAAC,CACrBmB,OAAO,KAAK,SAAZ,GACMf,MAAM,CAACE,OADb,GAEOa,OAAO,KAAK,WAAZ,GAA0Bf,MAAM,CAACI,SAAjC,GAA6CJ,MAAM,CAACK,gBAHtC,EAIrBW,KAJqB,CAAD,CAAxB;AAOA,QAAMS,SAAS,GAAG9B,eAAe,CAACuB,KAAD,EAAQ;AACrCQ,IAAAA,QAAQ,EAAGC,IAAD,IAAUZ,OAAO,KAAK,SAAZ,GACdY,IAAI,CAACC,EADS,GAEbb,OAAO,KAAK,WAAZ,GAA0BY,IAAI,CAACE,OAA/B,GAAyCF,IAAI,CAACG,IAHhB;AAIrCV,IAAAA;AAJqC,GAAR,CAAjC;AAOA,QAAMT,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;AACA,QAAMmB,WAAW,GAAGpB,IAAI,gBAAGpB,KAAK,CAACyC,YAAN,CAAmBrB,IAAnB,EAAyB;AAAEsB,IAAAA,IAAI,EAAEb;AAAR,GAAzB,CAAH,GAA+C,IAAvE;AAEA,sBACI,oBAAC,OAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,KAAK,EAAEK;AAFX,KAGQP,UAHR,GAKKc,WAAW,IAAIvB,YAAf,gBACG,oBAAC,KAAD;AACI,IAAA,QAAQ,EAAEuB,WADd;AAEI,IAAA,SAAS,EAAE;AAFf,IADH,GAKGA,WAVR,eAYI,oBAAC,IAAD;AACI,IAAA,QAAQ,EAAEtB,QADd;AAEI,IAAA,KAAK,EAAEb,GAAG,CAAC6B,SAAD;AAFd,IAZJ,EAiBKf,eAAe,gBAAG,oBAAC,YAAD,OAAH,GAAqB,IAjBzC,CADJ;AAqBH;AAAA","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport type TabProps from './TabProps';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport TabIndicator from './TabIndicator';\n\nconst styles = StyleSheet.create({\n    primary: {\n        minHeight: 48,\n    },\n    secondary: {\n        minHeight: 48,\n    },\n    bottomNavigation: {\n        minHeight: 56,\n    },\n});\n\nexport default function Tab(props: TabProps) {\n    const {\n        badgeVisible = false,\n        children,\n        enableIndicator,\n        icon: defaultIcon,\n        selected,\n        selectedIcon,\n        variant = 'primary',\n        style,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const vertical = variant === 'bottom-navigation';\n\n    const color = selected ? theme.palette.text.primary : theme.palette.text.hint;\n\n    const tabBaseStyle = css([\n        variant === 'primary'\n            ? styles.primary\n            : (variant === 'secondary' ? styles.secondary : styles.bottomNavigation),\n        style,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => variant === 'primary'\n            ? typo.h2\n            : (variant === 'secondary' ? typo.button2 : typo.flag),\n        color,\n    });\n\n    const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n    const iconElement = icon ? React.cloneElement(icon, { fill: color }) : null;\n\n    return (\n        <TabBase\n            vertical={vertical}\n            style={tabBaseStyle}\n            {...otherProps}\n        >\n            {iconElement && badgeVisible ? (\n                <Badge\n                    children={iconElement}\n                    invisible={false}\n                />\n            ) : iconElement}\n\n            <Text\n                children={children}\n                style={css(fontStyle)}\n            />\n\n            {enableIndicator ? <TabIndicator/> : null}\n        </TabBase>\n    );\n};\n"]}
+{"version":3,"sources":["Tab.tsx"],"names":["React","Text","Badge","TabBase","createFontStyle","css","StyleSheet","useTheme","TabIndicator","styles","create","primary","minHeight","secondary","bottomNavigation","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","selected","selectedIcon","variant","style","otherProps","theme","vertical","color","palette","text","hint","tabBaseStyle","fontStyle","selector","typo","h2","button2","flag","iconElement","cloneElement","fill"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AACA,OAAOC,KAAP,MAAkB,UAAlB;AACA,OAAOC,OAAP,MAAoB,YAApB;AAEA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,UAA/B,EAA2CC,QAA3C,QAA2D,WAA3D;AACA,OAAOC,YAAP,MAAyB,gBAAzB;AAEA,MAAMC,MAAM,GAAGH,UAAU,CAACI,MAAX,CAAkB;AAC7BC,EAAAA,OAAO,EAAE;AACLC,IAAAA,SAAS,EAAE;AADN,GADoB;AAI7BC,EAAAA,SAAS,EAAE;AACPD,IAAAA,SAAS,EAAE;AADJ,GAJkB;AAO7BE,EAAAA,gBAAgB,EAAE;AACdF,IAAAA,SAAS,EAAE;AADG;AAPW,CAAlB,CAAf;AAYA,eAAe,SAASG,GAAT,CAAaC,KAAb,EAA8B;AACzC,QAAM;AACFC,IAAAA,YAAY,GAAG,KADb;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,eAHE;AAIFC,IAAAA,IAAI,EAAEC,WAJJ;AAKFC,IAAAA,QALE;AAMFC,IAAAA,YANE;AAOFC,IAAAA,OAAO,GAAG,SAPR;AAQFC,IAAAA,KARE;AASF,OAAGC;AATD,MAUFV,KAVJ;AAYA,QAAMW,KAAK,GAAGpB,QAAQ,EAAtB;AAEA,QAAMqB,QAAQ,GAAGJ,OAAO,KAAK,mBAA7B;AAEA,QAAMK,KAAK,GAAGP,QAAQ,GAAGK,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBpB,OAAtB,GAAgCgB,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBC,IAAzE;AAEA,QAAMC,YAAY,GAAG5B,GAAG,CAAC,CACrBmB,OAAO,KAAK,SAAZ,GACMf,MAAM,CAACE,OADb,GAEOa,OAAO,KAAK,WAAZ,GAA0Bf,MAAM,CAACI,SAAjC,GAA6CJ,MAAM,CAACK,gBAHtC,EAIrBW,KAJqB,CAAD,CAAxB;AAOA,QAAMS,SAAS,GAAG9B,eAAe,CAACuB,KAAD,EAAQ;AACrCQ,IAAAA,QAAQ,EAAGC,IAAD,IAAUZ,OAAO,KAAK,SAAZ,GACdY,IAAI,CAACC,EADS,GAEbb,OAAO,KAAK,WAAZ,GAA0BY,IAAI,CAACE,OAA/B,GAAyCF,IAAI,CAACG,IAHhB;AAIrCV,IAAAA;AAJqC,GAAR,CAAjC;AAOA,QAAMT,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;AACA,QAAMmB,WAAW,GAAGpB,IAAI,gBAAGpB,KAAK,CAACyC,YAAN,CAAmBrB,IAAnB,EAAyB;AAAEsB,IAAAA,IAAI,EAAEb;AAAR,GAAzB,CAAH,GAA+C,IAAvE;AAEA,sBACI,oBAAC,OAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,KAAK,EAAEK;AAFX,KAGQP,UAHR,gBAKI,oBAAC,KAAD;AACI,IAAA,QAAQ,EAAEc,WADd;AAEI,IAAA,SAAS,EAAE,CAACvB;AAFhB,IALJ,eAUI,oBAAC,IAAD;AACI,IAAA,QAAQ,EAAEC,QADd;AAEI,IAAA,KAAK,EAAEb,GAAG,CAAC6B,SAAD;AAFd,IAVJ,EAeKf,eAAe,gBAAG,oBAAC,YAAD,OAAH,GAAqB,IAfzC,CADJ;AAmBH;AAAA","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport type TabProps from './TabProps';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport TabIndicator from './TabIndicator';\n\nconst styles = StyleSheet.create({\n    primary: {\n        minHeight: 48,\n    },\n    secondary: {\n        minHeight: 48,\n    },\n    bottomNavigation: {\n        minHeight: 56,\n    },\n});\n\nexport default function Tab(props: TabProps) {\n    const {\n        badgeVisible = false,\n        children,\n        enableIndicator,\n        icon: defaultIcon,\n        selected,\n        selectedIcon,\n        variant = 'primary',\n        style,\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const vertical = variant === 'bottom-navigation';\n\n    const color = selected ? theme.palette.text.primary : theme.palette.text.hint;\n\n    const tabBaseStyle = css([\n        variant === 'primary'\n            ? styles.primary\n            : (variant === 'secondary' ? styles.secondary : styles.bottomNavigation),\n        style,\n    ]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => variant === 'primary'\n            ? typo.h2\n            : (variant === 'secondary' ? typo.button2 : typo.flag),\n        color,\n    });\n\n    const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n    const iconElement = icon ? React.cloneElement(icon, { fill: color }) : null;\n\n    return (\n        <TabBase\n            vertical={vertical}\n            style={tabBaseStyle}\n            {...otherProps}\n        >\n            <Badge\n                children={iconElement}\n                invisible={!badgeVisible}\n            />\n\n            <Text\n                children={children}\n                style={css(fontStyle)}\n            />\n\n            {enableIndicator ? <TabIndicator/> : null}\n        </TabBase>\n    );\n};\n"]}

package/build/module/hooks/useCollapsibleAppBar.js

@@ -26,16 +26,23 @@ export default function useCollapsibleAppBar(userOptions = defaultOptions) {
   const lastOffsetY = Animated.useSharedValue(0);
   const overlapped = Animated.useSharedValue(false);
   const elevationStyle = useElevationStyle(6);
-  const animatedStyle = Animated.useAnimatedStyle(() => ({
-    transform: [{
-      translateY: translateY.value
-    }],
-    elevation: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.elevation : 0,
-    shadowColor: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowColor,
-    shadowOffset: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowOffset,
-    shadowRadius: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowRadius,
-    shadowOpacity: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowOpacity : 0
-  }));
+  const animatedStyle = Animated.useAnimatedStyle(() => {
+    return Platform.OS === 'web' ? {
+      transform: [{
+        translateY: translateY.value
+      }],
+      boxShadow: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.boxShadow : 0
+    } : {
+      transform: [{
+        translateY: translateY.value
+      }],
+      elevation: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.elevation : 0,
+      shadowColor: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowColor,
+      shadowOffset: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowOffset,
+      shadowRadius: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowRadius,
+      shadowOpacity: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.shadowOpacity : 0
+    };
+  });
   const indexRef = React.useRef(0);
   const offsetsRef = React.useRef([]);
 
@@ -93,6 +100,7 @@ export default function useCollapsibleAppBar(userOptions = defaultOptions) {
           }
         }
 
+        overlapped.value = offsetY > 0;
         lastOffsetY.value = offsetY;
       }
     },
@@ -120,9 +128,7 @@ export default function useCollapsibleAppBar(userOptions = defaultOptions) {
   const hasCollapsible = collapsibleToolbarHeight > 0;
   const appBarStyle = [animatedStyle, translucent ? {
     paddingTop: safeAreaInsets.top
-  } : undefined, hasCollapsible ? styles.floating : undefined, Platform.OS === 'web' ? {
-    boxShadow: elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.boxShadow
-  } : undefined];
+  } : undefined, hasCollapsible ? styles.floating : undefined];
   return {
     appBarStyle,
     onAppBarLayout,

package/build/module/hooks/useCollapsibleAppBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useCollapsibleAppBar.ts"],"names":["React","Platform","Animated","useSafeAreaInsets","useElevationStyle","useHeight","useAppbarStyles","defaultOptions","translucent","ANIMATION_DURATION_MILLIS","SUPPORTS_DRAG_DETECTION","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","animatedStyle","useAnimatedStyle","transform","value","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","duration","scrollHandler","useAnimatedScrollHandler","onBeginDrag","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","undefined","floating","boxShadow","scrollContentInsets"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Falsy, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport Animated from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useElevationStyle } from '../hooks';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    translucent?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n    translucent: false,\n};\n\nconst ANIMATION_DURATION_MILLIS = 100;\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { translucent }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n    const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n    const maxTranslateY = Animated.useDerivedValue(() => -collapsibleToolbarHeight);\n\n    const translateY = Animated.useSharedValue<number>(0);\n    const lastTranslateY = Animated.useSharedValue<number>(0);\n    const lastOffsetY = Animated.useSharedValue<number>(0);\n    const overlapped = Animated.useSharedValue<boolean>(false);\n\n    const elevationStyle = useElevationStyle(6);\n    const animatedStyle = Animated.useAnimatedStyle(() => ({\n        transform: [{ translateY: translateY.value }],\n        elevation: overlapped.value ? elevationStyle?.elevation : 0,\n        shadowColor: elevationStyle?.shadowColor,\n        shadowOffset: elevationStyle?.shadowOffset,\n        shadowRadius: elevationStyle?.shadowRadius,\n        shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n    }));\n\n    const indexRef = React.useRef<number>(0);\n    const offsetsRef = React.useRef<Array<number>>([]);\n\n    const onScrollViewChanged = (nextIndex: number) => {\n        const prevIndex = indexRef.current;\n        if (prevIndex === nextIndex) {\n            return;\n        }\n\n        offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n        const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n        lastOffsetY.value = savedOffsetY;\n\n        indexRef.current = nextIndex;\n\n        // Determine whether to overlap every time index is changed.\n        overlapped.value = savedOffsetY > 0;\n\n        // If next ScrollView's offset is too short, expand app bar.\n        if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n            translateY.value = Animated.withTiming(0, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        }\n    };\n\n    const scrollHandler = Animated.useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onMomentumBegin: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            if (SUPPORTS_DRAG_DETECTION) {\n                const dy = offsetY - lastOffsetY.value;\n\n                translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n                overlapped.value = offsetY + translateY.value > 0;\n            } else {\n                if (offsetY > -maxTy) {\n                    if (ty === 0) {\n                        translateY.value = Animated.withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                } else {\n                    if (ty === maxTy) {\n                        translateY.value = Animated.withTiming(0, {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                }\n\n                lastOffsetY.value = offsetY;\n            }\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            lastOffsetY.value = offsetY;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            // If toolbar is already positioned on edge, do nothing.\n            if (ty <= maxTy || ty >= 0) {\n                return;\n            }\n\n            const threshold = maxTy * 0.5;\n\n            const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n            overlapped.value = offsetY + nextTranslateY > 0;\n\n            translateY.value = Animated.withTiming(nextTranslateY, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        translucent ? { paddingTop: safeAreaInsets.top } : undefined,\n        hasCollapsible ? styles.floating : undefined,\n        Platform.OS === 'web' ? { boxShadow: elevationStyle?.boxShadow } : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        onAppBarLayout,\n        onCollapsibleToolbarLayout,\n        onScroll: scrollHandler,\n        onScrollViewChanged,\n        scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n    };\n};\n"]}
+{"version":3,"sources":["useCollapsibleAppBar.ts"],"names":["React","Platform","Animated","useSafeAreaInsets","useElevationStyle","useHeight","useAppbarStyles","defaultOptions","translucent","ANIMATION_DURATION_MILLIS","SUPPORTS_DRAG_DETECTION","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","animatedStyle","useAnimatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","duration","scrollHandler","useAnimatedScrollHandler","onBeginDrag","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","undefined","floating","scrollContentInsets"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Falsy, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport Animated from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useElevationStyle } from '../hooks';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    translucent?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n    translucent: false,\n};\n\nconst ANIMATION_DURATION_MILLIS = 100;\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { translucent }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n    const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n    const maxTranslateY = Animated.useDerivedValue(() => -collapsibleToolbarHeight);\n\n    const translateY = Animated.useSharedValue<number>(0);\n    const lastTranslateY = Animated.useSharedValue<number>(0);\n    const lastOffsetY = Animated.useSharedValue<number>(0);\n    const overlapped = Animated.useSharedValue<boolean>(false);\n\n    const elevationStyle = useElevationStyle(6);\n    const animatedStyle = Animated.useAnimatedStyle(() => {\n        return Platform.OS === 'web' ? ({\n            transform: [{ translateY: translateY.value }],\n            boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n        }) : ({\n            transform: [{ translateY: translateY.value }],\n            elevation: overlapped.value ? elevationStyle?.elevation : 0,\n            shadowColor: elevationStyle?.shadowColor,\n            shadowOffset: elevationStyle?.shadowOffset,\n            shadowRadius: elevationStyle?.shadowRadius,\n            shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n        });\n    });\n\n    const indexRef = React.useRef<number>(0);\n    const offsetsRef = React.useRef<Array<number>>([]);\n\n    const onScrollViewChanged = (nextIndex: number) => {\n        const prevIndex = indexRef.current;\n        if (prevIndex === nextIndex) {\n            return;\n        }\n\n        offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n        const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n        lastOffsetY.value = savedOffsetY;\n\n        indexRef.current = nextIndex;\n\n        // Determine whether to overlap every time index is changed.\n        overlapped.value = savedOffsetY > 0;\n\n        // If next ScrollView's offset is too short, expand app bar.\n        if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n            translateY.value = Animated.withTiming(0, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        }\n    };\n\n    const scrollHandler = Animated.useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onMomentumBegin: () => {\n            lastTranslateY.value = translateY.value;\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            if (SUPPORTS_DRAG_DETECTION) {\n                const dy = offsetY - lastOffsetY.value;\n\n                translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n                overlapped.value = offsetY + translateY.value > 0;\n            } else {\n                if (offsetY > -maxTy) {\n                    if (ty === 0) {\n                        translateY.value = Animated.withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                } else {\n                    if (ty === maxTy) {\n                        translateY.value = Animated.withTiming(0, {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                }\n\n                overlapped.value = offsetY > 0;\n\n                lastOffsetY.value = offsetY;\n            }\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            lastOffsetY.value = offsetY;\n\n            const ty = translateY.value;\n            const maxTy = maxTranslateY.value;\n\n            // If toolbar is already positioned on edge, do nothing.\n            if (ty <= maxTy || ty >= 0) {\n                return;\n            }\n\n            const threshold = maxTy * 0.5;\n\n            const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n            overlapped.value = offsetY + nextTranslateY > 0;\n\n            translateY.value = Animated.withTiming(nextTranslateY, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        translucent ? { paddingTop: safeAreaInsets.top } : undefined,\n        hasCollapsible ? styles.floating : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        onAppBarLayout,\n        onCollapsibleToolbarLayout,\n        onScroll: scrollHandler,\n        onScrollViewChanged,\n        scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n    };\n};\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fountain-ui/core",
-  "version": "1.11.2",
+  "version": "1.11.3",
   "author": "Fountain-UI Team",
   "description": "React components that implement Tappytoon's Fountain Design.",
   "license": "MIT",
@@ -67,5 +67,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "3e6abc5ae4587fed74ff1305013e9e630c8cacfa"
+  "gitHead": "d0073b2a3cd04c55c88b1225fa46f37013adf63d"
 }

package/src/ButtonBase/ButtonBase.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import Animated from 'react-native-reanimated';
 import { useThrottle } from '../hooks';
 import { AnimatedPressable } from '../animated';
+import { StyleSheet } from '../styles';
 import type ButtonBaseProps from './ButtonBaseProps';
 
 const ORIGINAL_OPACITY = 1;
@@ -13,6 +14,13 @@ const MINIFIED_SCALE = .96;
 
 const animationTimingConfig: Animated.WithTimingConfig = { duration: 150 };
 
+const styles = StyleSheet.create({
+    disabled: {
+        opacity: DISABLED_OPACITY,
+        transform: [{ scale: ORIGINAL_SCALE }],
+    },
+});
+
 export default function ButtonBase(props: ButtonBaseProps) {
     const {
         children,
@@ -34,11 +42,11 @@ export default function ButtonBase(props: ButtonBaseProps) {
     const scale = Animated.useSharedValue(ORIGINAL_SCALE);
 
     const animatedStyle = Animated.useAnimatedStyle(() => ({
-        opacity: disabled ? DISABLED_OPACITY : opacity.value,
-        transform: [{ scale: disabled ? ORIGINAL_SCALE : scale.value }],
+        opacity: opacity.value,
+        transform: [{ scale: scale.value }],
     }));
 
-    const startAnimation = React.useCallback((pressIn: boolean, isHovered: boolean = false) => {
+    const startAnimation = (pressIn: boolean, isHovered: boolean = false) => {
         if (pressEffect === 'none') {
             return;
         }
@@ -59,7 +67,7 @@ export default function ButtonBase(props: ButtonBaseProps) {
                 scale.value = Animated.withTiming(ORIGINAL_SCALE, animationTimingConfig);
             }
         }
-    }, [pressEffect]);
+    };
 
     return (
         <AnimatedPressable
@@ -67,7 +75,11 @@ export default function ButtonBase(props: ButtonBaseProps) {
             onPress={handlePress}
             onPressIn={() => startAnimation(true)}
             onPressOut={() => startAnimation(false)}
-            style={[animatedStyle, style]}
+            style={[
+                animatedStyle,
+                disabled ? styles.disabled : undefined,
+                style,
+            ]}
             {...otherProps}
         >
             {typeof children !== 'function' ? (

package/src/Link/Link.tsx

@@ -8,12 +8,6 @@ import type LinkProps from './LinkProps';
 
 type LinkStyles = NamedStylesStringUnion<'root' | 'underline'>;
 
-function preventDefault(event: GestureResponderEvent) {
-    if (Platform.OS === 'web') {
-        event.preventDefault();
-    }
-}
-
 const useStyles: UseStyles<LinkStyles> = function (): LinkStyles {
     return {
         root: {},
@@ -36,6 +30,10 @@ export default function Link(props: LinkProps) {
     const styles = useStyles();
 
     const handlePress = async (event: GestureResponderEvent) => {
+        if (Platform.OS === 'web') {
+            event.preventDefault();
+        }
+
         if (onPress) {
             onPress(event);
             return;
@@ -49,7 +47,7 @@ export default function Link(props: LinkProps) {
     return (
         <Pressable
             disabled={disabled}
-            onPress={handlePress}
+            onPress={Platform.OS === 'web' ? undefined : handlePress}
             style={css([styles.root, style])}
         >
             {({ hovered }) => {
@@ -61,7 +59,7 @@ export default function Link(props: LinkProps) {
                     <Typography
                         href={href}
                         style={underlineStyle}
-                        onPress={preventDefault}
+                        onPress={Platform.OS === 'web' ? handlePress : undefined}
                         {...otherProps}
                     />
                 );

package/src/Tab/Tab.tsx

@@ -60,12 +60,10 @@ export default function Tab(props: TabProps) {
             style={tabBaseStyle}
             {...otherProps}
         >
-            {iconElement && badgeVisible ? (
-                <Badge
-                    children={iconElement}
-                    invisible={false}
-                />
-            ) : iconElement}
+            <Badge
+                children={iconElement}
+                invisible={!badgeVisible}
+            />
 
             <Text
                 children={children}

package/src/hooks/useCollapsibleAppBar.ts

@@ -63,14 +63,19 @@ export default function useCollapsibleAppBar(userOptions: Options = defaultOptio
     const overlapped = Animated.useSharedValue<boolean>(false);
 
     const elevationStyle = useElevationStyle(6);
-    const animatedStyle = Animated.useAnimatedStyle(() => ({
-        transform: [{ translateY: translateY.value }],
-        elevation: overlapped.value ? elevationStyle?.elevation : 0,
-        shadowColor: elevationStyle?.shadowColor,
-        shadowOffset: elevationStyle?.shadowOffset,
-        shadowRadius: elevationStyle?.shadowRadius,
-        shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,
-    }));
+    const animatedStyle = Animated.useAnimatedStyle(() => {
+        return Platform.OS === 'web' ? ({
+            transform: [{ translateY: translateY.value }],
+            boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,
+        }) : ({
+            transform: [{ translateY: translateY.value }],
+            elevation: overlapped.value ? elevationStyle?.elevation : 0,
+            shadowColor: elevationStyle?.shadowColor,
+            shadowOffset: elevationStyle?.shadowOffset,
+            shadowRadius: elevationStyle?.shadowRadius,
+            shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,
+        });
+    });
 
     const indexRef = React.useRef<number>(0);
     const offsetsRef = React.useRef<Array<number>>([]);
@@ -133,6 +138,8 @@ export default function useCollapsibleAppBar(userOptions: Options = defaultOptio
                     }
                 }
 
+                overlapped.value = offsetY > 0;
+
                 lastOffsetY.value = offsetY;
             }
         },
@@ -170,7 +177,6 @@ export default function useCollapsibleAppBar(userOptions: Options = defaultOptio
         animatedStyle,
         translucent ? { paddingTop: safeAreaInsets.top } : undefined,
         hasCollapsible ? styles.floating : undefined,
-        Platform.OS === 'web' ? { boxShadow: elevationStyle?.boxShadow } : undefined,
     ];
 
     return {