@fountain-ui/core 2.0.0-beta.10 → 2.0.0-beta.11

package/build/commonjs/Tabs/TabIndicator.js

@@ -46,7 +46,7 @@ function TabIndicator(props) {
     ...otherProps
   } = props;
   const styles = useStyles();
-  const layout = (0, _reactNativeReanimated.useDerivedValue)(() => {
+  const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
     const rawScrollValue = scrollValue.value;
     const index = Math.floor(rawScrollValue);
     const offset = rawScrollValue % 1;
@@ -61,10 +61,6 @@ function TabIndicator(props) {
       width: Math.max(x2 - x1 - rightInset, 0)
     };
   });
-  const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
-    left: layout.value.left,
-    width: layout.value.width
-  }));
   return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, _extends({
     style: [styles.root, disabled ? styles.disabled : undefined, animatedStyle, style]
   }, otherProps));

package/build/commonjs/Tabs/TabIndicator.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","root","backgroundColor","palette","secondary","main","bottom","height","position","disabled","TabIndicator","props","coordinates","scrollable","scrollValue","style","otherProps","styles","layout","useDerivedValue","rawScrollValue","value","index","Math","floor","offset","coordinate","defaultCoordinate","nextCoordinate","x1","x2","leftInset","rightInset","left","width","max","animatedStyle","useAnimatedStyle","undefined"],"sources":["TabIndicator.tsx"],"sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle, useDerivedValue } from 'react-native-reanimated';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport type TabIndicatorProps from './TabIndicatorProps';\nimport { defaultCoordinate } from './TabCoordinate';\n\ntype TabIndicatorStyles = NamedStylesStringUnion<'root' | 'disabled'>;\n\nconst useStyles: UseStyles<TabIndicatorStyles> = function (): TabIndicatorStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            backgroundColor: theme.palette.secondary.main,\n            bottom: 0,\n            height: 4,\n            position: 'absolute',\n        },\n        disabled: {\n            height: 0,\n        },\n    };\n};\n\nexport default function TabIndicator(props: TabIndicatorProps) {\n    const {\n        coordinates,\n        disabled,\n        scrollable,\n        scrollValue,\n        style,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const layout = useDerivedValue(() => {\n        const rawScrollValue = scrollValue.value;\n        const index = Math.floor(rawScrollValue);\n        const offset = rawScrollValue % 1;\n\n        const coordinate = coordinates[index] ?? defaultCoordinate;\n        const nextCoordinate = coordinates[index + 1] ?? defaultCoordinate;\n\n        const x1 = (offset * nextCoordinate.x1 + (1 - offset) * coordinate.x1);\n        const x2 = (offset * nextCoordinate.x2 + (1 - offset) * coordinate.x2);\n\n        const leftInset = scrollable ? 12 : 0;\n        const rightInset = scrollable ? 24 : 0;\n\n        return {\n            left: x1 + leftInset,\n            width: Math.max(x2 - x1 - rightInset, 0),\n        };\n    });\n\n    const animatedStyle = useAnimatedStyle(() => ({\n        left: layout.value.left,\n        width: layout.value.width,\n    }));\n\n    return (\n        <Animated.View\n            style={[\n                styles.root,\n                disabled ? styles.disabled : undefined,\n                animatedStyle,\n                style,\n            ]}\n            {...otherProps}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;;;;;;;;;AAIA,MAAMA,SAAwC,GAAG,YAAgC;EAC7E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,eAAe,EAAEH,KAAK,CAACI,OAAN,CAAcC,SAAd,CAAwBC,IADvC;MAEFC,MAAM,EAAE,CAFN;MAGFC,MAAM,EAAE,CAHN;MAIFC,QAAQ,EAAE;IAJR,CADH;IAOHC,QAAQ,EAAE;MACNF,MAAM,EAAE;IADF;EAPP,CAAP;AAWH,CAdD;;AAgBe,SAASG,YAAT,CAAsBC,KAAtB,EAAgD;EAC3D,MAAM;IACFC,WADE;IAEFH,QAFE;IAGFI,UAHE;IAIFC,WAJE;IAKFC,KALE;IAMF,GAAGC;EAND,IAOFL,KAPJ;EASA,MAAMM,MAAM,GAAGnB,SAAS,EAAxB;EAEA,MAAMoB,MAAM,GAAG,IAAAC,sCAAA,EAAgB,MAAM;IACjC,MAAMC,cAAc,GAAGN,WAAW,CAACO,KAAnC;IACA,MAAMC,KAAK,GAAGC,IAAI,CAACC,KAAL,CAAWJ,cAAX,CAAd;IACA,MAAMK,MAAM,GAAGL,cAAc,GAAG,CAAhC;IAEA,MAAMM,UAAU,GAAGd,WAAW,CAACU,KAAD,CAAX,IAAsBK,gCAAzC;IACA,MAAMC,cAAc,GAAGhB,WAAW,CAACU,KAAK,GAAG,CAAT,CAAX,IAA0BK,gCAAjD;IAEA,MAAME,EAAE,GAAIJ,MAAM,GAAGG,cAAc,CAACC,EAAxB,GAA6B,CAAC,IAAIJ,MAAL,IAAeC,UAAU,CAACG,EAAnE;IACA,MAAMC,EAAE,GAAIL,MAAM,GAAGG,cAAc,CAACE,EAAxB,GAA6B,CAAC,IAAIL,MAAL,IAAeC,UAAU,CAACI,EAAnE;IAEA,MAAMC,SAAS,GAAGlB,UAAU,GAAG,EAAH,GAAQ,CAApC;IACA,MAAMmB,UAAU,GAAGnB,UAAU,GAAG,EAAH,GAAQ,CAArC;IAEA,OAAO;MACHoB,IAAI,EAAEJ,EAAE,GAAGE,SADR;MAEHG,KAAK,EAAEX,IAAI,CAACY,GAAL,CAASL,EAAE,GAAGD,EAAL,GAAUG,UAAnB,EAA+B,CAA/B;IAFJ,CAAP;EAIH,CAlBc,CAAf;EAoBA,MAAMI,aAAa,GAAG,IAAAC,uCAAA,EAAiB,OAAO;IAC1CJ,IAAI,EAAEf,MAAM,CAACG,KAAP,CAAaY,IADuB;IAE1CC,KAAK,EAAEhB,MAAM,CAACG,KAAP,CAAaa;EAFsB,CAAP,CAAjB,CAAtB;EAKA,oBACI,6BAAC,8BAAD,CAAU,IAAV;IACI,KAAK,EAAE,CACHjB,MAAM,CAAChB,IADJ,EAEHQ,QAAQ,GAAGQ,MAAM,CAACR,QAAV,GAAqB6B,SAF1B,EAGHF,aAHG,EAIHrB,KAJG;EADX,GAOQC,UAPR,EADJ;AAWH;;AAAA"}
+{"version":3,"names":["useStyles","theme","useTheme","root","backgroundColor","palette","secondary","main","bottom","height","position","disabled","TabIndicator","props","coordinates","scrollable","scrollValue","style","otherProps","styles","animatedStyle","useAnimatedStyle","rawScrollValue","value","index","Math","floor","offset","coordinate","defaultCoordinate","nextCoordinate","x1","x2","leftInset","rightInset","left","width","max","undefined"],"sources":["TabIndicator.tsx"],"sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport type TabIndicatorProps from './TabIndicatorProps';\nimport { defaultCoordinate } from './TabCoordinate';\n\ntype TabIndicatorStyles = NamedStylesStringUnion<'root' | 'disabled'>;\n\nconst useStyles: UseStyles<TabIndicatorStyles> = function (): TabIndicatorStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            backgroundColor: theme.palette.secondary.main,\n            bottom: 0,\n            height: 4,\n            position: 'absolute',\n        },\n        disabled: {\n            height: 0,\n        },\n    };\n};\n\nexport default function TabIndicator(props: TabIndicatorProps) {\n    const {\n        coordinates,\n        disabled,\n        scrollable,\n        scrollValue,\n        style,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const rawScrollValue = scrollValue.value;\n\n        const index = Math.floor(rawScrollValue);\n        const offset = rawScrollValue % 1;\n\n        const coordinate = coordinates[index] ?? defaultCoordinate;\n        const nextCoordinate = coordinates[index + 1] ?? defaultCoordinate;\n\n        const x1 = (offset * nextCoordinate.x1 + (1 - offset) * coordinate.x1);\n        const x2 = (offset * nextCoordinate.x2 + (1 - offset) * coordinate.x2);\n\n        const leftInset = scrollable ? 12 : 0;\n        const rightInset = scrollable ? 24 : 0;\n\n        return {\n            left: x1 + leftInset,\n            width: Math.max(x2 - x1 - rightInset, 0),\n        };\n    });\n\n    return (\n        <Animated.View\n            style={[\n                styles.root,\n                disabled ? styles.disabled : undefined,\n                animatedStyle,\n                style,\n            ]}\n            {...otherProps}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;;;;;;;;;AAIA,MAAMA,SAAwC,GAAG,YAAgC;EAC7E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,eAAe,EAAEH,KAAK,CAACI,OAAN,CAAcC,SAAd,CAAwBC,IADvC;MAEFC,MAAM,EAAE,CAFN;MAGFC,MAAM,EAAE,CAHN;MAIFC,QAAQ,EAAE;IAJR,CADH;IAOHC,QAAQ,EAAE;MACNF,MAAM,EAAE;IADF;EAPP,CAAP;AAWH,CAdD;;AAgBe,SAASG,YAAT,CAAsBC,KAAtB,EAAgD;EAC3D,MAAM;IACFC,WADE;IAEFH,QAFE;IAGFI,UAHE;IAIFC,WAJE;IAKFC,KALE;IAMF,GAAGC;EAND,IAOFL,KAPJ;EASA,MAAMM,MAAM,GAAGnB,SAAS,EAAxB;EAEA,MAAMoB,aAAa,GAAG,IAAAC,uCAAA,EAAiB,MAAM;IACzC,MAAMC,cAAc,GAAGN,WAAW,CAACO,KAAnC;IAEA,MAAMC,KAAK,GAAGC,IAAI,CAACC,KAAL,CAAWJ,cAAX,CAAd;IACA,MAAMK,MAAM,GAAGL,cAAc,GAAG,CAAhC;IAEA,MAAMM,UAAU,GAAGd,WAAW,CAACU,KAAD,CAAX,IAAsBK,gCAAzC;IACA,MAAMC,cAAc,GAAGhB,WAAW,CAACU,KAAK,GAAG,CAAT,CAAX,IAA0BK,gCAAjD;IAEA,MAAME,EAAE,GAAIJ,MAAM,GAAGG,cAAc,CAACC,EAAxB,GAA6B,CAAC,IAAIJ,MAAL,IAAeC,UAAU,CAACG,EAAnE;IACA,MAAMC,EAAE,GAAIL,MAAM,GAAGG,cAAc,CAACE,EAAxB,GAA6B,CAAC,IAAIL,MAAL,IAAeC,UAAU,CAACI,EAAnE;IAEA,MAAMC,SAAS,GAAGlB,UAAU,GAAG,EAAH,GAAQ,CAApC;IACA,MAAMmB,UAAU,GAAGnB,UAAU,GAAG,EAAH,GAAQ,CAArC;IAEA,OAAO;MACHoB,IAAI,EAAEJ,EAAE,GAAGE,SADR;MAEHG,KAAK,EAAEX,IAAI,CAACY,GAAL,CAASL,EAAE,GAAGD,EAAL,GAAUG,UAAnB,EAA+B,CAA/B;IAFJ,CAAP;EAIH,CAnBqB,CAAtB;EAqBA,oBACI,6BAAC,8BAAD,CAAU,IAAV;IACI,KAAK,EAAE,CACHf,MAAM,CAAChB,IADJ,EAEHQ,QAAQ,GAAGQ,MAAM,CAACR,QAAV,GAAqB2B,SAF1B,EAGHlB,aAHG,EAIHH,KAJG;EADX,GAOQC,UAPR,EADJ;AAWH;;AAAA"}

package/build/commonjs/Tabs/Tabs.js

@@ -5,24 +5,26 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = Tabs;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _reactNative = require("react-native");
 
 var _reactNativeReanimated = require("react-native-reanimated");
 
-var _utils = require("@fountain-ui/utils");
-
 var _styles = require("../styles");
 
-var _hooks = require("../internal/hooks");
+var _TabIndicator = _interopRequireDefault(require("./TabIndicator"));
 
-var _TabCoordinate = require("./TabCoordinate");
+var _useTabsWidth = _interopRequireDefault(require("./useTabsWidth"));
 
-var _TabIndicator = _interopRequireDefault(require("./TabIndicator"));
+var _useTabCoordinates = _interopRequireDefault(require("./useTabCoordinates"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 const useStyles = function () {
@@ -41,6 +43,11 @@ const useStyles = function () {
   };
 };
 
+const ANIMATION_CONFIG = {
+  duration: 200,
+  easing: _reactNativeReanimated.Easing.out(_reactNativeReanimated.Easing.exp)
+};
+
 function Tabs(props) {
   const {
     children,
@@ -56,49 +63,43 @@ function Tabs(props) {
     ...otherProps
   } = props;
   const styles = useStyles();
-  const [containerWidth, handleLayout] = (0, _hooks.useWidth)();
-
-  const scrollViewRef = _react.default.useRef(null);
-
-  const tabCount = _react.default.Children.count(children);
-
-  const [coordinates, setCoordinates] = _react.default.useState(() => new Array(tabCount));
-
+  const [containerWidth, handleLayout] = (0, _useTabsWidth.default)();
+  const scrollViewRef = (0, _react.useRef)(null);
+  const {
+    coordinates,
+    updateCoordinate
+  } = (0, _useTabCoordinates.default)(children);
   const internalScrollValue = (0, _reactNativeReanimated.useSharedValue)(0);
-  const scrollValue = scrollValueProp || internalScrollValue;
-  const isReadyToRenderIndicator = (0, _utils.isEveryDefined)(coordinates);
-
-  _react.default.useEffect(() => {
+  const scrollValue = scrollValueProp ?? internalScrollValue;
+  const isReadyToRenderIndicator = coordinates.length > 0;
+  (0, _react.useEffect)(() => {
     const animateTab = index => {
-      internalScrollValue.value = (0, _reactNativeReanimated.withTiming)(index, {
-        duration: 200,
-        easing: _reactNativeReanimated.Easing.out(_reactNativeReanimated.Easing.exp)
-      });
+      scrollValue.value = (0, _reactNativeReanimated.withTiming)(index, ANIMATION_CONFIG);
     };
 
-    if (scrollValueProp === undefined) {
-      animateTab(indexProp);
+    animateTab(indexProp);
+  }, [indexProp, scrollValue]);
+  const scrollPosition = (0, _react.useMemo)(() => {
+    const coordinate = coordinates[indexProp - 1];
+
+    if (coordinate) {
+      const tabWidth = coordinate.x2 - coordinate.x1;
+      return Math.floor(coordinate.x1 + tabWidth / 2);
     }
-  }, [indexProp, scrollValueProp, internalScrollValue]);
-
-  _react.default.useEffect(() => {
-    const snapTab = index => {
-      const scrollView = scrollViewRef.current;
-      const coordinate = coordinates[index - 1] || _TabCoordinate.defaultCoordinate;
-
-      if (scrollView) {
-        const tabWidth = coordinate.x2 - coordinate.x1;
-        const x = coordinate.x1 + tabWidth / 2;
-        scrollView.scrollTo({
-          x,
-          y: 0,
-          animated: true
-        });
-      }
-    };
 
-    snapTab(indexProp);
-  }, [indexProp, containerWidth, coordinates]);
+    return 0;
+  }, [indexProp, coordinates]);
+  (0, _react.useEffect)(() => {
+    const scrollView = scrollViewRef.current;
+
+    if (scrollView && scrollPosition > 0) {
+      scrollView.scrollTo({
+        x: scrollPosition,
+        y: 0,
+        animated: true
+      });
+    }
+  }, [scrollPosition, containerWidth]);
 
   const tabElements = _react.default.Children.map(children, (child, index) => {
     const onLayout = event => {
@@ -106,10 +107,7 @@ function Tabs(props) {
         x,
         width
       } = event.nativeEvent.layout;
-      setCoordinates(prev => [...prev.slice(0, index), {
-        x1: x,
-        x2: x + width
-      }, ...prev.slice(index + 1)]);
+      updateCoordinate(index, x, width);
     };
 
     const onMouseDown = e => {
@@ -129,7 +127,7 @@ function Tabs(props) {
     const selected = index === indexProp;
     const enableIndicatorPlaceholder = disableIndicator ? false : isReadyToRenderIndicator ? false : selected; //@ts-ignore
 
-    return /*#__PURE__*/_react.default.cloneElement(child, {
+    return /*#__PURE__*/(0, _react.cloneElement)(child, {
       enableIndicator: enableIndicatorPlaceholder,
       onLayout,
       onPress,

package/build/commonjs/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","props","children","index","indexProp","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","scrollValue","scrollValueProp","style","variant","otherProps","styles","containerWidth","handleLayout","useWidth","scrollViewRef","React","useRef","tabCount","Children","count","coordinates","setCoordinates","useState","Array","internalScrollValue","useSharedValue","isReadyToRenderIndicator","isEveryDefined","useEffect","animateTab","value","withTiming","duration","easing","Easing","out","exp","undefined","snapTab","scrollView","current","coordinate","defaultCoordinate","tabWidth","x2","x1","x","scrollTo","y","animated","tabElements","map","child","onLayout","event","width","nativeEvent","layout","prev","slice","onMouseDown","e","preventDefault","onPress","selected","enableIndicatorPlaceholder","cloneElement","enableIndicator","indicator","css"],"sources":["Tabs.tsx"],"sourcesContent":["import React from 'react';\nimport { GestureResponderEvent, LayoutChangeEvent, ScrollView, View } from 'react-native';\nimport { Easing, useSharedValue, withTiming } from 'react-native-reanimated';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { isEveryDefined } from '@fountain-ui/utils';\nimport { css, useTheme } from '../styles';\nimport { useWidth } from '../internal/hooks';\nimport type TabsProps from './TabsProps';\nimport TabCoordinate, { defaultCoordinate } from './TabCoordinate';\nimport TabIndicator from './TabIndicator';\n\ntype TabsStyleKeys =\n    | 'root'\n    | 'fixedRoot'\n    | 'fixedTab'\n    | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n    const theme = useTheme();\n\n    return {\n        root: {},\n        fixedRoot: {\n            flexDirection: 'row',\n        },\n        fixedTab: {\n            flex: 1,\n        },\n        scrollableContainer: {\n            paddingHorizontal: theme.spacing(1),\n        },\n    };\n};\n\nexport default function Tabs(props: TabsProps) {\n    const {\n        children,\n        index: indexProp,\n        disableIndicator = false,\n        keyboardDismissMode = 'none',\n        keyboardShouldPersistTaps = 'never',\n        onChange,\n        scrollable = false,\n        scrollValue: scrollValueProp,\n        style,\n        variant = 'primary',\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const [containerWidth, handleLayout] = useWidth();\n\n    const scrollViewRef = React.useRef<ScrollView | null>(null);\n\n    const tabCount = React.Children.count(children);\n    const [coordinates, setCoordinates] = React.useState<TabCoordinate[]>(() => new Array(tabCount));\n\n    const internalScrollValue = useSharedValue(0);\n    const scrollValue = scrollValueProp || internalScrollValue;\n\n    const isReadyToRenderIndicator = isEveryDefined(coordinates);\n\n    React.useEffect(() => {\n        const animateTab = (index: number) => {\n            internalScrollValue.value = withTiming(index, {\n                duration: 200,\n                easing: Easing.out(Easing.exp),\n            });\n        };\n\n        if (scrollValueProp === undefined) {\n            animateTab(indexProp);\n        }\n    }, [indexProp, scrollValueProp, internalScrollValue]);\n\n    React.useEffect(() => {\n        const snapTab = (index: number) => {\n            const scrollView = scrollViewRef.current;\n            const coordinate: TabCoordinate = coordinates[index - 1] || defaultCoordinate;\n\n            if (scrollView) {\n                const tabWidth = coordinate.x2 - coordinate.x1;\n                const x = coordinate.x1 + tabWidth / 2;\n\n                scrollView.scrollTo({ x, y: 0, animated: true });\n            }\n        };\n\n        snapTab(indexProp);\n    }, [indexProp, containerWidth, coordinates]);\n\n    const tabElements = React.Children.map(children, (child, index) => {\n        const onLayout = (event: LayoutChangeEvent) => {\n            const { x, width } = event.nativeEvent.layout;\n\n            setCoordinates(prev => ([\n                ...prev.slice(0, index),\n                { x1: x, x2: x + width },\n                ...prev.slice(index + 1),\n            ]));\n        };\n\n        const onMouseDown = (e: GestureResponderEvent) => {\n            if (keyboardShouldPersistTaps === 'always') {\n                e.preventDefault();\n            }\n        };\n\n        const onPress = () => {\n            onChange?.(index);\n            // @ts-ignore\n            child.props.onPress?.();\n        };\n\n        const selected = index === indexProp;\n        const enableIndicatorPlaceholder = disableIndicator\n            ? false\n            : (isReadyToRenderIndicator ? false : selected);\n\n        //@ts-ignore\n        return React.cloneElement(child, {\n            enableIndicator: enableIndicatorPlaceholder,\n            onLayout,\n            onPress,\n            onMouseDown,\n            variant,\n            selected,\n            style: scrollable ? undefined : styles.fixedTab,\n        });\n    });\n\n    const indicator = (\n        <TabIndicator\n            coordinates={coordinates}\n            disabled={disableIndicator}\n            scrollable={scrollable}\n            scrollValue={scrollValue}\n        />\n    );\n\n    return (\n        <View\n            onLayout={handleLayout}\n            style={css([\n                styles.root,\n                scrollable ? undefined : styles.fixedRoot,\n                style,\n            ])}\n            {...otherProps}\n        >\n            {scrollable ? (\n                <ScrollView\n                    automaticallyAdjustContentInsets={false}\n                    bounces={false}\n                    contentContainerStyle={styles.scrollableContainer}\n                    directionalLockEnabled={true}\n                    horizontal={true}\n                    ref={scrollViewRef}\n                    scrollsToTop={false}\n                    showsHorizontalScrollIndicator={false}\n                    showsVerticalScrollIndicator={false}\n                    keyboardDismissMode={keyboardDismissMode}\n                    keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n                >\n                    {tabElements}\n                    {indicator}\n                </ScrollView>\n            ) : (\n                <>\n                    {tabElements}\n                    {indicator}\n                </>\n            )}\n        </View>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["useStyles","theme","useTheme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","ANIMATION_CONFIG","duration","easing","Easing","out","exp","Tabs","props","children","index","indexProp","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","scrollValue","scrollValueProp","style","variant","otherProps","styles","containerWidth","handleLayout","useTabsWidth","scrollViewRef","useRef","coordinates","updateCoordinate","useTabCoordinates","internalScrollValue","useSharedValue","isReadyToRenderIndicator","length","useEffect","animateTab","value","withTiming","scrollPosition","useMemo","coordinate","tabWidth","x2","x1","Math","floor","scrollView","current","scrollTo","x","y","animated","tabElements","React","Children","map","child","onLayout","event","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","selected","enableIndicatorPlaceholder","cloneElement","enableIndicator","undefined","indicator","css"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, useEffect, useMemo, useRef } from 'react';\nimport { GestureResponderEvent, LayoutChangeEvent, ScrollView, View } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport { Easing, useSharedValue, withTiming } from 'react-native-reanimated';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type TabsProps from './TabsProps';\nimport TabIndicator from './TabIndicator';\nimport useTabsWidth from './useTabsWidth';\nimport useTabCoordinates from './useTabCoordinates';\n\ntype TabsStyleKeys =\n    | 'root'\n    | 'fixedRoot'\n    | 'fixedTab'\n    | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n    const theme = useTheme();\n\n    return {\n        root: {},\n        fixedRoot: {\n            flexDirection: 'row',\n        },\n        fixedTab: {\n            flex: 1,\n        },\n        scrollableContainer: {\n            paddingHorizontal: theme.spacing(1),\n        },\n    };\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = {\n    duration: 200,\n    easing: Easing.out(Easing.exp),\n};\n\nexport default function Tabs(props: TabsProps) {\n    const {\n        children,\n        index: indexProp,\n        disableIndicator = false,\n        keyboardDismissMode = 'none',\n        keyboardShouldPersistTaps = 'never',\n        onChange,\n        scrollable = false,\n        scrollValue: scrollValueProp,\n        style,\n        variant = 'primary',\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const [containerWidth, handleLayout] = useTabsWidth();\n\n    const scrollViewRef = useRef<ScrollView | null>(null);\n\n    const { coordinates, updateCoordinate } = useTabCoordinates(children);\n\n    const internalScrollValue = useSharedValue(0);\n    const scrollValue = scrollValueProp ?? internalScrollValue;\n\n    const isReadyToRenderIndicator = coordinates.length > 0;\n\n    useEffect(() => {\n        const animateTab = (index: number) => {\n            scrollValue.value = withTiming(index, ANIMATION_CONFIG);\n        };\n\n        animateTab(indexProp);\n    }, [indexProp, scrollValue]);\n\n    const scrollPosition = useMemo<number>(() => {\n        const coordinate = coordinates[indexProp - 1];\n\n        if (coordinate) {\n            const tabWidth = coordinate.x2 - coordinate.x1;\n            return Math.floor(coordinate.x1 + tabWidth / 2);\n        }\n\n        return 0;\n    }, [indexProp, coordinates]);\n\n    useEffect(() => {\n        const scrollView = scrollViewRef.current;\n\n        if (scrollView && scrollPosition > 0) {\n            scrollView.scrollTo({ x: scrollPosition, y: 0, animated: true });\n        }\n    }, [scrollPosition, containerWidth]);\n\n    const tabElements = React.Children.map(children, (child, index) => {\n        const onLayout = (event: LayoutChangeEvent) => {\n            const { x, width } = event.nativeEvent.layout;\n\n            updateCoordinate(index, x, width);\n        };\n\n        const onMouseDown = (e: GestureResponderEvent) => {\n            if (keyboardShouldPersistTaps === 'always') {\n                e.preventDefault();\n            }\n        };\n\n        const onPress = () => {\n            onChange?.(index);\n            // @ts-ignore\n            child.props.onPress?.();\n        };\n\n        const selected = index === indexProp;\n        const enableIndicatorPlaceholder = disableIndicator\n            ? false\n            : (isReadyToRenderIndicator ? false : selected);\n\n        //@ts-ignore\n        return cloneElement(child, {\n            enableIndicator: enableIndicatorPlaceholder,\n            onLayout,\n            onPress,\n            onMouseDown,\n            variant,\n            selected,\n            style: scrollable ? undefined : styles.fixedTab,\n        });\n    });\n\n    const indicator = (\n        <TabIndicator\n            coordinates={coordinates}\n            disabled={disableIndicator}\n            scrollable={scrollable}\n            scrollValue={scrollValue}\n        />\n    );\n\n    return (\n        <View\n            onLayout={handleLayout}\n            style={css([\n                styles.root,\n                scrollable ? undefined : styles.fixedRoot,\n                style,\n            ])}\n            {...otherProps}\n        >\n            {scrollable ? (\n                <ScrollView\n                    automaticallyAdjustContentInsets={false}\n                    bounces={false}\n                    contentContainerStyle={styles.scrollableContainer}\n                    directionalLockEnabled={true}\n                    horizontal={true}\n                    ref={scrollViewRef}\n                    scrollsToTop={false}\n                    showsHorizontalScrollIndicator={false}\n                    showsVerticalScrollIndicator={false}\n                    keyboardDismissMode={keyboardDismissMode}\n                    keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n                >\n                    {tabElements}\n                    {indicator}\n                </ScrollView>\n            ) : (\n                <React.Fragment>\n                    {tabElements}\n                    {indicator}\n                </React.Fragment>\n            )}\n        </View>\n    );\n};\n"],"mappings":"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"}

package/build/commonjs/Tabs/useTabCoordinates.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useTabCoordinates;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _utils = require("@fountain-ui/utils");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function useTabCoordinates(tabElements) {
+  const incompleteCoordinatesRef = (0, _react.useRef)([]);
+  const [completeCoordinates, setCompleteCoordinates] = (0, _react.useState)([]);
+
+  const isAllCoordinatesDefined = coordinates => {
+    const numberOfTab = _react.default.Children.count(tabElements);
+
+    const numberOfCoordinates = coordinates.length;
+    const everyCoordinatesDefined = (0, _utils.isEveryDefined)(coordinates);
+    return numberOfTab === numberOfCoordinates && everyCoordinatesDefined;
+  };
+
+  const updateCoordinate = (index, x, width) => {
+    incompleteCoordinatesRef.current[index] = {
+      x1: x,
+      x2: x + width
+    };
+
+    if (isAllCoordinatesDefined(incompleteCoordinatesRef.current)) {
+      setCompleteCoordinates(incompleteCoordinatesRef.current);
+    }
+  };
+
+  return {
+    coordinates: completeCoordinates,
+    updateCoordinate
+  };
+}
+//# sourceMappingURL=useTabCoordinates.js.map

package/build/commonjs/Tabs/useTabCoordinates.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useTabCoordinates","tabElements","incompleteCoordinatesRef","useRef","completeCoordinates","setCompleteCoordinates","useState","isAllCoordinatesDefined","coordinates","numberOfTab","React","Children","count","numberOfCoordinates","length","everyCoordinatesDefined","isEveryDefined","updateCoordinate","index","x","width","current","x1","x2"],"sources":["useTabCoordinates.ts"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { isEveryDefined } from '@fountain-ui/utils';\nimport TabCoordinate from './TabCoordinate';\n\nexport interface UseTabCoordinates {\n    coordinates: TabCoordinate[];\n    updateCoordinate: (index: number, x: number, width: number) => void;\n}\n\nexport default function useTabCoordinates(tabElements: React.ReactNode): UseTabCoordinates {\n    const incompleteCoordinatesRef = useRef<TabCoordinate[]>([]);\n\n    const [completeCoordinates, setCompleteCoordinates] = useState<TabCoordinate[]>([]);\n\n    const isAllCoordinatesDefined = (coordinates: TabCoordinate[]): boolean => {\n        const numberOfTab = React.Children.count(tabElements);\n        const numberOfCoordinates = coordinates.length;\n\n        const everyCoordinatesDefined = isEveryDefined(coordinates);\n\n        return numberOfTab === numberOfCoordinates && everyCoordinatesDefined;\n    };\n\n    const updateCoordinate = (index: number, x: number, width: number) => {\n        incompleteCoordinatesRef.current[index] = { x1: x, x2: x + width };\n\n        if (isAllCoordinatesDefined(incompleteCoordinatesRef.current)) {\n            setCompleteCoordinates(incompleteCoordinatesRef.current);\n        }\n    };\n\n    return {\n        coordinates: completeCoordinates,\n        updateCoordinate,\n    };\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;;;;;AAQe,SAASA,iBAAT,CAA2BC,WAA3B,EAA4E;EACvF,MAAMC,wBAAwB,GAAG,IAAAC,aAAA,EAAwB,EAAxB,CAAjC;EAEA,MAAM,CAACC,mBAAD,EAAsBC,sBAAtB,IAAgD,IAAAC,eAAA,EAA0B,EAA1B,CAAtD;;EAEA,MAAMC,uBAAuB,GAAIC,WAAD,IAA2C;IACvE,MAAMC,WAAW,GAAGC,cAAA,CAAMC,QAAN,CAAeC,KAAf,CAAqBX,WAArB,CAApB;;IACA,MAAMY,mBAAmB,GAAGL,WAAW,CAACM,MAAxC;IAEA,MAAMC,uBAAuB,GAAG,IAAAC,qBAAA,EAAeR,WAAf,CAAhC;IAEA,OAAOC,WAAW,KAAKI,mBAAhB,IAAuCE,uBAA9C;EACH,CAPD;;EASA,MAAME,gBAAgB,GAAG,CAACC,KAAD,EAAgBC,CAAhB,EAA2BC,KAA3B,KAA6C;IAClElB,wBAAwB,CAACmB,OAAzB,CAAiCH,KAAjC,IAA0C;MAAEI,EAAE,EAAEH,CAAN;MAASI,EAAE,EAAEJ,CAAC,GAAGC;IAAjB,CAA1C;;IAEA,IAAIb,uBAAuB,CAACL,wBAAwB,CAACmB,OAA1B,CAA3B,EAA+D;MAC3DhB,sBAAsB,CAACH,wBAAwB,CAACmB,OAA1B,CAAtB;IACH;EACJ,CAND;;EAQA,OAAO;IACHb,WAAW,EAAEJ,mBADV;IAEHa;EAFG,CAAP;AAIH"}

package/build/commonjs/Tabs/useTabsWidth.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useTabsWidth;
+
+var _react = require("react");
+
+var _reactNative = require("react-native");
+
+const assumeInitialWidth = () => _reactNative.Dimensions.get('window').width;
+
+const isIntegerPartEquals = (a, b) => Math.round(a) === Math.round(b);
+
+const isIntegerPartDifferent = (a, b) => !isIntegerPartEquals(a, b);
+
+function useTabsWidth() {
+  const [width, setWidth] = (0, _react.useState)(assumeInitialWidth);
+  const onLayout = (0, _react.useCallback)(e => {
+    const newWidth = e.nativeEvent.layout.width;
+    setWidth(prevWidth => isIntegerPartDifferent(prevWidth, newWidth) ? newWidth : prevWidth);
+  }, []);
+  return [width, onLayout];
+}
+//# sourceMappingURL=useTabsWidth.js.map

package/build/commonjs/Tabs/useTabsWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["assumeInitialWidth","Dimensions","get","width","isIntegerPartEquals","a","b","Math","round","isIntegerPartDifferent","useTabsWidth","setWidth","useState","onLayout","useCallback","e","newWidth","nativeEvent","layout","prevWidth"],"sources":["useTabsWidth.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport { Dimensions, LayoutChangeEvent, ViewProps } from 'react-native';\n\nconst assumeInitialWidth = (): number => Dimensions.get('window').width;\n\nconst isIntegerPartEquals = (a: number, b: number) => Math.round(a) === Math.round(b);\n\nconst isIntegerPartDifferent = (a: number, b: number) => !isIntegerPartEquals(a, b);\n\nexport default function useTabsWidth(): [number, ViewProps['onLayout']] {\n    const [width, setWidth] = useState(assumeInitialWidth);\n\n    const onLayout = useCallback((e: LayoutChangeEvent) => {\n        const newWidth = e.nativeEvent.layout.width;\n\n        setWidth((prevWidth) => isIntegerPartDifferent(prevWidth, newWidth) ? newWidth : prevWidth);\n    }, []);\n\n    return [width, onLayout];\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA,MAAMA,kBAAkB,GAAG,MAAcC,uBAAA,CAAWC,GAAX,CAAe,QAAf,EAAyBC,KAAlE;;AAEA,MAAMC,mBAAmB,GAAG,CAACC,CAAD,EAAYC,CAAZ,KAA0BC,IAAI,CAACC,KAAL,CAAWH,CAAX,MAAkBE,IAAI,CAACC,KAAL,CAAWF,CAAX,CAAxE;;AAEA,MAAMG,sBAAsB,GAAG,CAACJ,CAAD,EAAYC,CAAZ,KAA0B,CAACF,mBAAmB,CAACC,CAAD,EAAIC,CAAJ,CAA7E;;AAEe,SAASI,YAAT,GAAyD;EACpE,MAAM,CAACP,KAAD,EAAQQ,QAAR,IAAoB,IAAAC,eAAA,EAASZ,kBAAT,CAA1B;EAEA,MAAMa,QAAQ,GAAG,IAAAC,kBAAA,EAAaC,CAAD,IAA0B;IACnD,MAAMC,QAAQ,GAAGD,CAAC,CAACE,WAAF,CAAcC,MAAd,CAAqBf,KAAtC;IAEAQ,QAAQ,CAAEQ,SAAD,IAAeV,sBAAsB,CAACU,SAAD,EAAYH,QAAZ,CAAtB,GAA8CA,QAA9C,GAAyDG,SAAzE,CAAR;EACH,CAJgB,EAId,EAJc,CAAjB;EAMA,OAAO,CAAChB,KAAD,EAAQU,QAAR,CAAP;AACH"}

package/build/commonjs/hooks/useCollapsibleAppBar.js

@@ -45,21 +45,37 @@ function useCollapsibleAppBar() {
   const overlapped = (0, _reactNativeReanimated.useSharedValue)(false);
   const elevationStyle = (0, _useElevationStyle.default)(4);
   const animatedStyle = (0, _reactNativeReanimated.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
-    };
+    if (_reactNative.Platform.OS === 'web') {
+      return {
+        transform: [{
+          translateY: translateY.value
+        }],
+        boxShadow: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.boxShadow : 0
+      };
+    }
+
+    if (_reactNative.Platform.OS === 'android') {
+      return {
+        transform: [{
+          translateY: translateY.value
+        }],
+        elevation: overlapped.value ? elevationStyle === null || elevationStyle === void 0 ? void 0 : elevationStyle.elevation : 0
+      };
+    }
+
+    if (_reactNative.Platform.OS === 'ios') {
+      return {
+        transform: [{
+          translateY: translateY.value
+        }],
+        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
+      };
+    }
+
+    return {};
   });
 
   const indexRef = _react.default.useRef(0);

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

@@ -1 +1 @@
-{"version":3,"names":["defaultOptions","keyboardDismissMode","ANIMATION_DURATION_MILLIS","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","useElevationStyle","animatedStyle","useAnimatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","React","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","duration","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","Keyboard","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import React from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport {\n    runOnJS,\n    useAnimatedScrollHandler,\n    useAnimatedStyle,\n    useDerivedValue,\n    useSharedValue,\n    withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useElevationStyle from './useElevationStyle';\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    keyboardDismissMode?: 'none' | 'on-drag';\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    keyboardDismissMode: 'none',\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 { keyboardDismissMode }: 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 = useDerivedValue(() => -collapsibleToolbarHeight);\n\n    const translateY = useSharedValue<number>(0);\n    const lastTranslateY = useSharedValue<number>(0);\n    const lastOffsetY = useSharedValue<number>(0);\n    const overlapped = useSharedValue<boolean>(false);\n\n    const elevationStyle = useElevationStyle(4);\n    const animatedStyle = 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 = withTiming(0, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        }\n    };\n\n    const scrollHandler = useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            if (keyboardDismissMode === 'on-drag') {\n                runOnJS(Keyboard.dismiss)();\n            }\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 = withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                } else {\n                    if (ty === maxTy) {\n                        translateY.value = 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 = withTiming(nextTranslateY, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        { paddingTop: safeAreaInsets.top },\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"],"mappings":"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"}
+{"version":3,"names":["defaultOptions","keyboardDismissMode","ANIMATION_DURATION_MILLIS","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","useElevationStyle","animatedStyle","useAnimatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","React","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","duration","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","Keyboard","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import React from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport {\n    runOnJS,\n    useAnimatedScrollHandler,\n    useAnimatedStyle,\n    useDerivedValue,\n    useSharedValue,\n    withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useElevationStyle from './useElevationStyle';\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    keyboardDismissMode?: 'none' | 'on-drag';\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    keyboardDismissMode: 'none',\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 { keyboardDismissMode }: 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 = useDerivedValue(() => -collapsibleToolbarHeight);\n\n    const translateY = useSharedValue<number>(0);\n    const lastTranslateY = useSharedValue<number>(0);\n    const lastOffsetY = useSharedValue<number>(0);\n    const overlapped = useSharedValue<boolean>(false);\n\n    const elevationStyle = useElevationStyle(4);\n    const animatedStyle = useAnimatedStyle(() => {\n        if (Platform.OS === 'web') {\n            return {\n                transform: [{ translateY: translateY.value }],\n                boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n            };\n        }\n        if (Platform.OS === 'android') {\n            return {\n                transform: [{ translateY: translateY.value }],\n                elevation: overlapped.value ? elevationStyle?.elevation : 0,\n            };\n        }\n        if (Platform.OS === 'ios') {\n            return {\n                transform: [{ translateY: translateY.value }],\n                shadowColor: elevationStyle?.shadowColor,\n                shadowOffset: elevationStyle?.shadowOffset,\n                shadowRadius: elevationStyle?.shadowRadius,\n                shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n            };\n        }\n        return {};\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 = withTiming(0, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        }\n    };\n\n    const scrollHandler = useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            if (keyboardDismissMode === 'on-drag') {\n                runOnJS(Keyboard.dismiss)();\n            }\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 = withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {\n                            duration: ANIMATION_DURATION_MILLIS,\n                        });\n                    }\n                } else {\n                    if (ty === maxTy) {\n                        translateY.value = 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 = withTiming(nextTranslateY, {\n                duration: ANIMATION_DURATION_MILLIS,\n            });\n        },\n    });\n\n    const hasCollapsible = collapsibleToolbarHeight > 0;\n\n    const appBarStyle = [\n        animatedStyle,\n        { paddingTop: safeAreaInsets.top },\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"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;;;AA8BA,MAAMA,cAAiC,GAAG;EACtCC,mBAAmB,EAAE;AADiB,CAA1C;AAIA,MAAMC,yBAAyB,GAAG,GAAlC;AAEA,MAAMC,uBAAuB,GAAGC,qBAAA,CAASC,EAAT,KAAgB,KAAhD;;AAEe,SAASC,oBAAT,GAAwF;EAAA,IAA1DC,WAA0D,uEAAnCP,cAAmC;EACnG,MAAM;IAAEC;EAAF,IAA6C,EAC/C,GAAGD,cAD4C;IAE/C,GAAGO;EAF4C,CAAnD;EAKA,MAAMC,MAAM,GAAG,IAAAC,wBAAA,GAAf;EAEA,MAAMC,cAAc,GAAG,IAAAC,6CAAA,GAAvB;EAEA,MAAM,CAACC,YAAD,EAAeC,cAAf,IAAiC,IAAAC,gBAAA,GAAvC;EACA,MAAM,CAACC,wBAAD,EAA2BC,0BAA3B,IAAyD,IAAAF,gBAAA,GAA/D;EAEA,MAAMG,aAAa,GAAG,IAAAC,sCAAA,EAAgB,MAAM,CAACH,wBAAvB,CAAtB;EAEA,MAAMI,UAAU,GAAG,IAAAC,qCAAA,EAAuB,CAAvB,CAAnB;EACA,MAAMC,cAAc,GAAG,IAAAD,qCAAA,EAAuB,CAAvB,CAAvB;EACA,MAAME,WAAW,GAAG,IAAAF,qCAAA,EAAuB,CAAvB,CAApB;EACA,MAAMG,UAAU,GAAG,IAAAH,qCAAA,EAAwB,KAAxB,CAAnB;EAEA,MAAMI,cAAc,GAAG,IAAAC,0BAAA,EAAkB,CAAlB,CAAvB;EACA,MAAMC,aAAa,GAAG,IAAAC,uCAAA,EAAiB,MAAM;IACzC,IAAIvB,qBAAA,CAASC,EAAT,KAAgB,KAApB,EAA2B;MACvB,OAAO;QACHuB,SAAS,EAAE,CAAC;UAAET,UAAU,EAAEA,UAAU,CAACU;QAAzB,CAAD,CADR;QAEHC,SAAS,EAAEP,UAAU,CAACM,KAAX,GAAmBL,cAAnB,aAAmBA,cAAnB,uBAAmBA,cAAc,CAAEM,SAAnC,GAA+C;MAFvD,CAAP;IAIH;;IACD,IAAI1B,qBAAA,CAASC,EAAT,KAAgB,SAApB,EAA+B;MAC3B,OAAO;QACHuB,SAAS,EAAE,CAAC;UAAET,UAAU,EAAEA,UAAU,CAACU;QAAzB,CAAD,CADR;QAEHE,SAAS,EAAER,UAAU,CAACM,KAAX,GAAmBL,cAAnB,aAAmBA,cAAnB,uBAAmBA,cAAc,CAAEO,SAAnC,GAA+C;MAFvD,CAAP;IAIH;;IACD,IAAI3B,qBAAA,CAASC,EAAT,KAAgB,KAApB,EAA2B;MACvB,OAAO;QACHuB,SAAS,EAAE,CAAC;UAAET,UAAU,EAAEA,UAAU,CAACU;QAAzB,CAAD,CADR;QAEHG,WAAW,EAAER,cAAF,aAAEA,cAAF,uBAAEA,cAAc,CAAEQ,WAF1B;QAGHC,YAAY,EAAET,cAAF,aAAEA,cAAF,uBAAEA,cAAc,CAAES,YAH3B;QAIHC,YAAY,EAAEV,cAAF,aAAEA,cAAF,uBAAEA,cAAc,CAAEU,YAJ3B;QAKHC,aAAa,EAAEZ,UAAU,CAACM,KAAX,GAAmBL,cAAnB,aAAmBA,cAAnB,uBAAmBA,cAAc,CAAEW,aAAnC,GAAmD;MAL/D,CAAP;IAOH;;IACD,OAAO,EAAP;EACH,CAvBqB,CAAtB;;EAyBA,MAAMC,QAAQ,GAAGC,cAAA,CAAMC,MAAN,CAAqB,CAArB,CAAjB;;EACA,MAAMC,UAAU,GAAGF,cAAA,CAAMC,MAAN,CAA4B,EAA5B,CAAnB;;EAEA,MAAME,mBAAmB,GAAIC,SAAD,IAAuB;IAC/C,MAAMC,SAAS,GAAGN,QAAQ,CAACO,OAA3B;;IACA,IAAID,SAAS,KAAKD,SAAlB,EAA6B;MACzB;IACH;;IAEDF,UAAU,CAACI,OAAX,CAAmBD,SAAnB,IAAgCpB,WAAW,CAACO,KAA5C;IAEA,MAAMe,YAAY,GAAGL,UAAU,CAACI,OAAX,CAAmBF,SAAnB,KAAiC,CAAtD;IACAnB,WAAW,CAACO,KAAZ,GAAoBe,YAApB;IAEAR,QAAQ,CAACO,OAAT,GAAmBF,SAAnB,CAX+C,CAa/C;;IACAlB,UAAU,CAACM,KAAX,GAAmBe,YAAY,GAAG,CAAlC,CAd+C,CAgB/C;;IACA,IAAIzB,UAAU,CAACU,KAAX,GAAmB,CAAnB,IAAwBe,YAAY,GAAGhC,YAA3C,EAAyD;MACrDO,UAAU,CAACU,KAAX,GAAmB,IAAAgB,iCAAA,EAAW,CAAX,EAAc;QAC7BC,QAAQ,EAAE5C;MADmB,CAAd,CAAnB;IAGH;EACJ,CAtBD;;EAwBA,MAAM6C,aAAa,GAAG,IAAAC,+CAAA,EAAyB;IAC3CC,WAAW,EAAE,MAAM;MACf,IAAIhD,mBAAmB,KAAK,SAA5B,EAAuC;QACnC,IAAAiD,8BAAA,EAAQC,qBAAA,CAASC,OAAjB;MACH;;MACD/B,cAAc,CAACQ,KAAf,GAAuBV,UAAU,CAACU,KAAlC;IACH,CAN0C;IAO3CwB,eAAe,EAAE,MAAM;MACnBhC,cAAc,CAACQ,KAAf,GAAuBV,UAAU,CAACU,KAAlC;IACH,CAT0C;IAU3CyB,QAAQ,EAAGC,KAAD,IAAW;MACjB,MAAMC,OAAO,GAAGD,KAAK,CAACE,aAAN,CAAoBC,CAApC;MAEA,MAAMC,EAAE,GAAGxC,UAAU,CAACU,KAAtB;MACA,MAAM+B,KAAK,GAAG3C,aAAa,CAACY,KAA5B;;MAEA,IAAI1B,uBAAJ,EAA6B;QACzB,MAAM0D,EAAE,GAAGL,OAAO,GAAGlC,WAAW,CAACO,KAAjC;QAEAV,UAAU,CAACU,KAAX,GAAmB2B,OAAO,IAAI,CAAX,GAAe,CAAf,GAAmBM,IAAI,CAACC,GAAL,CAASD,IAAI,CAACE,GAAL,CAAS3C,cAAc,CAACQ,KAAf,GAAuBgC,EAAhC,EAAoCD,KAApC,CAAT,EAAqD,CAArD,CAAtC;QAEArC,UAAU,CAACM,KAAX,GAAmB2B,OAAO,GAAGrC,UAAU,CAACU,KAArB,GAA6B,CAAhD;MACH,CAND,MAMO;QACH,IAAI2B,OAAO,GAAG,CAACI,KAAf,EAAsB;UAClB,IAAID,EAAE,KAAK,CAAX,EAAc;YACVxC,UAAU,CAACU,KAAX,GAAmB,IAAAgB,iCAAA,EAAWiB,IAAI,CAACC,GAAL,CAASD,IAAI,CAACE,GAAL,CAAS,CAACR,OAAV,EAAmBI,KAAnB,CAAT,EAAoC,CAApC,CAAX,EAAmD;cAClEd,QAAQ,EAAE5C;YADwD,CAAnD,CAAnB;UAGH;QACJ,CAND,MAMO;UACH,IAAIyD,EAAE,KAAKC,KAAX,EAAkB;YACdzC,UAAU,CAACU,KAAX,GAAmB,IAAAgB,iCAAA,EAAW,CAAX,EAAc;cAC7BC,QAAQ,EAAE5C;YADmB,CAAd,CAAnB;UAGH;QACJ;;QAEDqB,UAAU,CAACM,KAAX,GAAmB2B,OAAO,GAAG,CAA7B;QAEAlC,WAAW,CAACO,KAAZ,GAAoB2B,OAApB;MACH;IACJ,CAzC0C;IA0C3CS,SAAS,EAAGV,KAAD,IAAW;MAClBjC,WAAW,CAACO,KAAZ,GAAoB0B,KAAK,CAACE,aAAN,CAAoBC,CAAxC;IACH,CA5C0C;IA6C3CQ,aAAa,EAAGX,KAAD,IAAW;MACtB,MAAMC,OAAO,GAAGD,KAAK,CAACE,aAAN,CAAoBC,CAApC;MAEApC,WAAW,CAACO,KAAZ,GAAoB2B,OAApB;MAEA,MAAMG,EAAE,GAAGxC,UAAU,CAACU,KAAtB;MACA,MAAM+B,KAAK,GAAG3C,aAAa,CAACY,KAA5B,CANsB,CAQtB;;MACA,IAAI8B,EAAE,IAAIC,KAAN,IAAeD,EAAE,IAAI,CAAzB,EAA4B;QACxB;MACH;;MAED,MAAMQ,SAAS,GAAGP,KAAK,GAAG,GAA1B;MAEA,MAAMQ,cAAc,GAAIT,EAAE,GAAGQ,SAAL,IAAkBX,OAAO,GAAG5C,YAA7B,GAA6C,CAA7C,GAAiDgD,KAAxE;MAEArC,UAAU,CAACM,KAAX,GAAmB2B,OAAO,GAAGY,cAAV,GAA2B,CAA9C;MAEAjD,UAAU,CAACU,KAAX,GAAmB,IAAAgB,iCAAA,EAAWuB,cAAX,EAA2B;QAC1CtB,QAAQ,EAAE5C;MADgC,CAA3B,CAAnB;IAGH;EAnE0C,CAAzB,CAAtB;EAsEA,MAAMmE,cAAc,GAAGtD,wBAAwB,GAAG,CAAlD;EAEA,MAAMuD,WAAW,GAAG,CAChB5C,aADgB,EAEhB;IAAE6C,UAAU,EAAE7D,cAAc,CAAC8D;EAA7B,CAFgB,EAGhBH,cAAc,GAAG7D,MAAM,CAACiE,QAAV,GAAqBC,SAHnB,CAApB;EAMA,OAAO;IACHJ,WADG;IAEHzD,cAFG;IAGHG,0BAHG;IAIHsC,QAAQ,EAAEP,aAJP;IAKHP,mBALG;IAMHmC,mBAAmB,EAAE;MAAEH,GAAG,EAAEH,cAAc,GAAGzD,YAAH,GAAkB;IAAvC;EANlB,CAAP;AAQH;;AAAA"}

package/build/commonjs/hooks/useFadeInAppBar.js

@@ -62,14 +62,32 @@ function useFadeInAppBar() {
 
   const [r, g, b] = _react.default.useMemo(() => (0, _utils.rgb)(backgroundColor), [backgroundColor]);
 
-  const animatedAppBarStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
-    backgroundColor: `rgba(${r}, ${g}, ${b}, ${normalized.value})`,
-    elevation: normalized.value >= 1 ? 6 : 0,
-    shadowColor: '#000',
-    shadowOffset,
-    shadowRadius: 4.65,
-    shadowOpacity: normalized.value >= 1 ? 0.25 : 0
-  }));
+  const animatedAppBarStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    if (_reactNative.Platform.OS === 'web') {
+      return {
+        backgroundColor: `rgba(${r}, ${g}, ${b}, ${normalized.value})`
+      };
+    }
+
+    if (_reactNative.Platform.OS === 'android') {
+      return {
+        backgroundColor: `rgba(${r}, ${g}, ${b}, ${normalized.value})`,
+        elevation: normalized.value >= 1 ? 6 : 0
+      };
+    }
+
+    if (_reactNative.Platform.OS === 'ios') {
+      return {
+        backgroundColor: `rgba(${r}, ${g}, ${b}, ${normalized.value})`,
+        shadowColor: '#000',
+        shadowOffset,
+        shadowRadius: 4.65,
+        shadowOpacity: normalized.value >= 1 ? 0.25 : 0
+      };
+    }
+
+    return {};
+  });
   const animatedTitleStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
     opacity: normalized.value
   }));

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

@@ -1 +1 @@
-{"version":3,"names":["defaultOptions","fadeInBeginY","endY","appBarHeight","fadeInEndY","floating","keyboardDismissMode","shadowOffset","Platform","OS","width","height","undefined","useFadeInAppBar","userOptions","theme","useTheme","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","onAppBarLayout","useHeight","fromOffsetY","toOffsetY","React","useMemo","beginY","dy","useSharedValue","lastOffsetY","normalized","backgroundColor","palette","background","default","r","g","b","rgb","animatedAppBarStyle","useAnimatedStyle","value","elevation","shadowColor","shadowRadius","shadowOpacity","animatedTitleStyle","opacity","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","Keyboard","dismiss","onScroll","event","offsetY","contentOffset","y","distance","Math","max","localOffsetY","min","onEndDrag","onMomentumEnd","appBarStyle","paddingTop","top","titleStyle"],"sources":["useFadeInAppBar.ts"],"sourcesContent":["import React from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { SharedValue } from 'react-native-reanimated';\nimport { runOnJS, useAnimatedScrollHandler, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { rgb } from '@fountain-ui/utils';\nimport { useHeight } from '../internal/hooks';\nimport { useTheme } from '../styles';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface Options {\n    fadeInBeginY?: number | ((endY: number, appBarHeight: number) => number);\n    fadeInEndY?: number | ((appBarHeight: number) => number);\n    floating?: boolean;\n    keyboardDismissMode?: 'none' | 'on-drag';\n}\n\nexport interface FadeInAppBar {\n    appBarStyle: ViewStyleProp;\n    titleStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    dy: SharedValue<number>;\n    normalized: SharedValue<number>;\n}\n\nconst defaultOptions: Required<Options> = {\n    fadeInBeginY: (endY, appBarHeight) => endY - appBarHeight,\n    fadeInEndY: (appBarHeight) => appBarHeight,\n    floating: true,\n    keyboardDismissMode: 'none',\n};\n\nconst shadowOffset = Platform.OS === 'ios' ? { width: 0, height: 3 } : undefined;\n\nexport default function useFadeInAppBar(userOptions: Options = defaultOptions): FadeInAppBar {\n    const {\n        fadeInBeginY,\n        fadeInEndY,\n        floating,\n        keyboardDismissMode,\n    }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const theme = useTheme();\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n\n    const [fromOffsetY, toOffsetY] = React.useMemo(() => {\n        const endY = typeof fadeInEndY === 'function'\n            ? fadeInEndY(appBarHeight)\n            : fadeInEndY;\n\n        const beginY = typeof fadeInBeginY === 'function'\n            ? fadeInBeginY(endY, appBarHeight)\n            : fadeInBeginY;\n\n        return [beginY, endY];\n    }, [fadeInBeginY, fadeInBeginY, appBarHeight]);\n\n    const dy = useSharedValue<number>(0);\n    const lastOffsetY = useSharedValue<number>(0);\n    const normalized = useSharedValue<number>(0);\n\n    const backgroundColor = theme.palette.background.default;\n    const [r, g, b] = React.useMemo(() => rgb(backgroundColor), [backgroundColor]);\n\n    const animatedAppBarStyle = useAnimatedStyle(() => ({\n        backgroundColor: `rgba(${r}, ${g}, ${b}, ${normalized.value})`,\n        elevation: normalized.value >= 1 ? 6 : 0,\n        shadowColor: '#000',\n        shadowOffset,\n        shadowRadius: 4.65,\n        shadowOpacity: normalized.value >= 1 ? 0.25 : 0,\n    }));\n\n    const animatedTitleStyle = useAnimatedStyle(() => ({\n        opacity: normalized.value,\n    }));\n\n    const scrollHandler = useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            if (keyboardDismissMode === 'on-drag') {\n                runOnJS(Keyboard.dismiss)();\n            }\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            const distance = Math.max(toOffsetY - fromOffsetY, 1);\n            const localOffsetY = offsetY - fromOffsetY;\n\n            dy.value = offsetY - lastOffsetY.value;\n\n            normalized.value = Math.min(Math.max(localOffsetY / distance, 0), 1);\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n    });\n\n    const appBarStyle = [\n        animatedAppBarStyle,\n        { paddingTop: safeAreaInsets.top },\n        floating ? styles.floating : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        titleStyle: [animatedTitleStyle],\n        onAppBarLayout,\n        onScroll: scrollHandler,\n        dy,\n        normalized,\n    };\n};\n"],"mappings":"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"}
+{"version":3,"names":["defaultOptions","fadeInBeginY","endY","appBarHeight","fadeInEndY","floating","keyboardDismissMode","shadowOffset","Platform","OS","width","height","undefined","useFadeInAppBar","userOptions","theme","useTheme","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","onAppBarLayout","useHeight","fromOffsetY","toOffsetY","React","useMemo","beginY","dy","useSharedValue","lastOffsetY","normalized","backgroundColor","palette","background","default","r","g","b","rgb","animatedAppBarStyle","useAnimatedStyle","value","elevation","shadowColor","shadowRadius","shadowOpacity","animatedTitleStyle","opacity","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","Keyboard","dismiss","onScroll","event","offsetY","contentOffset","y","distance","Math","max","localOffsetY","min","onEndDrag","onMomentumEnd","appBarStyle","paddingTop","top","titleStyle"],"sources":["useFadeInAppBar.ts"],"sourcesContent":["import React from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { SharedValue } from 'react-native-reanimated';\nimport { runOnJS, useAnimatedScrollHandler, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { rgb } from '@fountain-ui/utils';\nimport { useHeight } from '../internal/hooks';\nimport { useTheme } from '../styles';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface Options {\n    fadeInBeginY?: number | ((endY: number, appBarHeight: number) => number);\n    fadeInEndY?: number | ((appBarHeight: number) => number);\n    floating?: boolean;\n    keyboardDismissMode?: 'none' | 'on-drag';\n}\n\nexport interface FadeInAppBar {\n    appBarStyle: ViewStyleProp;\n    titleStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    dy: SharedValue<number>;\n    normalized: SharedValue<number>;\n}\n\nconst defaultOptions: Required<Options> = {\n    fadeInBeginY: (endY, appBarHeight) => endY - appBarHeight,\n    fadeInEndY: (appBarHeight) => appBarHeight,\n    floating: true,\n    keyboardDismissMode: 'none',\n};\n\nconst shadowOffset = Platform.OS === 'ios' ? { width: 0, height: 3 } : undefined;\n\nexport default function useFadeInAppBar(userOptions: Options = defaultOptions): FadeInAppBar {\n    const {\n        fadeInBeginY,\n        fadeInEndY,\n        floating,\n        keyboardDismissMode,\n    }: Required<Options> = {\n        ...defaultOptions,\n        ...userOptions,\n    };\n\n    const theme = useTheme();\n\n    const styles = useAppbarStyles();\n\n    const safeAreaInsets = useSafeAreaInsets();\n\n    const [appBarHeight, onAppBarLayout] = useHeight();\n\n    const [fromOffsetY, toOffsetY] = React.useMemo(() => {\n        const endY = typeof fadeInEndY === 'function'\n            ? fadeInEndY(appBarHeight)\n            : fadeInEndY;\n\n        const beginY = typeof fadeInBeginY === 'function'\n            ? fadeInBeginY(endY, appBarHeight)\n            : fadeInBeginY;\n\n        return [beginY, endY];\n    }, [fadeInBeginY, fadeInBeginY, appBarHeight]);\n\n    const dy = useSharedValue<number>(0);\n    const lastOffsetY = useSharedValue<number>(0);\n    const normalized = useSharedValue<number>(0);\n\n    const backgroundColor = theme.palette.background.default;\n    const [r, g, b] = React.useMemo(() => rgb(backgroundColor), [backgroundColor]);\n\n    const animatedAppBarStyle = useAnimatedStyle(() => {\n        if (Platform.OS === 'web') {\n            return {\n                backgroundColor: `rgba(${r}, ${g}, ${b}, ${normalized.value})`,\n            };\n        }\n        if (Platform.OS === 'android') {\n            return {\n                backgroundColor: `rgba(${r}, ${g}, ${b}, ${normalized.value})`,\n                elevation: normalized.value >= 1 ? 6 : 0,\n            };\n        }\n        if (Platform.OS === 'ios') {\n            return {\n                backgroundColor: `rgba(${r}, ${g}, ${b}, ${normalized.value})`,\n                shadowColor: '#000',\n                shadowOffset,\n                shadowRadius: 4.65,\n                shadowOpacity: normalized.value >= 1 ? 0.25 : 0,\n            };\n        }\n        return {};\n    });\n\n    const animatedTitleStyle = useAnimatedStyle(() => ({\n        opacity: normalized.value,\n    }));\n\n    const scrollHandler = useAnimatedScrollHandler({\n        onBeginDrag: () => {\n            if (keyboardDismissMode === 'on-drag') {\n                runOnJS(Keyboard.dismiss)();\n            }\n        },\n        onScroll: (event) => {\n            const offsetY = event.contentOffset.y;\n\n            const distance = Math.max(toOffsetY - fromOffsetY, 1);\n            const localOffsetY = offsetY - fromOffsetY;\n\n            dy.value = offsetY - lastOffsetY.value;\n\n            normalized.value = Math.min(Math.max(localOffsetY / distance, 0), 1);\n        },\n        onEndDrag: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n        onMomentumEnd: (event) => {\n            lastOffsetY.value = event.contentOffset.y;\n        },\n    });\n\n    const appBarStyle = [\n        animatedAppBarStyle,\n        { paddingTop: safeAreaInsets.top },\n        floating ? styles.floating : undefined,\n    ];\n\n    return {\n        appBarStyle,\n        titleStyle: [animatedTitleStyle],\n        onAppBarLayout,\n        onScroll: scrollHandler,\n        dy,\n        normalized,\n    };\n};\n"],"mappings":"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"}

package/build/commonjs/internal/hooks/index.js

@@ -9,16 +9,8 @@ Object.defineProperty(exports, "useHeight", {
     return _useHeight.default;
   }
 });
-Object.defineProperty(exports, "useWidth", {
-  enumerable: true,
-  get: function () {
-    return _useWidth.default;
-  }
-});
 
 var _useHeight = _interopRequireDefault(require("./useHeight"));
 
-var _useWidth = _interopRequireDefault(require("./useWidth"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

package/build/commonjs/internal/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as useHeight } from './useHeight';\nexport { default as useWidth } from './useWidth';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;AACA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as useHeight } from './useHeight';\n"],"mappings":";;;;;;;;;;;;AAAA"}

package/build/module/Tabs/TabIndicator.js

@@ -1,7 +1,7 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 import React from 'react';
-import Animated, { useAnimatedStyle, useDerivedValue } from 'react-native-reanimated';
+import Animated, { useAnimatedStyle } from 'react-native-reanimated';
 import { useTheme } from '../styles';
 import { defaultCoordinate } from './TabCoordinate';
 
@@ -30,7 +30,7 @@ export default function TabIndicator(props) {
     ...otherProps
   } = props;
   const styles = useStyles();
-  const layout = useDerivedValue(() => {
+  const animatedStyle = useAnimatedStyle(() => {
     const rawScrollValue = scrollValue.value;
     const index = Math.floor(rawScrollValue);
     const offset = rawScrollValue % 1;
@@ -45,10 +45,6 @@ export default function TabIndicator(props) {
       width: Math.max(x2 - x1 - rightInset, 0)
     };
   });
-  const animatedStyle = useAnimatedStyle(() => ({
-    left: layout.value.left,
-    width: layout.value.width
-  }));
   return /*#__PURE__*/React.createElement(Animated.View, _extends({
     style: [styles.root, disabled ? styles.disabled : undefined, animatedStyle, style]
   }, otherProps));

package/build/module/Tabs/TabIndicator.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Animated","useAnimatedStyle","useDerivedValue","useTheme","defaultCoordinate","useStyles","theme","root","backgroundColor","palette","secondary","main","bottom","height","position","disabled","TabIndicator","props","coordinates","scrollable","scrollValue","style","otherProps","styles","layout","rawScrollValue","value","index","Math","floor","offset","coordinate","nextCoordinate","x1","x2","leftInset","rightInset","left","width","max","animatedStyle","undefined"],"sources":["TabIndicator.tsx"],"sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle, useDerivedValue } from 'react-native-reanimated';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport type TabIndicatorProps from './TabIndicatorProps';\nimport { defaultCoordinate } from './TabCoordinate';\n\ntype TabIndicatorStyles = NamedStylesStringUnion<'root' | 'disabled'>;\n\nconst useStyles: UseStyles<TabIndicatorStyles> = function (): TabIndicatorStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            backgroundColor: theme.palette.secondary.main,\n            bottom: 0,\n            height: 4,\n            position: 'absolute',\n        },\n        disabled: {\n            height: 0,\n        },\n    };\n};\n\nexport default function TabIndicator(props: TabIndicatorProps) {\n    const {\n        coordinates,\n        disabled,\n        scrollable,\n        scrollValue,\n        style,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const layout = useDerivedValue(() => {\n        const rawScrollValue = scrollValue.value;\n        const index = Math.floor(rawScrollValue);\n        const offset = rawScrollValue % 1;\n\n        const coordinate = coordinates[index] ?? defaultCoordinate;\n        const nextCoordinate = coordinates[index + 1] ?? defaultCoordinate;\n\n        const x1 = (offset * nextCoordinate.x1 + (1 - offset) * coordinate.x1);\n        const x2 = (offset * nextCoordinate.x2 + (1 - offset) * coordinate.x2);\n\n        const leftInset = scrollable ? 12 : 0;\n        const rightInset = scrollable ? 24 : 0;\n\n        return {\n            left: x1 + leftInset,\n            width: Math.max(x2 - x1 - rightInset, 0),\n        };\n    });\n\n    const animatedStyle = useAnimatedStyle(() => ({\n        left: layout.value.left,\n        width: layout.value.width,\n    }));\n\n    return (\n        <Animated.View\n            style={[\n                styles.root,\n                disabled ? styles.disabled : undefined,\n                animatedStyle,\n                style,\n            ]}\n            {...otherProps}\n        />\n    );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,IAAmBC,gBAAnB,EAAqCC,eAArC,QAA4D,yBAA5D;AAEA,SAASC,QAAT,QAAyB,WAAzB;AAEA,SAASC,iBAAT,QAAkC,iBAAlC;;AAIA,MAAMC,SAAwC,GAAG,YAAgC;EAC7E,MAAMC,KAAK,GAAGH,QAAQ,EAAtB;EAEA,OAAO;IACHI,IAAI,EAAE;MACFC,eAAe,EAAEF,KAAK,CAACG,OAAN,CAAcC,SAAd,CAAwBC,IADvC;MAEFC,MAAM,EAAE,CAFN;MAGFC,MAAM,EAAE,CAHN;MAIFC,QAAQ,EAAE;IAJR,CADH;IAOHC,QAAQ,EAAE;MACNF,MAAM,EAAE;IADF;EAPP,CAAP;AAWH,CAdD;;AAgBA,eAAe,SAASG,YAAT,CAAsBC,KAAtB,EAAgD;EAC3D,MAAM;IACFC,WADE;IAEFH,QAFE;IAGFI,UAHE;IAIFC,WAJE;IAKFC,KALE;IAMF,GAAGC;EAND,IAOFL,KAPJ;EASA,MAAMM,MAAM,GAAGlB,SAAS,EAAxB;EAEA,MAAMmB,MAAM,GAAGtB,eAAe,CAAC,MAAM;IACjC,MAAMuB,cAAc,GAAGL,WAAW,CAACM,KAAnC;IACA,MAAMC,KAAK,GAAGC,IAAI,CAACC,KAAL,CAAWJ,cAAX,CAAd;IACA,MAAMK,MAAM,GAAGL,cAAc,GAAG,CAAhC;IAEA,MAAMM,UAAU,GAAGb,WAAW,CAACS,KAAD,CAAX,IAAsBvB,iBAAzC;IACA,MAAM4B,cAAc,GAAGd,WAAW,CAACS,KAAK,GAAG,CAAT,CAAX,IAA0BvB,iBAAjD;IAEA,MAAM6B,EAAE,GAAIH,MAAM,GAAGE,cAAc,CAACC,EAAxB,GAA6B,CAAC,IAAIH,MAAL,IAAeC,UAAU,CAACE,EAAnE;IACA,MAAMC,EAAE,GAAIJ,MAAM,GAAGE,cAAc,CAACE,EAAxB,GAA6B,CAAC,IAAIJ,MAAL,IAAeC,UAAU,CAACG,EAAnE;IAEA,MAAMC,SAAS,GAAGhB,UAAU,GAAG,EAAH,GAAQ,CAApC;IACA,MAAMiB,UAAU,GAAGjB,UAAU,GAAG,EAAH,GAAQ,CAArC;IAEA,OAAO;MACHkB,IAAI,EAAEJ,EAAE,GAAGE,SADR;MAEHG,KAAK,EAAEV,IAAI,CAACW,GAAL,CAASL,EAAE,GAAGD,EAAL,GAAUG,UAAnB,EAA+B,CAA/B;IAFJ,CAAP;EAIH,CAlB6B,CAA9B;EAoBA,MAAMI,aAAa,GAAGvC,gBAAgB,CAAC,OAAO;IAC1CoC,IAAI,EAAEb,MAAM,CAACE,KAAP,CAAaW,IADuB;IAE1CC,KAAK,EAAEd,MAAM,CAACE,KAAP,CAAaY;EAFsB,CAAP,CAAD,CAAtC;EAKA,oBACI,oBAAC,QAAD,CAAU,IAAV;IACI,KAAK,EAAE,CACHf,MAAM,CAAChB,IADJ,EAEHQ,QAAQ,GAAGQ,MAAM,CAACR,QAAV,GAAqB0B,SAF1B,EAGHD,aAHG,EAIHnB,KAJG;EADX,GAOQC,UAPR,EADJ;AAWH;AAAA"}
+{"version":3,"names":["React","Animated","useAnimatedStyle","useTheme","defaultCoordinate","useStyles","theme","root","backgroundColor","palette","secondary","main","bottom","height","position","disabled","TabIndicator","props","coordinates","scrollable","scrollValue","style","otherProps","styles","animatedStyle","rawScrollValue","value","index","Math","floor","offset","coordinate","nextCoordinate","x1","x2","leftInset","rightInset","left","width","max","undefined"],"sources":["TabIndicator.tsx"],"sourcesContent":["import React from 'react';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport type TabIndicatorProps from './TabIndicatorProps';\nimport { defaultCoordinate } from './TabCoordinate';\n\ntype TabIndicatorStyles = NamedStylesStringUnion<'root' | 'disabled'>;\n\nconst useStyles: UseStyles<TabIndicatorStyles> = function (): TabIndicatorStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            backgroundColor: theme.palette.secondary.main,\n            bottom: 0,\n            height: 4,\n            position: 'absolute',\n        },\n        disabled: {\n            height: 0,\n        },\n    };\n};\n\nexport default function TabIndicator(props: TabIndicatorProps) {\n    const {\n        coordinates,\n        disabled,\n        scrollable,\n        scrollValue,\n        style,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const rawScrollValue = scrollValue.value;\n\n        const index = Math.floor(rawScrollValue);\n        const offset = rawScrollValue % 1;\n\n        const coordinate = coordinates[index] ?? defaultCoordinate;\n        const nextCoordinate = coordinates[index + 1] ?? defaultCoordinate;\n\n        const x1 = (offset * nextCoordinate.x1 + (1 - offset) * coordinate.x1);\n        const x2 = (offset * nextCoordinate.x2 + (1 - offset) * coordinate.x2);\n\n        const leftInset = scrollable ? 12 : 0;\n        const rightInset = scrollable ? 24 : 0;\n\n        return {\n            left: x1 + leftInset,\n            width: Math.max(x2 - x1 - rightInset, 0),\n        };\n    });\n\n    return (\n        <Animated.View\n            style={[\n                styles.root,\n                disabled ? styles.disabled : undefined,\n                animatedStyle,\n                style,\n            ]}\n            {...otherProps}\n        />\n    );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,IAAmBC,gBAAnB,QAA2C,yBAA3C;AAEA,SAASC,QAAT,QAAyB,WAAzB;AAEA,SAASC,iBAAT,QAAkC,iBAAlC;;AAIA,MAAMC,SAAwC,GAAG,YAAgC;EAC7E,MAAMC,KAAK,GAAGH,QAAQ,EAAtB;EAEA,OAAO;IACHI,IAAI,EAAE;MACFC,eAAe,EAAEF,KAAK,CAACG,OAAN,CAAcC,SAAd,CAAwBC,IADvC;MAEFC,MAAM,EAAE,CAFN;MAGFC,MAAM,EAAE,CAHN;MAIFC,QAAQ,EAAE;IAJR,CADH;IAOHC,QAAQ,EAAE;MACNF,MAAM,EAAE;IADF;EAPP,CAAP;AAWH,CAdD;;AAgBA,eAAe,SAASG,YAAT,CAAsBC,KAAtB,EAAgD;EAC3D,MAAM;IACFC,WADE;IAEFH,QAFE;IAGFI,UAHE;IAIFC,WAJE;IAKFC,KALE;IAMF,GAAGC;EAND,IAOFL,KAPJ;EASA,MAAMM,MAAM,GAAGlB,SAAS,EAAxB;EAEA,MAAMmB,aAAa,GAAGtB,gBAAgB,CAAC,MAAM;IACzC,MAAMuB,cAAc,GAAGL,WAAW,CAACM,KAAnC;IAEA,MAAMC,KAAK,GAAGC,IAAI,CAACC,KAAL,CAAWJ,cAAX,CAAd;IACA,MAAMK,MAAM,GAAGL,cAAc,GAAG,CAAhC;IAEA,MAAMM,UAAU,GAAGb,WAAW,CAACS,KAAD,CAAX,IAAsBvB,iBAAzC;IACA,MAAM4B,cAAc,GAAGd,WAAW,CAACS,KAAK,GAAG,CAAT,CAAX,IAA0BvB,iBAAjD;IAEA,MAAM6B,EAAE,GAAIH,MAAM,GAAGE,cAAc,CAACC,EAAxB,GAA6B,CAAC,IAAIH,MAAL,IAAeC,UAAU,CAACE,EAAnE;IACA,MAAMC,EAAE,GAAIJ,MAAM,GAAGE,cAAc,CAACE,EAAxB,GAA6B,CAAC,IAAIJ,MAAL,IAAeC,UAAU,CAACG,EAAnE;IAEA,MAAMC,SAAS,GAAGhB,UAAU,GAAG,EAAH,GAAQ,CAApC;IACA,MAAMiB,UAAU,GAAGjB,UAAU,GAAG,EAAH,GAAQ,CAArC;IAEA,OAAO;MACHkB,IAAI,EAAEJ,EAAE,GAAGE,SADR;MAEHG,KAAK,EAAEV,IAAI,CAACW,GAAL,CAASL,EAAE,GAAGD,EAAL,GAAUG,UAAnB,EAA+B,CAA/B;IAFJ,CAAP;EAIH,CAnBqC,CAAtC;EAqBA,oBACI,oBAAC,QAAD,CAAU,IAAV;IACI,KAAK,EAAE,CACHb,MAAM,CAAChB,IADJ,EAEHQ,QAAQ,GAAGQ,MAAM,CAACR,QAAV,GAAqByB,SAF1B,EAGHhB,aAHG,EAIHH,KAJG;EADX,GAOQC,UAPR,EADJ;AAWH;AAAA"}