@fountain-ui/core 2.0.0-beta.12 → 2.0.0-beta.13

package/build/commonjs/ButtonBase/ButtonBase.js

@@ -6,19 +6,17 @@ Object.defineProperty(exports, "__esModule", {
 exports.ORIGINAL_OPACITY = exports.DISABLED_OPACITY = void 0;
 exports.default = ButtonBase;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
-var _reactNativeReanimated = require("react-native-reanimated");
+var _reactNative = require("react-native");
 
 var _hooks = require("../hooks");
 
 var _animated = require("../animated");
 
-var _styles = require("../styles");
+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); }
 
-var _useDisabledReaction = _interopRequireDefault(require("./useDisabledReaction"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
 
@@ -28,19 +26,18 @@ const DISABLED_OPACITY = .3;
 exports.DISABLED_OPACITY = DISABLED_OPACITY;
 const ACTIVE_OPACITY = .65;
 const ORIGINAL_SCALE = 1;
-const MINIFIED_SCALE = .96;
-const ANIMATION_CONFIG = {
-  duration: 150
-};
+const MINIFIED_SCALE = .96; // at "node_modules/react-native/Libraries/Pressability.js"
+// const DEFAULT_MIN_PRESS_DURATION = 130;
 
-const styles = _styles.StyleSheet.create({
-  disabled: {
-    opacity: DISABLED_OPACITY,
-    transform: [{
-      scale: ORIGINAL_SCALE
-    }]
-  }
-});
+const PRESS_IN_DELAY = 130;
+
+const startTimingAnimationWithDefaults = (value, toValue) => {
+  _reactNative.Animated.timing(value, {
+    toValue,
+    duration: 150,
+    useNativeDriver: true
+  }).start();
+};
 
 function ButtonBase(props) {
   const {
@@ -49,7 +46,7 @@ function ButtonBase(props) {
     disableThrottle = false,
     onPress,
     pressEffect = 'opacity',
-    style,
+    style: styleProp,
     throttleMillis = 650,
     ...otherProps
   } = props;
@@ -57,51 +54,58 @@ function ButtonBase(props) {
     periodMillis: disableThrottle ? 0 : throttleMillis,
     callback: onPress
   });
-  const opacity = (0, _reactNativeReanimated.useSharedValue)(ORIGINAL_OPACITY);
-  const scale = (0, _reactNativeReanimated.useSharedValue)(ORIGINAL_SCALE);
-  const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
-    opacity: opacity.value,
-    transform: [{
-      scale: scale.value
-    }]
-  }), []);
-  (0, _useDisabledReaction.default)(disabled, opacity);
-
-  const startAnimation = function (pressIn) {
-    let isHovered = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-
-    if (pressEffect === 'none') {
-      return;
+  const opacity = (0, _react.useRef)(new _reactNative.Animated.Value(ORIGINAL_OPACITY)).current;
+  const scale = (0, _react.useRef)(new _reactNative.Animated.Value(ORIGINAL_SCALE)).current;
+  (0, _react.useEffect)(() => {
+    opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);
+  }, [disabled]);
+  const startScaleAnimation = (0, _react.useCallback)((pressIn, isHover) => {
+    if (!isHover) {
+      startTimingAnimationWithDefaults(scale, pressIn ? MINIFIED_SCALE : ORIGINAL_SCALE);
     }
-
-    if (pressEffect === 'opacity') {
-      if (pressIn) {
-        opacity.value = ACTIVE_OPACITY;
-      } else {
-        opacity.value = (0, _reactNativeReanimated.withTiming)(ORIGINAL_OPACITY, ANIMATION_CONFIG);
-      }
-    } else if (!isHovered) {
-      if (pressIn) {
-        scale.value = (0, _reactNativeReanimated.withDelay)(100, (0, _reactNativeReanimated.withTiming)(MINIFIED_SCALE, ANIMATION_CONFIG));
-      } else {
-        scale.value = (0, _reactNativeReanimated.withTiming)(ORIGINAL_SCALE, ANIMATION_CONFIG);
-      }
+  }, []);
+  const startOpacityAnimation = (0, _react.useCallback)(pressIn => {
+    if (pressIn) {
+      opacity.setValue(ACTIVE_OPACITY);
+    } else {
+      startTimingAnimationWithDefaults(opacity, ORIGINAL_OPACITY);
     }
+  }, []);
+  const startPressAnimation = (0, _react.useCallback)(function (pressIn) {
+    let isHover = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+    if (pressEffect === 'scale') {
+      startScaleAnimation(pressIn, isHover);
+    } else if (pressEffect === 'opacity') {
+      startOpacityAnimation(pressIn, isHover);
+    }
+  }, [pressEffect]);
+  const handlePressIn = (0, _react.useCallback)(() => {
+    startPressAnimation(true, false);
+  }, [startPressAnimation]);
+  const handlePressOut = (0, _react.useCallback)(() => {
+    startPressAnimation(false, false);
+  }, [startPressAnimation]);
+  const animatedStyle = {
+    opacity,
+    transform: [{
+      scale
+    }]
   };
-
   return /*#__PURE__*/_react.default.createElement(_animated.AnimatedPressable, _extends({
     disabled: disabled,
     onPress: handlePress,
-    onPressIn: () => startAnimation(true),
-    onPressOut: () => startAnimation(false),
-    style: [animatedStyle, disabled ? styles.disabled : undefined, style]
+    onPressIn: handlePressIn,
+    onPressOut: handlePressOut,
+    style: [animatedStyle, styleProp],
+    unstable_pressDelay: PRESS_IN_DELAY
   }, otherProps), typeof children !== 'function' ? _ref => {
     let {
       hovered
     } = _ref;
 
     if (hovered !== undefined && !disabled) {
-      startAnimation(hovered, true);
+      startPressAnimation(hovered, true);
     }
 
     return children;

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

@@ -1 +1 @@
-{"version":3,"names":["ORIGINAL_OPACITY","DISABLED_OPACITY","ACTIVE_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","ANIMATION_CONFIG","duration","styles","StyleSheet","create","disabled","opacity","transform","scale","ButtonBase","props","children","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","useThrottle","periodMillis","callback","useSharedValue","animatedStyle","useAnimatedStyle","value","useDisabledReaction","startAnimation","pressIn","isHovered","withTiming","withDelay","undefined","hovered"],"sources":["ButtonBase.tsx"],"sourcesContent":["import React from 'react';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport { useAnimatedStyle, useSharedValue, withDelay, withTiming } from 'react-native-reanimated';\nimport { useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport { StyleSheet } from '../styles';\nimport type ButtonBaseProps from './ButtonBaseProps';\nimport useDisabledReaction from './useDisabledReaction';\n\nexport const ORIGINAL_OPACITY = 1;\nexport const DISABLED_OPACITY = .3;\nconst ACTIVE_OPACITY = .65;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\nconst ANIMATION_CONFIG: Readonly<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 = useSharedValue(ORIGINAL_OPACITY);\n    const scale = useSharedValue(ORIGINAL_SCALE);\n\n    const animatedStyle = useAnimatedStyle(() => ({\n        opacity: opacity.value,\n        transform: [{ scale: scale.value }],\n    }), []);\n\n    useDisabledReaction(disabled, opacity);\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 = withTiming(ORIGINAL_OPACITY, ANIMATION_CONFIG);\n            }\n        } else if (!isHovered) {\n            if (pressIn) {\n                scale.value = withDelay(\n                    100,\n                    withTiming(MINIFIED_SCALE, ANIMATION_CONFIG),\n                );\n            } else {\n                scale.value = withTiming(ORIGINAL_SCALE, ANIMATION_CONFIG);\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 && !disabled) {\n                        startAnimation(hovered, true);\n                    }\n\n                    return children;\n                }\n            ) : children}\n        </AnimatedPressable>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["ORIGINAL_OPACITY","DISABLED_OPACITY","ACTIVE_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","PRESS_IN_DELAY","startTimingAnimationWithDefaults","value","toValue","Animated","timing","duration","useNativeDriver","start","ButtonBase","props","children","disabled","disableThrottle","onPress","pressEffect","style","styleProp","throttleMillis","otherProps","handlePress","useThrottle","periodMillis","callback","opacity","useRef","Value","current","scale","useEffect","setValue","startScaleAnimation","useCallback","pressIn","isHover","startOpacityAnimation","startPressAnimation","handlePressIn","handlePressOut","animatedStyle","transform","hovered","undefined"],"sources":["ButtonBase.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport { useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\ninterface StartPressAnimation {\n    (pressIn: boolean, isHover: boolean): void;\n}\n\nexport const ORIGINAL_OPACITY = 1;\nexport const DISABLED_OPACITY = .3;\nconst ACTIVE_OPACITY = .65;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\n// at \"node_modules/react-native/Libraries/Pressability.js\"\n// const DEFAULT_MIN_PRESS_DURATION = 130;\nconst PRESS_IN_DELAY = 130;\n\ntype TimingAnimationValue = Animated.Value | Animated.ValueXY;\ntype TimingAnimationToValue = Animated.TimingAnimationConfig['toValue'];\n\nconst startTimingAnimationWithDefaults = (\n    value: TimingAnimationValue,\n    toValue: TimingAnimationToValue,\n) => {\n    Animated.timing(value, {\n        toValue,\n        duration: 150,\n        useNativeDriver: true,\n    }).start();\n};\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n    const {\n        children,\n        disabled = false,\n        disableThrottle = false,\n        onPress,\n        pressEffect = 'opacity',\n        style: styleProp,\n        throttleMillis = 650,\n        ...otherProps\n    } = props;\n\n    const handlePress = useThrottle({\n        periodMillis: disableThrottle ? 0 : throttleMillis,\n        callback: onPress,\n    });\n\n    const opacity = useRef<Animated.Value>(new Animated.Value(ORIGINAL_OPACITY)).current;\n    const scale = useRef<Animated.Value>(new Animated.Value(ORIGINAL_SCALE)).current;\n\n    useEffect(() => {\n        opacity.setValue(disabled ? DISABLED_OPACITY : ORIGINAL_OPACITY);\n    }, [disabled]);\n\n    const startScaleAnimation = useCallback<StartPressAnimation>((pressIn, isHover) => {\n        if (!isHover) {\n            startTimingAnimationWithDefaults(\n                scale,\n                pressIn ? MINIFIED_SCALE : ORIGINAL_SCALE,\n            );\n        }\n    }, []);\n\n    const startOpacityAnimation = useCallback<StartPressAnimation>((pressIn) => {\n        if (pressIn) {\n            opacity.setValue(ACTIVE_OPACITY);\n        } else {\n            startTimingAnimationWithDefaults(opacity, ORIGINAL_OPACITY);\n        }\n    }, []);\n\n    const startPressAnimation = useCallback<StartPressAnimation>((pressIn, isHover = false) => {\n        if (pressEffect === 'scale') {\n            startScaleAnimation(pressIn, isHover);\n        } else if (pressEffect === 'opacity') {\n            startOpacityAnimation(pressIn, isHover);\n        }\n    }, [pressEffect]);\n\n    const handlePressIn = useCallback(() => {\n        startPressAnimation(true, false);\n    }, [startPressAnimation]);\n\n    const handlePressOut = useCallback(() => {\n        startPressAnimation(false, false);\n    }, [startPressAnimation]);\n\n    const animatedStyle = {\n        opacity,\n        transform: [{ scale }],\n    };\n\n    return (\n        <AnimatedPressable\n            disabled={disabled}\n            onPress={handlePress}\n            onPressIn={handlePressIn}\n            onPressOut={handlePressOut}\n            style={[\n                animatedStyle,\n                styleProp,\n            ]}\n            unstable_pressDelay={PRESS_IN_DELAY}\n            {...otherProps}\n        >\n            {typeof children !== 'function' ? (\n                ({ hovered }) => {\n                    if (hovered !== undefined && !disabled) {\n                        startPressAnimation(hovered, true);\n                    }\n\n                    return children;\n                }\n            ) : children}\n        </AnimatedPressable>\n    );\n};\n"],"mappings":"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"}

package/build/commonjs/CircularProgress/CircularProgress.js

@@ -11,8 +11,6 @@ var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reani
 
 var _icons = require("../internal/icons");
 
-var _styles = require("../styles");
-
 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; }
@@ -21,8 +19,8 @@ const ANIMATION_CONFIG = {
   duration: 900,
   easing: _reactNativeReanimated.Easing.linear
 };
-const MIN_ROTATE = 0;
-const MAX_ROTATE = 360;
+const MIN_ROTATE_DEGREE = 0;
+const MAX_ROTATE_DEGREE = 360;
 
 const useStyles = function () {
   return {
@@ -35,22 +33,22 @@ const useStyles = function () {
 
 function CircularProgress(props) {
   const {
-    style
+    style: styleProp
   } = props;
   const styles = useStyles();
-  const rootStyle = (0, _styles.css)([styles.root, style]);
-  const rotate = (0, _reactNativeReanimated.useSharedValue)(MIN_ROTATE);
-  const spinStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
+  const rotate = (0, _reactNativeReanimated.useSharedValue)(MIN_ROTATE_DEGREE);
+  const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
     transform: [{
-      rotate: `${rotate}deg`
+      rotate: `${rotate.value}deg`
     }]
   }), []);
   (0, _react.useEffect)(() => {
-    rotate.value = (0, _reactNativeReanimated.withRepeat)((0, _reactNativeReanimated.withTiming)(MAX_ROTATE, ANIMATION_CONFIG), -1, false);
+    rotate.value = (0, _reactNativeReanimated.withRepeat)((0, _reactNativeReanimated.withTiming)(MAX_ROTATE_DEGREE, ANIMATION_CONFIG), -1, false);
   }, []);
   return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
-    style: [spinStyle, rootStyle]
-  }, /*#__PURE__*/_react.default.createElement(_icons.CircularProgress, null));
+    children: /*#__PURE__*/_react.default.createElement(_icons.CircularProgress, null),
+    style: [animatedStyle, styles.root, styleProp]
+  });
 }
 
 ;

package/build/commonjs/CircularProgress/CircularProgress.js.map

@@ -1 +1 @@
-{"version":3,"names":["ANIMATION_CONFIG","duration","easing","Easing","linear","MIN_ROTATE","MAX_ROTATE","useStyles","root","alignItems","justifyContent","CircularProgress","props","style","styles","rootStyle","css","rotate","useSharedValue","spinStyle","useAnimatedStyle","transform","useEffect","value","withRepeat","withTiming"],"sources":["CircularProgress.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { ViewProps } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport Animated, { Easing, useAnimatedStyle, useSharedValue, withRepeat, withTiming } from 'react-native-reanimated';\nimport { CircularProgress as CircularProgressIcon } from '../internal/icons';\nimport { css } from '../styles';\nimport { OverridableComponentProps } from '../types';\n\ntype CircularProgressStyles = NamedStylesStringUnion<'root'>;\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 900, easing: Easing.linear };\n\nconst MIN_ROTATE = 0;\nconst MAX_ROTATE = 360;\n\nconst useStyles: UseStyles<CircularProgressStyles> = function (): CircularProgressStyles {\n    return {\n        root: {\n            alignItems: 'center',\n            justifyContent: 'center',\n        },\n    };\n};\n\nexport default function CircularProgress(props: OverridableComponentProps<ViewProps>) {\n    const { style } = props;\n\n    const styles = useStyles();\n\n    const rootStyle = css([\n        styles.root,\n        style,\n    ]);\n\n    const rotate = useSharedValue(MIN_ROTATE);\n\n    const spinStyle = useAnimatedStyle(() => ({\n        transform: [{ rotate: `${rotate}deg` }],\n    }), []);\n\n    useEffect(() => {\n        rotate.value = withRepeat(\n            withTiming(MAX_ROTATE, ANIMATION_CONFIG),\n            -1,\n            false,\n        );\n    }, []);\n\n    return (\n        <Animated.View style={[spinStyle, rootStyle]}>\n            <CircularProgressIcon/>\n        </Animated.View>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AAIA;;AACA;;AACA;;;;;;AAKA,MAAMA,gBAA4C,GAAG;EAAEC,QAAQ,EAAE,GAAZ;EAAiBC,MAAM,EAAEC,6BAAA,CAAOC;AAAhC,CAArD;AAEA,MAAMC,UAAU,GAAG,CAAnB;AACA,MAAMC,UAAU,GAAG,GAAnB;;AAEA,MAAMC,SAA4C,GAAG,YAAoC;EACrF,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,cAAc,EAAE;IAFd;EADH,CAAP;AAMH,CAPD;;AASe,SAASC,gBAAT,CAA0BC,KAA1B,EAAuE;EAClF,MAAM;IAAEC;EAAF,IAAYD,KAAlB;EAEA,MAAME,MAAM,GAAGP,SAAS,EAAxB;EAEA,MAAMQ,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACN,IADW,EAElBK,KAFkB,CAAJ,CAAlB;EAKA,MAAMI,MAAM,GAAG,IAAAC,qCAAA,EAAeb,UAAf,CAAf;EAEA,MAAMc,SAAS,GAAG,IAAAC,uCAAA,EAAiB,OAAO;IACtCC,SAAS,EAAE,CAAC;MAAEJ,MAAM,EAAG,GAAEA,MAAO;IAApB,CAAD;EAD2B,CAAP,CAAjB,EAEd,EAFc,CAAlB;EAIA,IAAAK,gBAAA,EAAU,MAAM;IACZL,MAAM,CAACM,KAAP,GAAe,IAAAC,iCAAA,EACX,IAAAC,iCAAA,EAAWnB,UAAX,EAAuBN,gBAAvB,CADW,EAEX,CAAC,CAFU,EAGX,KAHW,CAAf;EAKH,CAND,EAMG,EANH;EAQA,oBACI,6BAAC,8BAAD,CAAU,IAAV;IAAe,KAAK,EAAE,CAACmB,SAAD,EAAYJ,SAAZ;EAAtB,gBACI,6BAAC,uBAAD,OADJ,CADJ;AAKH;;AAAA"}
+{"version":3,"names":["ANIMATION_CONFIG","duration","easing","Easing","linear","MIN_ROTATE_DEGREE","MAX_ROTATE_DEGREE","useStyles","root","alignItems","justifyContent","CircularProgress","props","style","styleProp","styles","rotate","useSharedValue","animatedStyle","useAnimatedStyle","transform","value","useEffect","withRepeat","withTiming"],"sources":["CircularProgress.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { ViewProps } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport Animated, { Easing, useAnimatedStyle, useSharedValue, withRepeat, withTiming } from 'react-native-reanimated';\nimport { CircularProgress as CircularProgressIcon } from '../internal/icons';\nimport { OverridableComponentProps } from '../types';\n\ntype CircularProgressStyles = NamedStylesStringUnion<'root'>;\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 900, easing: Easing.linear };\n\nconst MIN_ROTATE_DEGREE = 0;\nconst MAX_ROTATE_DEGREE = 360;\n\nconst useStyles: UseStyles<CircularProgressStyles> = function (): CircularProgressStyles {\n    return {\n        root: {\n            alignItems: 'center',\n            justifyContent: 'center',\n        },\n    };\n};\n\nexport default function CircularProgress(props: OverridableComponentProps<ViewProps>) {\n    const { style: styleProp } = props;\n\n    const styles = useStyles();\n\n    const rotate = useSharedValue(MIN_ROTATE_DEGREE);\n\n    const animatedStyle = useAnimatedStyle(() => ({\n        transform: [{ rotate: `${rotate.value}deg` }],\n    }), []);\n\n    useEffect(() => {\n        rotate.value = withRepeat(\n            withTiming(MAX_ROTATE_DEGREE, ANIMATION_CONFIG),\n            -1,\n            false,\n        );\n    }, []);\n\n    return (\n        <Animated.View\n            children={<CircularProgressIcon/>}\n            style={[\n                animatedStyle,\n                styles.root,\n                styleProp,\n            ]}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AAIA;;AACA;;;;;;AAKA,MAAMA,gBAA4C,GAAG;EAAEC,QAAQ,EAAE,GAAZ;EAAiBC,MAAM,EAAEC,6BAAA,CAAOC;AAAhC,CAArD;AAEA,MAAMC,iBAAiB,GAAG,CAA1B;AACA,MAAMC,iBAAiB,GAAG,GAA1B;;AAEA,MAAMC,SAA4C,GAAG,YAAoC;EACrF,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,cAAc,EAAE;IAFd;EADH,CAAP;AAMH,CAPD;;AASe,SAASC,gBAAT,CAA0BC,KAA1B,EAAuE;EAClF,MAAM;IAAEC,KAAK,EAAEC;EAAT,IAAuBF,KAA7B;EAEA,MAAMG,MAAM,GAAGR,SAAS,EAAxB;EAEA,MAAMS,MAAM,GAAG,IAAAC,qCAAA,EAAeZ,iBAAf,CAAf;EAEA,MAAMa,aAAa,GAAG,IAAAC,uCAAA,EAAiB,OAAO;IAC1CC,SAAS,EAAE,CAAC;MAAEJ,MAAM,EAAG,GAAEA,MAAM,CAACK,KAAM;IAA1B,CAAD;EAD+B,CAAP,CAAjB,EAElB,EAFkB,CAAtB;EAIA,IAAAC,gBAAA,EAAU,MAAM;IACZN,MAAM,CAACK,KAAP,GAAe,IAAAE,iCAAA,EACX,IAAAC,iCAAA,EAAWlB,iBAAX,EAA8BN,gBAA9B,CADW,EAEX,CAAC,CAFU,EAGX,KAHW,CAAf;EAKH,CAND,EAMG,EANH;EAQA,oBACI,6BAAC,8BAAD,CAAU,IAAV;IACI,QAAQ,eAAE,6BAAC,uBAAD,OADd;IAEI,KAAK,EAAE,CACHkB,aADG,EAEHH,MAAM,CAACP,IAFJ,EAGHM,SAHG;EAFX,EADJ;AAUH;;AAAA"}

package/build/commonjs/ImageCore/ImageCoreNative.js

@@ -5,24 +5,24 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = ImageCore;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
-var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+var _reactNative = require("react-native");
 
 var _reactNativeFastImage = _interopRequireDefault(require("react-native-fast-image"));
 
+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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 // @ts-ignore
-const AnimatedFastImage = _reactNativeReanimated.default.createAnimatedComponent(_reactNativeFastImage.default);
+const AnimatedFastImage = _reactNative.Animated.createAnimatedComponent(_reactNativeFastImage.default);
 
-const ANIMATION_CONFIG = {
-  duration: 150
-};
+const INITIAL_OPACITY = 0;
+const LOADED_OPACITY = 1;
+const ANIMATION_DURATION = 200;
 
 function ImageCore(props) {
   const {
@@ -33,23 +33,16 @@ function ImageCore(props) {
     source,
     width
   } = props;
-  const style = {
-    width,
-    height
-  };
-  const opacity = (0, _reactNativeReanimated.useSharedValue)(0);
-  const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
-    opacity: opacity.value
-  }), []);
-
-  const handleLoad = () => {
-    opacity.value = (0, _reactNativeReanimated.withTiming)(1, ANIMATION_CONFIG);
-
-    if (onLoad) {
-      onLoad();
-    }
-  };
-
+  const opacity = (0, _react.useRef)(new _reactNative.Animated.Value(INITIAL_OPACITY)).current;
+  const handleLoad = (0, _react.useCallback)(() => {
+    _reactNative.Animated.timing(opacity, {
+      toValue: LOADED_OPACITY,
+      duration: ANIMATION_DURATION,
+      useNativeDriver: true
+    }).start();
+
+    onLoad === null || onLoad === void 0 ? void 0 : onLoad();
+  }, [onLoad]);
   return /*#__PURE__*/_react.default.createElement(AnimatedFastImage, {
     onError: onError,
     onLoad: handleLoad,
@@ -57,7 +50,12 @@ function ImageCore(props) {
     source: {
       uri: source.uri
     },
-    style: [animatedStyle, style]
+    style: [{
+      opacity
+    }, {
+      width,
+      height
+    }]
   });
 }
 

package/build/commonjs/ImageCore/ImageCoreNative.js.map

@@ -1 +1 @@
-{"version":3,"names":["AnimatedFastImage","Animated","createAnimatedComponent","FastImage","ANIMATION_CONFIG","duration","ImageCore","props","height","onError","onLoad","resizeMode","source","width","style","opacity","useSharedValue","animatedStyle","useAnimatedStyle","value","handleLoad","withTiming","uri"],"sources":["ImageCoreNative.tsx"],"sourcesContent":["import React from 'react';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';\nimport FastImage from 'react-native-fast-image';\nimport type ImageCoreProps from './ImageCoreProps';\n\n// @ts-ignore\nconst AnimatedFastImage = Animated.createAnimatedComponent(FastImage);\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 150 };\n\nexport default function ImageCore(props: ImageCoreProps) {\n    const {\n        height,\n        onError,\n        onLoad,\n        resizeMode,\n        source,\n        width,\n    } = props;\n\n    const style = { width, height };\n\n    const opacity = useSharedValue(0);\n\n    const animatedStyle = useAnimatedStyle(() => ({\n        opacity: opacity.value,\n    }), []);\n\n    const handleLoad = () => {\n        opacity.value = withTiming(1, ANIMATION_CONFIG);\n\n        if (onLoad) {\n            onLoad();\n        }\n    };\n\n    return (\n        <AnimatedFastImage\n            onError={onError}\n            onLoad={handleLoad}\n            resizeMode={resizeMode}\n            source={{ uri: source.uri }}\n            style={[\n                animatedStyle,\n                style,\n            ]}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;;;;;;;AAGA;AACA,MAAMA,iBAAiB,GAAGC,8BAAA,CAASC,uBAAT,CAAiCC,6BAAjC,CAA1B;;AAEA,MAAMC,gBAA4C,GAAG;EAAEC,QAAQ,EAAE;AAAZ,CAArD;;AAEe,SAASC,SAAT,CAAmBC,KAAnB,EAA0C;EACrD,MAAM;IACFC,MADE;IAEFC,OAFE;IAGFC,MAHE;IAIFC,UAJE;IAKFC,MALE;IAMFC;EANE,IAOFN,KAPJ;EASA,MAAMO,KAAK,GAAG;IAAED,KAAF;IAASL;EAAT,CAAd;EAEA,MAAMO,OAAO,GAAG,IAAAC,qCAAA,EAAe,CAAf,CAAhB;EAEA,MAAMC,aAAa,GAAG,IAAAC,uCAAA,EAAiB,OAAO;IAC1CH,OAAO,EAAEA,OAAO,CAACI;EADyB,CAAP,CAAjB,EAElB,EAFkB,CAAtB;;EAIA,MAAMC,UAAU,GAAG,MAAM;IACrBL,OAAO,CAACI,KAAR,GAAgB,IAAAE,iCAAA,EAAW,CAAX,EAAcjB,gBAAd,CAAhB;;IAEA,IAAIM,MAAJ,EAAY;MACRA,MAAM;IACT;EACJ,CAND;;EAQA,oBACI,6BAAC,iBAAD;IACI,OAAO,EAAED,OADb;IAEI,MAAM,EAAEW,UAFZ;IAGI,UAAU,EAAET,UAHhB;IAII,MAAM,EAAE;MAAEW,GAAG,EAAEV,MAAM,CAACU;IAAd,CAJZ;IAKI,KAAK,EAAE,CACHL,aADG,EAEHH,KAFG;EALX,EADJ;AAYH;;AAAA"}
+{"version":3,"names":["AnimatedFastImage","Animated","createAnimatedComponent","FastImage","INITIAL_OPACITY","LOADED_OPACITY","ANIMATION_DURATION","ImageCore","props","height","onError","onLoad","resizeMode","source","width","opacity","useRef","Value","current","handleLoad","useCallback","timing","toValue","duration","useNativeDriver","start","uri"],"sources":["ImageCoreNative.tsx"],"sourcesContent":["import React, { useCallback, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport FastImage from 'react-native-fast-image';\nimport type ImageCoreProps from './ImageCoreProps';\n\n// @ts-ignore\nconst AnimatedFastImage = Animated.createAnimatedComponent(FastImage);\n\nconst INITIAL_OPACITY = 0;\nconst LOADED_OPACITY = 1;\n\nconst ANIMATION_DURATION = 200;\n\nexport default function ImageCore(props: ImageCoreProps) {\n    const {\n        height,\n        onError,\n        onLoad,\n        resizeMode,\n        source,\n        width,\n    } = props;\n\n    const opacity = useRef<Animated.Value>(new Animated.Value(INITIAL_OPACITY)).current;\n\n    const handleLoad = useCallback(() => {\n        Animated.timing(opacity, {\n            toValue: LOADED_OPACITY,\n            duration: ANIMATION_DURATION,\n            useNativeDriver: true,\n        }).start();\n\n        onLoad?.();\n    }, [onLoad]);\n\n    return (\n        <AnimatedFastImage\n            onError={onError}\n            onLoad={handleLoad}\n            resizeMode={resizeMode}\n            source={{ uri: source.uri }}\n            style={[\n                { opacity },\n                { width, height },\n            ]}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;;;;;AAGA;AACA,MAAMA,iBAAiB,GAAGC,qBAAA,CAASC,uBAAT,CAAiCC,6BAAjC,CAA1B;;AAEA,MAAMC,eAAe,GAAG,CAAxB;AACA,MAAMC,cAAc,GAAG,CAAvB;AAEA,MAAMC,kBAAkB,GAAG,GAA3B;;AAEe,SAASC,SAAT,CAAmBC,KAAnB,EAA0C;EACrD,MAAM;IACFC,MADE;IAEFC,OAFE;IAGFC,MAHE;IAIFC,UAJE;IAKFC,MALE;IAMFC;EANE,IAOFN,KAPJ;EASA,MAAMO,OAAO,GAAG,IAAAC,aAAA,EAAuB,IAAIf,qBAAA,CAASgB,KAAb,CAAmBb,eAAnB,CAAvB,EAA4Dc,OAA5E;EAEA,MAAMC,UAAU,GAAG,IAAAC,kBAAA,EAAY,MAAM;IACjCnB,qBAAA,CAASoB,MAAT,CAAgBN,OAAhB,EAAyB;MACrBO,OAAO,EAAEjB,cADY;MAErBkB,QAAQ,EAAEjB,kBAFW;MAGrBkB,eAAe,EAAE;IAHI,CAAzB,EAIGC,KAJH;;IAMAd,MAAM,SAAN,IAAAA,MAAM,WAAN,YAAAA,MAAM;EACT,CARkB,EAQhB,CAACA,MAAD,CARgB,CAAnB;EAUA,oBACI,6BAAC,iBAAD;IACI,OAAO,EAAED,OADb;IAEI,MAAM,EAAES,UAFZ;IAGI,UAAU,EAAEP,UAHhB;IAII,MAAM,EAAE;MAAEc,GAAG,EAAEb,MAAM,CAACa;IAAd,CAJZ;IAKI,KAAK,EAAE,CACH;MAAEX;IAAF,CADG,EAEH;MAAED,KAAF;MAASL;IAAT,CAFG;EALX,EADJ;AAYH;;AAAA"}

package/build/commonjs/Tooltip/Tooltip.js

@@ -5,29 +5,29 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = Tooltip;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _reactNative = require("react-native");
 
-var _reactNativeGestureHandler = require("react-native-gesture-handler");
-
 var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
 
 var _utils = require("@fountain-ui/utils");
 
+var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
+
 var _styles = require("../styles");
 
 var _icons = require("../internal/icons");
 
 var _UpArrow = _interopRequireDefault(require("./UpArrow"));
 
+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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const defaultOpacity = 0.8;
+const DEFAULT_OPACITY = 0.8;
 const initialLayout = {
   width: 0,
   height: 0,
@@ -52,11 +52,9 @@ function Tooltip(props) {
     visible = false
   } = props;
   const theme = (0, _styles.useTheme)();
-
-  const [layout, setLayout] = _react.default.useState(initialLayout);
-
+  const [layout, setLayout] = (0, _react.useState)(initialLayout);
   const scale = (0, _reactNativeReanimated.useSharedValue)(0);
-  const tooltipAnimatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
+  const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
     transform: [{
       scale: scale.value
     }]
@@ -74,15 +72,13 @@ function Tooltip(props) {
     height: visible ? undefined : 0,
     overflow: visible ? undefined : 'hidden'
   };
-
-  _react.default.useEffect(() => {
+  (0, _react.useEffect)(() => {
     const nextScaleValue = visible ? 1 : 0;
     scale.value = (0, _reactNativeReanimated.withTiming)(nextScaleValue, ANIMATION_CONFIG);
   }, [visible]);
-
   const touchableStyle = {
     alignItems: 'center',
-    backgroundColor: `rgba(${r}, ${g}, ${b}, ${defaultOpacity})`,
+    backgroundColor: `rgba(${r}, ${g}, ${b}, ${DEFAULT_OPACITY})`,
     borderRadius: theme.shape.roundness,
     flexDirection: 'row',
     padding: theme.spacing(2)
@@ -95,8 +91,8 @@ function Tooltip(props) {
     marginRight: theme.spacing(2)
   }]);
 
-  const buttonElem = /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.TouchableWithoutFeedback, {
-    disallowInterruption: true,
+  const buttonElem = /*#__PURE__*/_react.default.createElement(_ButtonBase.default, {
+    pressEffect: 'none',
     onPress: onClose
   }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: (0, _styles.css)(touchableStyle)
@@ -114,14 +110,14 @@ function Tooltip(props) {
   const arrowElem = /*#__PURE__*/_react.default.createElement(_UpArrow.default, {
     upsideDown: placement === 'top',
     fill: theme.palette.primary.main,
-    opacity: defaultOpacity
+    opacity: DEFAULT_OPACITY
   });
 
   return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: style
   }, children, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
     onLayout: event => setLayout(event.nativeEvent.layout),
-    style: [tooltipAnimatedStyle, tooltipLayoutStyle, tooltipStyle]
+    style: [animatedStyle, tooltipLayoutStyle, tooltipStyle]
   }, placement === 'top' ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, buttonElem, arrowElem) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, arrowElem, buttonElem)));
 }
 

package/build/commonjs/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"names":["defaultOpacity","initialLayout","width","height","x","y","ANIMATION_CONFIG","duration","Tooltip","props","children","left","onClose","placement","right","style","title","tooltipStyle","verticalOffset","visible","theme","useTheme","layout","setLayout","React","useState","scale","useSharedValue","tooltipAnimatedStyle","useAnimatedStyle","transform","value","r","g","b","rgb","palette","primary","main","totalVerticalOffset","tooltipLayoutStyle","alignItems","bottom","undefined","position","top","zIndex","tooltip","overflow","useEffect","nextScaleValue","withTiming","touchableStyle","backgroundColor","borderRadius","shape","roundness","flexDirection","padding","spacing","fontStyle","createFontStyle","selector","typo","caption2","color","contrastTextColor","textStyle","css","marginRight","buttonElem","arrowElem","event","nativeEvent"],"sources":["Tooltip.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View, ViewProps } from 'react-native';\nimport { TouchableWithoutFeedback } from 'react-native-gesture-handler';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';\nimport { rgb } from '@fountain-ui/utils';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { Close as CloseIcon } from '../internal/icons';\nimport type TooltipProps from './TooltipProps';\nimport UpArrow from './UpArrow';\n\nconst defaultOpacity = 0.8;\nconst initialLayout = { width: 0, height: 0, x: 0, y: 0 };\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 150 };\n\nexport default function Tooltip(props: TooltipProps) {\n    const {\n        children,\n        left,\n        onClose,\n        placement = 'top',\n        right,\n        style,\n        title,\n        tooltipStyle,\n        verticalOffset = 4,\n        visible = false,\n    } = props;\n\n    const theme = useTheme();\n\n    const [layout, setLayout] = React.useState(initialLayout);\n\n    const scale = useSharedValue(0);\n\n    const tooltipAnimatedStyle = useAnimatedStyle(() => ({\n        transform: [{ scale: scale.value }],\n    }), []);\n\n    const [r, g, b] = rgb(theme.palette.primary.main);\n\n    const totalVerticalOffset = -(layout.height + verticalOffset);\n    const tooltipLayoutStyle: ViewProps['style'] = {\n        alignItems: 'center',\n        bottom: placement === 'bottom' ? totalVerticalOffset : undefined,\n        left,\n        position: 'absolute',\n        right,\n        top: placement === 'top' ? totalVerticalOffset : undefined,\n        zIndex: theme.zIndex.tooltip,\n        height: visible ? undefined : 0,\n        overflow: visible ? undefined : 'hidden',\n    };\n\n    React.useEffect(() => {\n        const nextScaleValue = visible ? 1 : 0;\n\n        scale.value = withTiming(nextScaleValue, ANIMATION_CONFIG);\n    }, [visible]);\n\n    const touchableStyle: ViewProps['style'] = {\n        alignItems: 'center',\n        backgroundColor: `rgba(${r}, ${g}, ${b}, ${defaultOpacity})`,\n        borderRadius: theme.shape.roundness,\n        flexDirection: 'row',\n        padding: theme.spacing(2),\n    };\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => typo.caption2,\n        color: theme.palette.primary.contrastTextColor,\n    });\n\n    const textStyle = css([\n        fontStyle,\n        { marginRight: theme.spacing(2) },\n    ]);\n\n    const buttonElem = (\n        <TouchableWithoutFeedback\n            disallowInterruption={true}\n            onPress={onClose}\n        >\n            <View style={css(touchableStyle)}>\n                <Text\n                    children={title}\n                    // TODO: Should we provide text prop customization?\n                    numberOfLines={1}\n                    style={textStyle}\n                />\n                <CloseIcon\n                    fill={theme.palette.primary.contrastTextColor}\n                    width={20}\n                    height={20}\n                />\n            </View>\n        </TouchableWithoutFeedback>\n    );\n\n    const arrowElem = (\n        <UpArrow\n            upsideDown={placement === 'top'}\n            fill={theme.palette.primary.main}\n            opacity={defaultOpacity}\n        />\n    );\n\n    return (\n        <View style={style}>\n            {children}\n\n            <Animated.View\n                onLayout={(event) => setLayout(event.nativeEvent.layout)}\n                style={[\n                    tooltipAnimatedStyle,\n                    tooltipLayoutStyle,\n                    tooltipStyle,\n                ]}\n            >\n                {placement === 'top' ? (\n                    <React.Fragment>\n                        {buttonElem}\n                        {arrowElem}\n                    </React.Fragment>\n                ) : (\n                    <React.Fragment>\n                        {arrowElem}\n                        {buttonElem}\n                    </React.Fragment>\n                )}\n            </Animated.View>\n        </View>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["DEFAULT_OPACITY","initialLayout","width","height","x","y","ANIMATION_CONFIG","duration","Tooltip","props","children","left","onClose","placement","right","style","title","tooltipStyle","verticalOffset","visible","theme","useTheme","layout","setLayout","useState","scale","useSharedValue","animatedStyle","useAnimatedStyle","transform","value","r","g","b","rgb","palette","primary","main","totalVerticalOffset","tooltipLayoutStyle","alignItems","bottom","undefined","position","top","zIndex","tooltip","overflow","useEffect","nextScaleValue","withTiming","touchableStyle","backgroundColor","borderRadius","shape","roundness","flexDirection","padding","spacing","fontStyle","createFontStyle","selector","typo","caption2","color","contrastTextColor","textStyle","css","marginRight","buttonElem","arrowElem","event","nativeEvent"],"sources":["Tooltip.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Text, View, ViewProps } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';\nimport { rgb } from '@fountain-ui/utils';\nimport ButtonBase from '../ButtonBase';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { Close as CloseIcon } from '../internal/icons';\nimport type TooltipProps from './TooltipProps';\nimport UpArrow from './UpArrow';\n\nconst DEFAULT_OPACITY = 0.8;\nconst initialLayout = { width: 0, height: 0, x: 0, y: 0 };\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 150 };\n\nexport default function Tooltip(props: TooltipProps) {\n    const {\n        children,\n        left,\n        onClose,\n        placement = 'top',\n        right,\n        style,\n        title,\n        tooltipStyle,\n        verticalOffset = 4,\n        visible = false,\n    } = props;\n\n    const theme = useTheme();\n\n    const [layout, setLayout] = useState(initialLayout);\n\n    const scale = useSharedValue(0);\n\n    const animatedStyle = useAnimatedStyle(() => ({\n        transform: [{ scale: scale.value }],\n    }), []);\n\n    const [r, g, b] = rgb(theme.palette.primary.main);\n\n    const totalVerticalOffset = -(layout.height + verticalOffset);\n    const tooltipLayoutStyle: ViewProps['style'] = {\n        alignItems: 'center',\n        bottom: placement === 'bottom' ? totalVerticalOffset : undefined,\n        left,\n        position: 'absolute',\n        right,\n        top: placement === 'top' ? totalVerticalOffset : undefined,\n        zIndex: theme.zIndex.tooltip,\n        height: visible ? undefined : 0,\n        overflow: visible ? undefined : 'hidden',\n    };\n\n    useEffect(() => {\n        const nextScaleValue = visible ? 1 : 0;\n\n        scale.value = withTiming(nextScaleValue, ANIMATION_CONFIG);\n    }, [visible]);\n\n    const touchableStyle: ViewProps['style'] = {\n        alignItems: 'center',\n        backgroundColor: `rgba(${r}, ${g}, ${b}, ${DEFAULT_OPACITY})`,\n        borderRadius: theme.shape.roundness,\n        flexDirection: 'row',\n        padding: theme.spacing(2),\n    };\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => typo.caption2,\n        color: theme.palette.primary.contrastTextColor,\n    });\n\n    const textStyle = css([\n        fontStyle,\n        { marginRight: theme.spacing(2) },\n    ]);\n\n    const buttonElem = (\n        <ButtonBase\n            pressEffect={'none'}\n            onPress={onClose}\n        >\n            <View style={css(touchableStyle)}>\n                <Text\n                    children={title}\n                    // TODO: Should we provide text prop customization?\n                    numberOfLines={1}\n                    style={textStyle}\n                />\n                <CloseIcon\n                    fill={theme.palette.primary.contrastTextColor}\n                    width={20}\n                    height={20}\n                />\n            </View>\n        </ButtonBase>\n    );\n\n    const arrowElem = (\n        <UpArrow\n            upsideDown={placement === 'top'}\n            fill={theme.palette.primary.main}\n            opacity={DEFAULT_OPACITY}\n        />\n    );\n\n    return (\n        <View style={style}>\n            {children}\n\n            <Animated.View\n                onLayout={(event) => setLayout(event.nativeEvent.layout)}\n                style={[\n                    animatedStyle,\n                    tooltipLayoutStyle,\n                    tooltipStyle,\n                ]}\n            >\n                {placement === 'top' ? (\n                    <React.Fragment>\n                        {buttonElem}\n                        {arrowElem}\n                    </React.Fragment>\n                ) : (\n                    <React.Fragment>\n                        {arrowElem}\n                        {buttonElem}\n                    </React.Fragment>\n                )}\n            </Animated.View>\n        </View>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;AAEA,MAAMA,eAAe,GAAG,GAAxB;AACA,MAAMC,aAAa,GAAG;EAAEC,KAAK,EAAE,CAAT;EAAYC,MAAM,EAAE,CAApB;EAAuBC,CAAC,EAAE,CAA1B;EAA6BC,CAAC,EAAE;AAAhC,CAAtB;AAEA,MAAMC,gBAA4C,GAAG;EAAEC,QAAQ,EAAE;AAAZ,CAArD;;AAEe,SAASC,OAAT,CAAiBC,KAAjB,EAAsC;EACjD,MAAM;IACFC,QADE;IAEFC,IAFE;IAGFC,OAHE;IAIFC,SAAS,GAAG,KAJV;IAKFC,KALE;IAMFC,KANE;IAOFC,KAPE;IAQFC,YARE;IASFC,cAAc,GAAG,CATf;IAUFC,OAAO,GAAG;EAVR,IAWFV,KAXJ;EAaA,MAAMW,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsB,IAAAC,eAAA,EAASvB,aAAT,CAA5B;EAEA,MAAMwB,KAAK,GAAG,IAAAC,qCAAA,EAAe,CAAf,CAAd;EAEA,MAAMC,aAAa,GAAG,IAAAC,uCAAA,EAAiB,OAAO;IAC1CC,SAAS,EAAE,CAAC;MAAEJ,KAAK,EAAEA,KAAK,CAACK;IAAf,CAAD;EAD+B,CAAP,CAAjB,EAElB,EAFkB,CAAtB;EAIA,MAAM,CAACC,CAAD,EAAIC,CAAJ,EAAOC,CAAP,IAAY,IAAAC,UAAA,EAAId,KAAK,CAACe,OAAN,CAAcC,OAAd,CAAsBC,IAA1B,CAAlB;EAEA,MAAMC,mBAAmB,GAAG,EAAEhB,MAAM,CAACnB,MAAP,GAAgBe,cAAlB,CAA5B;EACA,MAAMqB,kBAAsC,GAAG;IAC3CC,UAAU,EAAE,QAD+B;IAE3CC,MAAM,EAAE5B,SAAS,KAAK,QAAd,GAAyByB,mBAAzB,GAA+CI,SAFZ;IAG3C/B,IAH2C;IAI3CgC,QAAQ,EAAE,UAJiC;IAK3C7B,KAL2C;IAM3C8B,GAAG,EAAE/B,SAAS,KAAK,KAAd,GAAsByB,mBAAtB,GAA4CI,SANN;IAO3CG,MAAM,EAAEzB,KAAK,CAACyB,MAAN,CAAaC,OAPsB;IAQ3C3C,MAAM,EAAEgB,OAAO,GAAGuB,SAAH,GAAe,CARa;IAS3CK,QAAQ,EAAE5B,OAAO,GAAGuB,SAAH,GAAe;EATW,CAA/C;EAYA,IAAAM,gBAAA,EAAU,MAAM;IACZ,MAAMC,cAAc,GAAG9B,OAAO,GAAG,CAAH,GAAO,CAArC;IAEAM,KAAK,CAACK,KAAN,GAAc,IAAAoB,iCAAA,EAAWD,cAAX,EAA2B3C,gBAA3B,CAAd;EACH,CAJD,EAIG,CAACa,OAAD,CAJH;EAMA,MAAMgC,cAAkC,GAAG;IACvCX,UAAU,EAAE,QAD2B;IAEvCY,eAAe,EAAG,QAAOrB,CAAE,KAAIC,CAAE,KAAIC,CAAE,KAAIjC,eAAgB,GAFpB;IAGvCqD,YAAY,EAAEjC,KAAK,CAACkC,KAAN,CAAYC,SAHa;IAIvCC,aAAa,EAAE,KAJwB;IAKvCC,OAAO,EAAErC,KAAK,CAACsC,OAAN,CAAc,CAAd;EAL8B,CAA3C;EAQA,MAAMC,SAAS,GAAG,IAAAC,uBAAA,EAAgBxC,KAAhB,EAAuB;IACrCyC,QAAQ,EAAGC,IAAD,IAAUA,IAAI,CAACC,QADY;IAErCC,KAAK,EAAE5C,KAAK,CAACe,OAAN,CAAcC,OAAd,CAAsB6B;EAFQ,CAAvB,CAAlB;EAKA,MAAMC,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBR,SADkB,EAElB;IAAES,WAAW,EAAEhD,KAAK,CAACsC,OAAN,CAAc,CAAd;EAAf,CAFkB,CAAJ,CAAlB;;EAKA,MAAMW,UAAU,gBACZ,6BAAC,mBAAD;IACI,WAAW,EAAE,MADjB;IAEI,OAAO,EAAEzD;EAFb,gBAII,6BAAC,iBAAD;IAAM,KAAK,EAAE,IAAAuD,WAAA,EAAIhB,cAAJ;EAAb,gBACI,6BAAC,iBAAD;IACI,QAAQ,EAAEnC,KADd,CAEI;IAFJ;IAGI,aAAa,EAAE,CAHnB;IAII,KAAK,EAAEkD;EAJX,EADJ,eAOI,6BAAC,YAAD;IACI,IAAI,EAAE9C,KAAK,CAACe,OAAN,CAAcC,OAAd,CAAsB6B,iBADhC;IAEI,KAAK,EAAE,EAFX;IAGI,MAAM,EAAE;EAHZ,EAPJ,CAJJ,CADJ;;EAqBA,MAAMK,SAAS,gBACX,6BAAC,gBAAD;IACI,UAAU,EAAEzD,SAAS,KAAK,KAD9B;IAEI,IAAI,EAAEO,KAAK,CAACe,OAAN,CAAcC,OAAd,CAAsBC,IAFhC;IAGI,OAAO,EAAErC;EAHb,EADJ;;EAQA,oBACI,6BAAC,iBAAD;IAAM,KAAK,EAAEe;EAAb,GACKL,QADL,eAGI,6BAAC,8BAAD,CAAU,IAAV;IACI,QAAQ,EAAG6D,KAAD,IAAWhD,SAAS,CAACgD,KAAK,CAACC,WAAN,CAAkBlD,MAAnB,CADlC;IAEI,KAAK,EAAE,CACHK,aADG,EAEHY,kBAFG,EAGHtB,YAHG;EAFX,GAQKJ,SAAS,KAAK,KAAd,gBACG,6BAAC,cAAD,CAAO,QAAP,QACKwD,UADL,EAEKC,SAFL,CADH,gBAMG,6BAAC,cAAD,CAAO,QAAP,QACKA,SADL,EAEKD,UAFL,CAdR,CAHJ,CADJ;AA0BH;;AAAA"}

package/build/commonjs/animated/AnimatedPressable.js

@@ -5,14 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
+var _reactNative = require("react-native");
 
 var _Pressable = _interopRequireDefault(require("../Pressable"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-// @ts-ignore
-var _default = _reactNativeReanimated.default.createAnimatedComponent(_Pressable.default);
+var _default = _reactNative.Animated.createAnimatedComponent(_Pressable.default);
 
 exports.default = _default;
 //# sourceMappingURL=AnimatedPressable.js.map

package/build/commonjs/animated/AnimatedPressable.js.map

@@ -1 +1 @@
-{"version":3,"names":["Animated","createAnimatedComponent","Pressable"],"sources":["AnimatedPressable.tsx"],"sourcesContent":["import React from 'react';\nimport Animated from 'react-native-reanimated';\nimport Pressable from '../Pressable';\n\n// @ts-ignore\nexport default Animated.createAnimatedComponent(Pressable);\n"],"mappings":";;;;;;;AACA;;AACA;;;;AAEA;eACeA,8BAAA,CAASC,uBAAT,CAAiCC,kBAAjC,C"}
+{"version":3,"names":["Animated","createAnimatedComponent","Pressable"],"sources":["AnimatedPressable.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated } from 'react-native';\nimport Pressable from '../Pressable';\n\nexport default Animated.createAnimatedComponent(Pressable);\n"],"mappings":";;;;;;;AACA;;AACA;;;;eAEeA,qBAAA,CAASC,uBAAT,CAAiCC,kBAAjC,C"}

package/build/commonjs/hooks/useThrottle.js

@@ -5,19 +5,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = useThrottle;
 
-var _react = _interopRequireDefault(require("react"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _react = require("react");
 
 function useThrottle(options) {
   const {
     periodMillis,
     callback
   } = options;
-
-  const lastExecMillisRef = _react.default.useRef(0);
-
-  return _react.default.useCallback(function () {
+  const lastExecMillisRef = (0, _react.useRef)(0);
+  return (0, _react.useCallback)(function () {
     const now = Date.now();
     const millisAfterExecuted = now - lastExecMillisRef.current;
     lastExecMillisRef.current = now;

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

@@ -1 +1 @@
-{"version":3,"names":["useThrottle","options","periodMillis","callback","lastExecMillisRef","React","useRef","useCallback","now","Date","millisAfterExecuted","current"],"sources":["useThrottle.ts"],"sourcesContent":["import React from 'react';\n\nexport interface ThrottleOptions {\n    periodMillis: number;\n    callback?: (args?: any) => void;\n}\n\nexport default function useThrottle(options: ThrottleOptions) {\n    const { periodMillis, callback } = options;\n\n    const lastExecMillisRef = React.useRef(0);\n\n    return React.useCallback((...args: any[]) => {\n        const now = Date.now();\n        const millisAfterExecuted = now - lastExecMillisRef.current;\n        lastExecMillisRef.current = now;\n\n        if (millisAfterExecuted > periodMillis || periodMillis <= 0) {\n            if (callback) {\n                callback(...args);\n            }\n        }\n    }, [callback, periodMillis]);\n}\n"],"mappings":";;;;;;;AAAA;;;;AAOe,SAASA,WAAT,CAAqBC,OAArB,EAA+C;EAC1D,MAAM;IAAEC,YAAF;IAAgBC;EAAhB,IAA6BF,OAAnC;;EAEA,MAAMG,iBAAiB,GAAGC,cAAA,CAAMC,MAAN,CAAa,CAAb,CAA1B;;EAEA,OAAOD,cAAA,CAAME,WAAN,CAAkB,YAAoB;IACzC,MAAMC,GAAG,GAAGC,IAAI,CAACD,GAAL,EAAZ;IACA,MAAME,mBAAmB,GAAGF,GAAG,GAAGJ,iBAAiB,CAACO,OAApD;IACAP,iBAAiB,CAACO,OAAlB,GAA4BH,GAA5B;;IAEA,IAAIE,mBAAmB,GAAGR,YAAtB,IAAsCA,YAAY,IAAI,CAA1D,EAA6D;MACzD,IAAIC,QAAJ,EAAc;QACVA,QAAQ,CAAC,YAAD,CAAR;MACH;IACJ;EACJ,CAVM,EAUJ,CAACA,QAAD,EAAWD,YAAX,CAVI,CAAP;AAWH"}
+{"version":3,"names":["useThrottle","options","periodMillis","callback","lastExecMillisRef","useRef","useCallback","now","Date","millisAfterExecuted","current"],"sources":["useThrottle.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\n\nexport interface ThrottleOptions {\n    periodMillis: number;\n    callback?: (args?: any) => void;\n}\n\nexport default function useThrottle(options: ThrottleOptions) {\n    const { periodMillis, callback } = options;\n\n    const lastExecMillisRef = useRef(0);\n\n    return useCallback((...args: any[]) => {\n        const now = Date.now();\n        const millisAfterExecuted = now - lastExecMillisRef.current;\n        lastExecMillisRef.current = now;\n\n        if (millisAfterExecuted > periodMillis || periodMillis <= 0) {\n            if (callback) {\n                callback(...args);\n            }\n        }\n    }, [callback, periodMillis]);\n}\n"],"mappings":";;;;;;;AAAA;;AAOe,SAASA,WAAT,CAAqBC,OAArB,EAA+C;EAC1D,MAAM;IAAEC,YAAF;IAAgBC;EAAhB,IAA6BF,OAAnC;EAEA,MAAMG,iBAAiB,GAAG,IAAAC,aAAA,EAAO,CAAP,CAA1B;EAEA,OAAO,IAAAC,kBAAA,EAAY,YAAoB;IACnC,MAAMC,GAAG,GAAGC,IAAI,CAACD,GAAL,EAAZ;IACA,MAAME,mBAAmB,GAAGF,GAAG,GAAGH,iBAAiB,CAACM,OAApD;IACAN,iBAAiB,CAACM,OAAlB,GAA4BH,GAA5B;;IAEA,IAAIE,mBAAmB,GAAGP,YAAtB,IAAsCA,YAAY,IAAI,CAA1D,EAA6D;MACzD,IAAIC,QAAJ,EAAc;QACVA,QAAQ,CAAC,YAAD,CAAR;MACH;IACJ;EACJ,CAVM,EAUJ,CAACA,QAAD,EAAWD,YAAX,CAVI,CAAP;AAWH"}

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

@@ -5,17 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = useHeight;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = require("react");
 
 var _reactNativeReanimated = require("react-native-reanimated");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function useHeight() {
   let initialHeight = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-
-  const [height, setHeight] = _react.default.useState(initialHeight);
-
+  const [height, setHeight] = (0, _react.useState)(initialHeight);
   const onLayout = (0, _reactNativeReanimated.useWorkletCallback)(e => {
     setHeight(e.nativeEvent.layout.height);
   }, []);

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

@@ -1 +1 @@
-{"version":3,"names":["useHeight","initialHeight","height","setHeight","React","useState","onLayout","useWorkletCallback","e","nativeEvent","layout"],"sources":["useHeight.ts"],"sourcesContent":["import React from 'react';\nimport { ViewProps } from 'react-native';\nimport { useWorkletCallback } from 'react-native-reanimated';\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport default function useHeight(initialHeight = 0): [number, OnLayoutCallback] {\n    const [height, setHeight] = React.useState<number>(initialHeight);\n\n    const onLayout = useWorkletCallback((e) => {\n        setHeight(e.nativeEvent.layout.height);\n    }, []);\n\n    return [height, onLayout];\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;;;AAIe,SAASA,SAAT,GAAkE;EAAA,IAA/CC,aAA+C,uEAA/B,CAA+B;;EAC7E,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBC,cAAA,CAAMC,QAAN,CAAuBJ,aAAvB,CAA5B;;EAEA,MAAMK,QAAQ,GAAG,IAAAC,yCAAA,EAAoBC,CAAD,IAAO;IACvCL,SAAS,CAACK,CAAC,CAACC,WAAF,CAAcC,MAAd,CAAqBR,MAAtB,CAAT;EACH,CAFgB,EAEd,EAFc,CAAjB;EAIA,OAAO,CAACA,MAAD,EAASI,QAAT,CAAP;AACH;;AAAA"}
+{"version":3,"names":["useHeight","initialHeight","height","setHeight","useState","onLayout","useWorkletCallback","e","nativeEvent","layout"],"sources":["useHeight.ts"],"sourcesContent":["import { useState } from 'react';\nimport { ViewProps } from 'react-native';\nimport { useWorkletCallback } from 'react-native-reanimated';\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport default function useHeight(initialHeight = 0): [number, OnLayoutCallback] {\n    const [height, setHeight] = useState<number>(initialHeight);\n\n    const onLayout = useWorkletCallback((e) => {\n        setHeight(e.nativeEvent.layout.height);\n    }, []);\n\n    return [height, onLayout];\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAIe,SAASA,SAAT,GAAkE;EAAA,IAA/CC,aAA+C,uEAA/B,CAA+B;EAC7E,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsB,IAAAC,eAAA,EAAiBH,aAAjB,CAA5B;EAEA,MAAMI,QAAQ,GAAG,IAAAC,yCAAA,EAAoBC,CAAD,IAAO;IACvCJ,SAAS,CAACI,CAAC,CAACC,WAAF,CAAcC,MAAd,CAAqBP,MAAtB,CAAT;EACH,CAFgB,EAEd,EAFc,CAAjB;EAIA,OAAO,CAACA,MAAD,EAASG,QAAT,CAAP;AACH;;AAAA"}