@fountain-ui/core 2.0.0-beta.53 → 2.0.0-beta.55

package/build/commonjs/TextField/TextField.js

@@ -61,6 +61,13 @@ const TextField = /*#__PURE__*/_react.default.forwardRef(function TextField(prop
       var _innerRef$current3;
 
       (_innerRef$current3 = innerRef.current) === null || _innerRef$current3 === void 0 ? void 0 : _innerRef$current3.blur();
+    },
+    setStyle: style => {
+      var _innerRef$current4;
+
+      (_innerRef$current4 = innerRef.current) === null || _innerRef$current4 === void 0 ? void 0 : _innerRef$current4.setNativeProps({
+        style
+      });
     }
   }));
   const animatedLabel = (0, _hooks.useAnimatedValue)(value ? 0 : 1);
@@ -153,21 +160,11 @@ const TextField = /*#__PURE__*/_react.default.forwardRef(function TextField(prop
   };
 
   const forceFocus = () => {
-    var _innerRef$current4;
-
-    (_innerRef$current4 = innerRef.current) === null || _innerRef$current4 === void 0 ? void 0 : _innerRef$current4.focus();
-  }; // react-native TextInput font family issue at android
-
-
-  (0, _react.useEffect)(() => {
     var _innerRef$current5;
 
-    (_innerRef$current5 = innerRef.current) === null || _innerRef$current5 === void 0 ? void 0 : _innerRef$current5.setNativeProps({
-      style: {
-        fontFamily: 'Inter-Regular'
-      }
-    });
-  }, []);
+    (_innerRef$current5 = innerRef.current) === null || _innerRef$current5 === void 0 ? void 0 : _innerRef$current5.focus();
+  };
+
   return /*#__PURE__*/_react.default.createElement(_OutlinedTextField.default, {
     animatedError: animatedError,
     animatedLabel: animatedLabel,

package/build/commonjs/TextField/TextField.js.map

@@ -1 +1 @@
-{"version":3,"names":["TextField","React","forwardRef","props","ref","disabled","error","keyboardType","icon","label","onBlur","onChangeText","onFocus","onIconPress","onSubmitEditing","placeholder","placeholderProp","secureTextEntry","value","style","styleProp","innerRef","useRef","useImperativeHandle","focus","current","isFocused","clear","blur","animatedLabel","useAnimatedValue","animatedError","focused","setFocused","useState","setPlaceholder","labelLayout","setLabelLayout","measured","width","height","minimizeLabel","Animated","timing","toValue","duration","blurAnimationDuration","useNativeDriver","start","restoreLabel","focusAnimationDuration","showError","hideError","showPlaceholder","hidePlaceholder","useEffect","handleFocus","event","handleBlur","css","opacity","handleLayoutAnimatedText","nativeEvent","layout","forceFocus","setNativeProps","fontFamily"],"sources":["TextField.tsx"],"sourcesContent":["import React, { useEffect, useImperativeHandle, useRef } from 'react';\nimport { Animated, LayoutChangeEvent, NativeSyntheticEvent, TargetedEvent, TextInput } from 'react-native';\nimport { css } from '../styles';\nimport { useAnimatedValue } from '../hooks';\nimport OutlinedTextField from './OutlinedTextField';\nimport TextFieldProps from './TextFieldProps';\nimport { blurAnimationDuration, focusAnimationDuration } from './utils';\n\nconst TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {\n    const {\n        disabled = false,\n        error = false,\n        keyboardType = 'default',\n        icon,\n        label,\n        onBlur,\n        onChangeText,\n        onFocus,\n        onIconPress,\n        onSubmitEditing,\n        placeholder: placeholderProp,\n        secureTextEntry = false,\n        value,\n        style: styleProp,\n    } = props;\n\n    const innerRef = useRef<TextInput | null>(null);\n    //@ts-ignore\n    useImperativeHandle(ref, () => ({\n        focus: () => {\n            innerRef.current?.focus();\n        },\n        isFocused: () => {\n            const current = innerRef.current;\n            return current ? current.isFocused() : false;\n        },\n        clear: () => {\n            innerRef.current?.clear();\n        },\n        blur: () => {\n            innerRef.current?.blur();\n        },\n    }));\n\n    const animatedLabel = useAnimatedValue(value ? 0 : 1);\n    const animatedError = useAnimatedValue(error ? 1 : 0);\n    const [focused, setFocused] = React.useState(false);\n    const [placeholder, setPlaceholder] = React.useState('');\n    const [labelLayout, setLabelLayout] = React.useState({\n        measured: false,\n        width: 0,\n        height: 0,\n    });\n\n    const minimizeLabel = () => {\n        Animated.timing(animatedLabel, {\n            toValue: 0,\n            duration: blurAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const restoreLabel = () => {\n        Animated.timing(animatedLabel, {\n            toValue: 1,\n            duration: focusAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const showError = () => {\n        Animated.timing(animatedError, {\n            toValue: 1,\n            duration: focusAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const hideError = () => {\n        Animated.timing(animatedError, {\n            toValue: 0,\n            duration: blurAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const showPlaceholder = () => {\n        placeholderProp && setPlaceholder(placeholderProp);\n    };\n\n    const hidePlaceholder = () => setPlaceholder('');\n\n    React.useEffect(() => {\n        value || focused ? minimizeLabel() : restoreLabel();\n    }, [focused, value, labelLayout]);\n\n    React.useEffect(() => {\n        animatedError ? showError() : hideError();\n    }, [animatedError]);\n\n    React.useEffect(() => {\n        focused || !label ? showPlaceholder() : hidePlaceholder();\n    }, [focused, label]);\n\n    const handleFocus = (event: NativeSyntheticEvent<TargetedEvent>) => {\n        if (disabled) {\n            return;\n        }\n\n        setFocused(true);\n        onFocus?.(event);\n    };\n\n    const handleBlur = (event: NativeSyntheticEvent<TargetedEvent>) => {\n        setFocused(false);\n        onBlur?.(event);\n    };\n\n    const style = css([\n        { opacity: disabled ? 0.3 : 1 },\n        styleProp,\n    ]);\n\n    const handleLayoutAnimatedText = (event: LayoutChangeEvent) => {\n        setLabelLayout({\n            width: event.nativeEvent.layout.width,\n            height: event.nativeEvent.layout.height,\n            measured: true,\n        });\n    };\n\n    const forceFocus = () => {\n        innerRef.current?.focus();\n    };\n\n    // react-native TextInput font family issue at android\n    useEffect(() => {\n        innerRef.current?.setNativeProps({\n            style: { fontFamily: 'Inter-Regular' },\n        });\n    }, []);\n\n    return (\n        <OutlinedTextField\n            animatedError={animatedError}\n            animatedLabel={animatedLabel}\n            disabled={disabled}\n            error={error}\n            focused={focused}\n            forceFocus={forceFocus}\n            icon={icon}\n            keyboardType={keyboardType}\n            label={label}\n            labelLayout={labelLayout}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n            onChangeText={onChangeText}\n            onIconPress={onIconPress}\n            onLayoutAnimatedText={handleLayoutAnimatedText}\n            onSubmitEditing={onSubmitEditing}\n            placeholder={placeholder}\n            ref={innerRef}\n            secureTextEntry={secureTextEntry}\n            style={style}\n            value={value}\n        />\n    );\n});\n\nexport default TextField;\n"],"mappings":"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"}
+{"version":3,"names":["TextField","React","forwardRef","props","ref","disabled","error","keyboardType","icon","label","onBlur","onChangeText","onFocus","onIconPress","onSubmitEditing","placeholder","placeholderProp","secureTextEntry","value","style","styleProp","innerRef","useRef","useImperativeHandle","focus","current","isFocused","clear","blur","setStyle","setNativeProps","animatedLabel","useAnimatedValue","animatedError","focused","setFocused","useState","setPlaceholder","labelLayout","setLabelLayout","measured","width","height","minimizeLabel","Animated","timing","toValue","duration","blurAnimationDuration","useNativeDriver","start","restoreLabel","focusAnimationDuration","showError","hideError","showPlaceholder","hidePlaceholder","useEffect","handleFocus","event","handleBlur","css","opacity","handleLayoutAnimatedText","nativeEvent","layout","forceFocus"],"sources":["TextField.tsx"],"sourcesContent":["import React, { useImperativeHandle, useRef } from 'react';\nimport { Animated, LayoutChangeEvent, NativeSyntheticEvent, TargetedEvent, TextInput } from 'react-native';\nimport { css } from '../styles';\nimport { useAnimatedValue } from '../hooks';\nimport OutlinedTextField from './OutlinedTextField';\nimport TextFieldProps, { setStyleProp } from './TextFieldProps';\nimport { blurAnimationDuration, focusAnimationDuration } from './utils';\n\nconst TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {\n    const {\n        disabled = false,\n        error = false,\n        keyboardType = 'default',\n        icon,\n        label,\n        onBlur,\n        onChangeText,\n        onFocus,\n        onIconPress,\n        onSubmitEditing,\n        placeholder: placeholderProp,\n        secureTextEntry = false,\n        value,\n        style: styleProp,\n    } = props;\n\n    const innerRef = useRef<TextInput | null>(null);\n    //@ts-ignore\n    useImperativeHandle(ref, () => ({\n        focus: () => {\n            innerRef.current?.focus();\n        },\n        isFocused: () => {\n            const current = innerRef.current;\n            return current ? current.isFocused() : false;\n        },\n        clear: () => {\n            innerRef.current?.clear();\n        },\n        blur: () => {\n            innerRef.current?.blur();\n        },\n        setStyle: (style: setStyleProp) => {\n            innerRef.current?.setNativeProps({\n                style,\n            });\n        },\n    }));\n\n    const animatedLabel = useAnimatedValue(value ? 0 : 1);\n    const animatedError = useAnimatedValue(error ? 1 : 0);\n    const [focused, setFocused] = React.useState(false);\n    const [placeholder, setPlaceholder] = React.useState('');\n    const [labelLayout, setLabelLayout] = React.useState({\n        measured: false,\n        width: 0,\n        height: 0,\n    });\n\n    const minimizeLabel = () => {\n        Animated.timing(animatedLabel, {\n            toValue: 0,\n            duration: blurAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const restoreLabel = () => {\n        Animated.timing(animatedLabel, {\n            toValue: 1,\n            duration: focusAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const showError = () => {\n        Animated.timing(animatedError, {\n            toValue: 1,\n            duration: focusAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const hideError = () => {\n        Animated.timing(animatedError, {\n            toValue: 0,\n            duration: blurAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const showPlaceholder = () => {\n        placeholderProp && setPlaceholder(placeholderProp);\n    };\n\n    const hidePlaceholder = () => setPlaceholder('');\n\n    React.useEffect(() => {\n        value || focused ? minimizeLabel() : restoreLabel();\n    }, [focused, value, labelLayout]);\n\n    React.useEffect(() => {\n        animatedError ? showError() : hideError();\n    }, [animatedError]);\n\n    React.useEffect(() => {\n        focused || !label ? showPlaceholder() : hidePlaceholder();\n    }, [focused, label]);\n\n    const handleFocus = (event: NativeSyntheticEvent<TargetedEvent>) => {\n        if (disabled) {\n            return;\n        }\n\n        setFocused(true);\n        onFocus?.(event);\n    };\n\n    const handleBlur = (event: NativeSyntheticEvent<TargetedEvent>) => {\n        setFocused(false);\n        onBlur?.(event);\n    };\n\n    const style = css([\n        { opacity: disabled ? 0.3 : 1 },\n        styleProp,\n    ]);\n\n    const handleLayoutAnimatedText = (event: LayoutChangeEvent) => {\n        setLabelLayout({\n            width: event.nativeEvent.layout.width,\n            height: event.nativeEvent.layout.height,\n            measured: true,\n        });\n    };\n\n    const forceFocus = () => {\n        innerRef.current?.focus();\n    };\n\n    return (\n        <OutlinedTextField\n            animatedError={animatedError}\n            animatedLabel={animatedLabel}\n            disabled={disabled}\n            error={error}\n            focused={focused}\n            forceFocus={forceFocus}\n            icon={icon}\n            keyboardType={keyboardType}\n            label={label}\n            labelLayout={labelLayout}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n            onChangeText={onChangeText}\n            onIconPress={onIconPress}\n            onLayoutAnimatedText={handleLayoutAnimatedText}\n            onSubmitEditing={onSubmitEditing}\n            placeholder={placeholder}\n            ref={innerRef}\n            secureTextEntry={secureTextEntry}\n            style={style}\n            value={value}\n        />\n    );\n});\n\nexport default TextField;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;AAEA,MAAMA,SAAS,gBAAGC,cAAA,CAAMC,UAAN,CAA4C,SAASF,SAAT,CAAmBG,KAAnB,EAA0BC,GAA1B,EAA+B;EACzF,MAAM;IACFC,QAAQ,GAAG,KADT;IAEFC,KAAK,GAAG,KAFN;IAGFC,YAAY,GAAG,SAHb;IAIFC,IAJE;IAKFC,KALE;IAMFC,MANE;IAOFC,YAPE;IAQFC,OARE;IASFC,WATE;IAUFC,eAVE;IAWFC,WAAW,EAAEC,eAXX;IAYFC,eAAe,GAAG,KAZhB;IAaFC,KAbE;IAcFC,KAAK,EAAEC;EAdL,IAeFjB,KAfJ;EAiBA,MAAMkB,QAAQ,GAAG,IAAAC,aAAA,EAAyB,IAAzB,CAAjB,CAlByF,CAmBzF;;EACA,IAAAC,0BAAA,EAAoBnB,GAApB,EAAyB,OAAO;IAC5BoB,KAAK,EAAE,MAAM;MAAA;;MACT,qBAAAH,QAAQ,CAACI,OAAT,wEAAkBD,KAAlB;IACH,CAH2B;IAI5BE,SAAS,EAAE,MAAM;MACb,MAAMD,OAAO,GAAGJ,QAAQ,CAACI,OAAzB;MACA,OAAOA,OAAO,GAAGA,OAAO,CAACC,SAAR,EAAH,GAAyB,KAAvC;IACH,CAP2B;IAQ5BC,KAAK,EAAE,MAAM;MAAA;;MACT,sBAAAN,QAAQ,CAACI,OAAT,0EAAkBE,KAAlB;IACH,CAV2B;IAW5BC,IAAI,EAAE,MAAM;MAAA;;MACR,sBAAAP,QAAQ,CAACI,OAAT,0EAAkBG,IAAlB;IACH,CAb2B;IAc5BC,QAAQ,EAAGV,KAAD,IAAyB;MAAA;;MAC/B,sBAAAE,QAAQ,CAACI,OAAT,0EAAkBK,cAAlB,CAAiC;QAC7BX;MAD6B,CAAjC;IAGH;EAlB2B,CAAP,CAAzB;EAqBA,MAAMY,aAAa,GAAG,IAAAC,uBAAA,EAAiBd,KAAK,GAAG,CAAH,GAAO,CAA7B,CAAtB;EACA,MAAMe,aAAa,GAAG,IAAAD,uBAAA,EAAiB1B,KAAK,GAAG,CAAH,GAAO,CAA7B,CAAtB;;EACA,MAAM,CAAC4B,OAAD,EAAUC,UAAV,IAAwBlC,cAAA,CAAMmC,QAAN,CAAe,KAAf,CAA9B;;EACA,MAAM,CAACrB,WAAD,EAAcsB,cAAd,IAAgCpC,cAAA,CAAMmC,QAAN,CAAe,EAAf,CAAtC;;EACA,MAAM,CAACE,WAAD,EAAcC,cAAd,IAAgCtC,cAAA,CAAMmC,QAAN,CAAe;IACjDI,QAAQ,EAAE,KADuC;IAEjDC,KAAK,EAAE,CAF0C;IAGjDC,MAAM,EAAE;EAHyC,CAAf,CAAtC;;EAMA,MAAMC,aAAa,GAAG,MAAM;IACxBC,qBAAA,CAASC,MAAT,CAAgBd,aAAhB,EAA+B;MAC3Be,OAAO,EAAE,CADkB;MAE3BC,QAAQ,EAAEC,4BAFiB;MAG3BC,eAAe,EAAE;IAHU,CAA/B,EAIGC,KAJH;EAKH,CAND;;EAQA,MAAMC,YAAY,GAAG,MAAM;IACvBP,qBAAA,CAASC,MAAT,CAAgBd,aAAhB,EAA+B;MAC3Be,OAAO,EAAE,CADkB;MAE3BC,QAAQ,EAAEK,6BAFiB;MAG3BH,eAAe,EAAE;IAHU,CAA/B,EAIGC,KAJH;EAKH,CAND;;EAQA,MAAMG,SAAS,GAAG,MAAM;IACpBT,qBAAA,CAASC,MAAT,CAAgBZ,aAAhB,EAA+B;MAC3Ba,OAAO,EAAE,CADkB;MAE3BC,QAAQ,EAAEK,6BAFiB;MAG3BH,eAAe,EAAE;IAHU,CAA/B,EAIGC,KAJH;EAKH,CAND;;EAQA,MAAMI,SAAS,GAAG,MAAM;IACpBV,qBAAA,CAASC,MAAT,CAAgBZ,aAAhB,EAA+B;MAC3Ba,OAAO,EAAE,CADkB;MAE3BC,QAAQ,EAAEC,4BAFiB;MAG3BC,eAAe,EAAE;IAHU,CAA/B,EAIGC,KAJH;EAKH,CAND;;EAQA,MAAMK,eAAe,GAAG,MAAM;IAC1BvC,eAAe,IAAIqB,cAAc,CAACrB,eAAD,CAAjC;EACH,CAFD;;EAIA,MAAMwC,eAAe,GAAG,MAAMnB,cAAc,CAAC,EAAD,CAA5C;;EAEApC,cAAA,CAAMwD,SAAN,CAAgB,MAAM;IAClBvC,KAAK,IAAIgB,OAAT,GAAmBS,aAAa,EAAhC,GAAqCQ,YAAY,EAAjD;EACH,CAFD,EAEG,CAACjB,OAAD,EAAUhB,KAAV,EAAiBoB,WAAjB,CAFH;;EAIArC,cAAA,CAAMwD,SAAN,CAAgB,MAAM;IAClBxB,aAAa,GAAGoB,SAAS,EAAZ,GAAiBC,SAAS,EAAvC;EACH,CAFD,EAEG,CAACrB,aAAD,CAFH;;EAIAhC,cAAA,CAAMwD,SAAN,CAAgB,MAAM;IAClBvB,OAAO,IAAI,CAACzB,KAAZ,GAAoB8C,eAAe,EAAnC,GAAwCC,eAAe,EAAvD;EACH,CAFD,EAEG,CAACtB,OAAD,EAAUzB,KAAV,CAFH;;EAIA,MAAMiD,WAAW,GAAIC,KAAD,IAAgD;IAChE,IAAItD,QAAJ,EAAc;MACV;IACH;;IAED8B,UAAU,CAAC,IAAD,CAAV;IACAvB,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAG+C,KAAH,CAAP;EACH,CAPD;;EASA,MAAMC,UAAU,GAAID,KAAD,IAAgD;IAC/DxB,UAAU,CAAC,KAAD,CAAV;IACAzB,MAAM,SAAN,IAAAA,MAAM,WAAN,YAAAA,MAAM,CAAGiD,KAAH,CAAN;EACH,CAHD;;EAKA,MAAMxC,KAAK,GAAG,IAAA0C,WAAA,EAAI,CACd;IAAEC,OAAO,EAAEzD,QAAQ,GAAG,GAAH,GAAS;EAA5B,CADc,EAEde,SAFc,CAAJ,CAAd;;EAKA,MAAM2C,wBAAwB,GAAIJ,KAAD,IAA8B;IAC3DpB,cAAc,CAAC;MACXE,KAAK,EAAEkB,KAAK,CAACK,WAAN,CAAkBC,MAAlB,CAAyBxB,KADrB;MAEXC,MAAM,EAAEiB,KAAK,CAACK,WAAN,CAAkBC,MAAlB,CAAyBvB,MAFtB;MAGXF,QAAQ,EAAE;IAHC,CAAD,CAAd;EAKH,CAND;;EAQA,MAAM0B,UAAU,GAAG,MAAM;IAAA;;IACrB,sBAAA7C,QAAQ,CAACI,OAAT,0EAAkBD,KAAlB;EACH,CAFD;;EAIA,oBACI,6BAAC,0BAAD;IACI,aAAa,EAAES,aADnB;IAEI,aAAa,EAAEF,aAFnB;IAGI,QAAQ,EAAE1B,QAHd;IAII,KAAK,EAAEC,KAJX;IAKI,OAAO,EAAE4B,OALb;IAMI,UAAU,EAAEgC,UANhB;IAOI,IAAI,EAAE1D,IAPV;IAQI,YAAY,EAAED,YARlB;IASI,KAAK,EAAEE,KATX;IAUI,WAAW,EAAE6B,WAVjB;IAWI,OAAO,EAAEoB,WAXb;IAYI,MAAM,EAAEE,UAZZ;IAaI,YAAY,EAAEjD,YAblB;IAcI,WAAW,EAAEE,WAdjB;IAeI,oBAAoB,EAAEkD,wBAf1B;IAgBI,eAAe,EAAEjD,eAhBrB;IAiBI,WAAW,EAAEC,WAjBjB;IAkBI,GAAG,EAAEM,QAlBT;IAmBI,eAAe,EAAEJ,eAnBrB;IAoBI,KAAK,EAAEE,KApBX;IAqBI,KAAK,EAAED;EArBX,EADJ;AAyBH,CA7JiB,CAAlB;;eA+JelB,S"}

package/build/commonjs/TextField/TextFieldProps.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["TextFieldProps.ts"],"sourcesContent":["import React from 'react';\nimport { NativeSyntheticEvent, TargetedEvent } from 'react-native';\nimport { ComponentProps } from '../types';\n\ntype TextFieldKeyboardType = 'default' | 'numeric' | 'email-address';\n\nexport default interface TextFieldProps extends ComponentProps<{\n    /**\n     * If true, user won't be able to interact with the component.\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Whether to style the TextField with error style.\n     * @default false\n     */\n    error?: boolean,\n\n    /**\n     * It is an icon placed to the right of the TextField.\n     */\n    icon?: React.ReactElement;\n\n    /**\n     * User can specify the keyboard type.\n     * @default 'default'\n     */\n    keyboardType?: TextFieldKeyboardType;\n\n    /**\n     * The text to use for the floating label.\n     */\n    label?: string;\n\n    /**\n     * Callback that is called when the textField is blurred.\n     */\n    onBlur?: (event: NativeSyntheticEvent<TargetedEvent>) => void,\n\n    /**\n     * Callback that is called when the textField's text changes.\n     */\n    onChangeText?: (value: string) => void,\n\n    /**\n     * Callback that is called when the textField is focused.\n     */\n    onFocus?: (event: NativeSyntheticEvent<TargetedEvent>) => void,\n\n    /**\n     * Callback that is called when icon pressed.\n     */\n    onIconPress?: () => void;\n\n    /**\n     * Callback that is called when enter or submit key pressed.\n     */\n    onSubmitEditing?: () => void\n\n    /**\n     * Placeholder for textField.\n     */\n    placeholder?: string;\n\n    /**\n     * If true, the text input obscures the text entered so that sensitive text like passwords stay secure.\n     * @default false\n     */\n    secureTextEntry?: boolean;\n\n    /**\n     * Value of the textField.\n     */\n    value?: string;\n}> {}"],"mappings":""}
+{"version":3,"names":[],"sources":["TextFieldProps.ts"],"sourcesContent":["import React from 'react';\nimport { NativeSyntheticEvent, TargetedEvent } from 'react-native';\nimport { ComponentProps } from '../types';\n\ntype TextFieldKeyboardType = 'default' | 'numeric' | 'email-address';\n\nexport interface setStyleProp {\n    fontFamily: string;\n}\n\nexport default interface TextFieldProps extends ComponentProps<{\n    /**\n     * If true, user won't be able to interact with the component.\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Whether to style the TextField with error style.\n     * @default false\n     */\n    error?: boolean,\n\n    /**\n     * It is an icon placed to the right of the TextField.\n     */\n    icon?: React.ReactElement;\n\n    /**\n     * User can specify the keyboard type.\n     * @default 'default'\n     */\n    keyboardType?: TextFieldKeyboardType;\n\n    /**\n     * The text to use for the floating label.\n     */\n    label?: string;\n\n    /**\n     * Callback that is called when the textField is blurred.\n     */\n    onBlur?: (event: NativeSyntheticEvent<TargetedEvent>) => void,\n\n    /**\n     * Callback that is called when the textField's text changes.\n     */\n    onChangeText?: (value: string) => void,\n\n    /**\n     * Callback that is called when the textField is focused.\n     */\n    onFocus?: (event: NativeSyntheticEvent<TargetedEvent>) => void,\n\n    /**\n     * Callback that is called when icon pressed.\n     */\n    onIconPress?: () => void;\n\n    /**\n     * Callback that is called when enter or submit key pressed.\n     */\n    onSubmitEditing?: () => void\n\n    /**\n     * Placeholder for textField.\n     */\n    placeholder?: string;\n\n    /**\n     * If true, the text input obscures the text entered so that sensitive text like passwords stay secure.\n     * @default false\n     */\n    secureTextEntry?: boolean;\n\n    /**\n     * Value of the textField.\n     */\n    value?: string;\n}> {}"],"mappings":""}

package/build/commonjs/hooks/useCollapsibleAppBar.js

@@ -29,6 +29,7 @@ const defaultOptions = {
 const ANIMATION_CONFIG = {
   duration: 100
 };
+const TRANSPARENT = '#FFFFFF00';
 const SUPPORTS_DRAG_DETECTION = _reactNative.Platform.OS !== 'web';
 
 function useCollapsibleAppBar() {
@@ -56,8 +57,8 @@ function useCollapsibleAppBar() {
     }];
     return {
       transform,
-      borderColor: theme.palette.divider,
-      borderBottomWidth: dividerExposureMode === 'always' || overlapped.value ? _reactNative.StyleSheet.hairlineWidth : 0
+      borderColor: dividerExposureMode === 'always' || overlapped.value ? theme.palette.divider : TRANSPARENT,
+      borderWidth: _reactNative.StyleSheet.hairlineWidth
     };
   }, [theme, dividerExposureMode]);
   const indexRef = (0, _react.useRef)(0);

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

@@ -1 +1 @@
-{"version":3,"names":["defaultOptions","keyboardDismissMode","dividerExposureMode","supportsReverseScroll","ANIMATION_CONFIG","duration","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","theme","useTheme","animatedStyle","useAnimatedStyle","transform","value","borderColor","palette","divider","borderBottomWidth","StyleSheet","hairlineWidth","indexRef","useRef","offsetsRef","onScrollViewChanged","useCallback","nextIndex","prevIndex","current","savedOffsetY","withTiming","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","Keyboard","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","Math","min","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport {\n    Falsy,\n    Keyboard,\n    Platform,\n    RegisteredStyle,\n    ScrollViewProps,\n    StyleSheet,\n    ViewProps,\n    ViewStyle,\n} from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\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 { useTheme } from '@fountain-ui/styles';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    keyboardDismissMode?: 'none' | 'on-drag';\n    dividerExposureMode?: 'always' | 'overlapped';\n    supportsReverseScroll?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    dividerExposureMode: 'overlapped',\n    supportsReverseScroll: true,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, dividerExposureMode, supportsReverseScroll }: 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, [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 theme = useTheme();\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n            borderColor: theme.palette.divider,\n            borderBottomWidth: dividerExposureMode === 'always' || overlapped.value ? StyleSheet.hairlineWidth : 0,\n        };\n    }, [\n        theme,\n        dividerExposureMode,\n    ]);\n\n    const indexRef = useRef<number>(0);\n    const offsetsRef = useRef<Array<number>>([]);\n\n    const onScrollViewChanged = useCallback((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, ANIMATION_CONFIG);\n        }\n    }, [appBarHeight]);\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 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                const minOffsetY = -maxTy;\n                const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n                const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n                const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n                const dy = safeOffsetY - safeLastOffsetY;\n\n                const newTranslateY = supportsReverseScroll\n                    ? dy === 0\n                        ? lastTranslateY.value\n                        : dy > 0\n                            ? maxTy\n                            : 0\n                    : safeLastOffsetY === minOffsetY\n                        ? 0\n                        : maxTy;\n\n                translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n                lastTranslateY.value = newTranslateY;\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, ANIMATION_CONFIG);\n        },\n    }, [keyboardDismissMode, appBarHeight]);\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","dividerExposureMode","supportsReverseScroll","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","theme","useTheme","animatedStyle","useAnimatedStyle","transform","value","borderColor","palette","divider","borderWidth","StyleSheet","hairlineWidth","indexRef","useRef","offsetsRef","onScrollViewChanged","useCallback","nextIndex","prevIndex","current","savedOffsetY","withTiming","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","Keyboard","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","Math","min","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport {\n    Falsy,\n    Keyboard,\n    Platform,\n    RegisteredStyle,\n    ScrollViewProps,\n    StyleSheet,\n    ViewProps,\n    ViewStyle,\n} from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\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 { useTheme } from '@fountain-ui/styles';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    keyboardDismissMode?: 'none' | 'on-drag';\n    dividerExposureMode?: 'always' | 'overlapped';\n    supportsReverseScroll?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    dividerExposureMode: 'overlapped',\n    supportsReverseScroll: true,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, dividerExposureMode, supportsReverseScroll }: 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, [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 theme = useTheme();\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n            borderColor: dividerExposureMode === 'always' || overlapped.value ? theme.palette.divider : TRANSPARENT,\n            borderWidth: StyleSheet.hairlineWidth,\n        };\n    }, [\n        theme,\n        dividerExposureMode,\n    ]);\n\n    const indexRef = useRef<number>(0);\n    const offsetsRef = useRef<Array<number>>([]);\n\n    const onScrollViewChanged = useCallback((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, ANIMATION_CONFIG);\n        }\n    }, [appBarHeight]);\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 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                const minOffsetY = -maxTy;\n                const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n                const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n                const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n                const dy = safeOffsetY - safeLastOffsetY;\n\n                const newTranslateY = supportsReverseScroll\n                    ? dy === 0\n                        ? lastTranslateY.value\n                        : dy > 0\n                            ? maxTy\n                            : 0\n                    : safeLastOffsetY === minOffsetY\n                        ? 0\n                        : maxTy;\n\n                translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n                lastTranslateY.value = newTranslateY;\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, ANIMATION_CONFIG);\n        },\n    }, [keyboardDismissMode, appBarHeight]);\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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"}

package/build/module/TextField/TextField.js

@@ -1,4 +1,4 @@
-import React, { useEffect, useImperativeHandle, useRef } from 'react';
+import React, { useImperativeHandle, useRef } from 'react';
 import { Animated } from 'react-native';
 import { css } from '../styles';
 import { useAnimatedValue } from '../hooks';
@@ -42,6 +42,13 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(props, ref) {
       var _innerRef$current3;
 
       (_innerRef$current3 = innerRef.current) === null || _innerRef$current3 === void 0 ? void 0 : _innerRef$current3.blur();
+    },
+    setStyle: style => {
+      var _innerRef$current4;
+
+      (_innerRef$current4 = innerRef.current) === null || _innerRef$current4 === void 0 ? void 0 : _innerRef$current4.setNativeProps({
+        style
+      });
     }
   }));
   const animatedLabel = useAnimatedValue(value ? 0 : 1);
@@ -129,21 +136,11 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(props, ref) {
   };
 
   const forceFocus = () => {
-    var _innerRef$current4;
-
-    (_innerRef$current4 = innerRef.current) === null || _innerRef$current4 === void 0 ? void 0 : _innerRef$current4.focus();
-  }; // react-native TextInput font family issue at android
-
-
-  useEffect(() => {
     var _innerRef$current5;
 
-    (_innerRef$current5 = innerRef.current) === null || _innerRef$current5 === void 0 ? void 0 : _innerRef$current5.setNativeProps({
-      style: {
-        fontFamily: 'Inter-Regular'
-      }
-    });
-  }, []);
+    (_innerRef$current5 = innerRef.current) === null || _innerRef$current5 === void 0 ? void 0 : _innerRef$current5.focus();
+  };
+
   return /*#__PURE__*/React.createElement(OutlinedTextField, {
     animatedError: animatedError,
     animatedLabel: animatedLabel,

package/build/module/TextField/TextField.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useImperativeHandle","useRef","Animated","css","useAnimatedValue","OutlinedTextField","blurAnimationDuration","focusAnimationDuration","TextField","forwardRef","props","ref","disabled","error","keyboardType","icon","label","onBlur","onChangeText","onFocus","onIconPress","onSubmitEditing","placeholder","placeholderProp","secureTextEntry","value","style","styleProp","innerRef","focus","current","isFocused","clear","blur","animatedLabel","animatedError","focused","setFocused","useState","setPlaceholder","labelLayout","setLabelLayout","measured","width","height","minimizeLabel","timing","toValue","duration","useNativeDriver","start","restoreLabel","showError","hideError","showPlaceholder","hidePlaceholder","handleFocus","event","handleBlur","opacity","handleLayoutAnimatedText","nativeEvent","layout","forceFocus","setNativeProps","fontFamily"],"sources":["TextField.tsx"],"sourcesContent":["import React, { useEffect, useImperativeHandle, useRef } from 'react';\nimport { Animated, LayoutChangeEvent, NativeSyntheticEvent, TargetedEvent, TextInput } from 'react-native';\nimport { css } from '../styles';\nimport { useAnimatedValue } from '../hooks';\nimport OutlinedTextField from './OutlinedTextField';\nimport TextFieldProps from './TextFieldProps';\nimport { blurAnimationDuration, focusAnimationDuration } from './utils';\n\nconst TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {\n    const {\n        disabled = false,\n        error = false,\n        keyboardType = 'default',\n        icon,\n        label,\n        onBlur,\n        onChangeText,\n        onFocus,\n        onIconPress,\n        onSubmitEditing,\n        placeholder: placeholderProp,\n        secureTextEntry = false,\n        value,\n        style: styleProp,\n    } = props;\n\n    const innerRef = useRef<TextInput | null>(null);\n    //@ts-ignore\n    useImperativeHandle(ref, () => ({\n        focus: () => {\n            innerRef.current?.focus();\n        },\n        isFocused: () => {\n            const current = innerRef.current;\n            return current ? current.isFocused() : false;\n        },\n        clear: () => {\n            innerRef.current?.clear();\n        },\n        blur: () => {\n            innerRef.current?.blur();\n        },\n    }));\n\n    const animatedLabel = useAnimatedValue(value ? 0 : 1);\n    const animatedError = useAnimatedValue(error ? 1 : 0);\n    const [focused, setFocused] = React.useState(false);\n    const [placeholder, setPlaceholder] = React.useState('');\n    const [labelLayout, setLabelLayout] = React.useState({\n        measured: false,\n        width: 0,\n        height: 0,\n    });\n\n    const minimizeLabel = () => {\n        Animated.timing(animatedLabel, {\n            toValue: 0,\n            duration: blurAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const restoreLabel = () => {\n        Animated.timing(animatedLabel, {\n            toValue: 1,\n            duration: focusAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const showError = () => {\n        Animated.timing(animatedError, {\n            toValue: 1,\n            duration: focusAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const hideError = () => {\n        Animated.timing(animatedError, {\n            toValue: 0,\n            duration: blurAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const showPlaceholder = () => {\n        placeholderProp && setPlaceholder(placeholderProp);\n    };\n\n    const hidePlaceholder = () => setPlaceholder('');\n\n    React.useEffect(() => {\n        value || focused ? minimizeLabel() : restoreLabel();\n    }, [focused, value, labelLayout]);\n\n    React.useEffect(() => {\n        animatedError ? showError() : hideError();\n    }, [animatedError]);\n\n    React.useEffect(() => {\n        focused || !label ? showPlaceholder() : hidePlaceholder();\n    }, [focused, label]);\n\n    const handleFocus = (event: NativeSyntheticEvent<TargetedEvent>) => {\n        if (disabled) {\n            return;\n        }\n\n        setFocused(true);\n        onFocus?.(event);\n    };\n\n    const handleBlur = (event: NativeSyntheticEvent<TargetedEvent>) => {\n        setFocused(false);\n        onBlur?.(event);\n    };\n\n    const style = css([\n        { opacity: disabled ? 0.3 : 1 },\n        styleProp,\n    ]);\n\n    const handleLayoutAnimatedText = (event: LayoutChangeEvent) => {\n        setLabelLayout({\n            width: event.nativeEvent.layout.width,\n            height: event.nativeEvent.layout.height,\n            measured: true,\n        });\n    };\n\n    const forceFocus = () => {\n        innerRef.current?.focus();\n    };\n\n    // react-native TextInput font family issue at android\n    useEffect(() => {\n        innerRef.current?.setNativeProps({\n            style: { fontFamily: 'Inter-Regular' },\n        });\n    }, []);\n\n    return (\n        <OutlinedTextField\n            animatedError={animatedError}\n            animatedLabel={animatedLabel}\n            disabled={disabled}\n            error={error}\n            focused={focused}\n            forceFocus={forceFocus}\n            icon={icon}\n            keyboardType={keyboardType}\n            label={label}\n            labelLayout={labelLayout}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n            onChangeText={onChangeText}\n            onIconPress={onIconPress}\n            onLayoutAnimatedText={handleLayoutAnimatedText}\n            onSubmitEditing={onSubmitEditing}\n            placeholder={placeholder}\n            ref={innerRef}\n            secureTextEntry={secureTextEntry}\n            style={style}\n            value={value}\n        />\n    );\n});\n\nexport default TextField;\n"],"mappings":"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"}
+{"version":3,"names":["React","useImperativeHandle","useRef","Animated","css","useAnimatedValue","OutlinedTextField","blurAnimationDuration","focusAnimationDuration","TextField","forwardRef","props","ref","disabled","error","keyboardType","icon","label","onBlur","onChangeText","onFocus","onIconPress","onSubmitEditing","placeholder","placeholderProp","secureTextEntry","value","style","styleProp","innerRef","focus","current","isFocused","clear","blur","setStyle","setNativeProps","animatedLabel","animatedError","focused","setFocused","useState","setPlaceholder","labelLayout","setLabelLayout","measured","width","height","minimizeLabel","timing","toValue","duration","useNativeDriver","start","restoreLabel","showError","hideError","showPlaceholder","hidePlaceholder","useEffect","handleFocus","event","handleBlur","opacity","handleLayoutAnimatedText","nativeEvent","layout","forceFocus"],"sources":["TextField.tsx"],"sourcesContent":["import React, { useImperativeHandle, useRef } from 'react';\nimport { Animated, LayoutChangeEvent, NativeSyntheticEvent, TargetedEvent, TextInput } from 'react-native';\nimport { css } from '../styles';\nimport { useAnimatedValue } from '../hooks';\nimport OutlinedTextField from './OutlinedTextField';\nimport TextFieldProps, { setStyleProp } from './TextFieldProps';\nimport { blurAnimationDuration, focusAnimationDuration } from './utils';\n\nconst TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {\n    const {\n        disabled = false,\n        error = false,\n        keyboardType = 'default',\n        icon,\n        label,\n        onBlur,\n        onChangeText,\n        onFocus,\n        onIconPress,\n        onSubmitEditing,\n        placeholder: placeholderProp,\n        secureTextEntry = false,\n        value,\n        style: styleProp,\n    } = props;\n\n    const innerRef = useRef<TextInput | null>(null);\n    //@ts-ignore\n    useImperativeHandle(ref, () => ({\n        focus: () => {\n            innerRef.current?.focus();\n        },\n        isFocused: () => {\n            const current = innerRef.current;\n            return current ? current.isFocused() : false;\n        },\n        clear: () => {\n            innerRef.current?.clear();\n        },\n        blur: () => {\n            innerRef.current?.blur();\n        },\n        setStyle: (style: setStyleProp) => {\n            innerRef.current?.setNativeProps({\n                style,\n            });\n        },\n    }));\n\n    const animatedLabel = useAnimatedValue(value ? 0 : 1);\n    const animatedError = useAnimatedValue(error ? 1 : 0);\n    const [focused, setFocused] = React.useState(false);\n    const [placeholder, setPlaceholder] = React.useState('');\n    const [labelLayout, setLabelLayout] = React.useState({\n        measured: false,\n        width: 0,\n        height: 0,\n    });\n\n    const minimizeLabel = () => {\n        Animated.timing(animatedLabel, {\n            toValue: 0,\n            duration: blurAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const restoreLabel = () => {\n        Animated.timing(animatedLabel, {\n            toValue: 1,\n            duration: focusAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const showError = () => {\n        Animated.timing(animatedError, {\n            toValue: 1,\n            duration: focusAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const hideError = () => {\n        Animated.timing(animatedError, {\n            toValue: 0,\n            duration: blurAnimationDuration,\n            useNativeDriver: false,\n        }).start();\n    };\n\n    const showPlaceholder = () => {\n        placeholderProp && setPlaceholder(placeholderProp);\n    };\n\n    const hidePlaceholder = () => setPlaceholder('');\n\n    React.useEffect(() => {\n        value || focused ? minimizeLabel() : restoreLabel();\n    }, [focused, value, labelLayout]);\n\n    React.useEffect(() => {\n        animatedError ? showError() : hideError();\n    }, [animatedError]);\n\n    React.useEffect(() => {\n        focused || !label ? showPlaceholder() : hidePlaceholder();\n    }, [focused, label]);\n\n    const handleFocus = (event: NativeSyntheticEvent<TargetedEvent>) => {\n        if (disabled) {\n            return;\n        }\n\n        setFocused(true);\n        onFocus?.(event);\n    };\n\n    const handleBlur = (event: NativeSyntheticEvent<TargetedEvent>) => {\n        setFocused(false);\n        onBlur?.(event);\n    };\n\n    const style = css([\n        { opacity: disabled ? 0.3 : 1 },\n        styleProp,\n    ]);\n\n    const handleLayoutAnimatedText = (event: LayoutChangeEvent) => {\n        setLabelLayout({\n            width: event.nativeEvent.layout.width,\n            height: event.nativeEvent.layout.height,\n            measured: true,\n        });\n    };\n\n    const forceFocus = () => {\n        innerRef.current?.focus();\n    };\n\n    return (\n        <OutlinedTextField\n            animatedError={animatedError}\n            animatedLabel={animatedLabel}\n            disabled={disabled}\n            error={error}\n            focused={focused}\n            forceFocus={forceFocus}\n            icon={icon}\n            keyboardType={keyboardType}\n            label={label}\n            labelLayout={labelLayout}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n            onChangeText={onChangeText}\n            onIconPress={onIconPress}\n            onLayoutAnimatedText={handleLayoutAnimatedText}\n            onSubmitEditing={onSubmitEditing}\n            placeholder={placeholder}\n            ref={innerRef}\n            secureTextEntry={secureTextEntry}\n            style={style}\n            value={value}\n        />\n    );\n});\n\nexport default TextField;\n"],"mappings":"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"}

package/build/module/TextField/TextFieldProps.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["TextFieldProps.ts"],"sourcesContent":["import React from 'react';\nimport { NativeSyntheticEvent, TargetedEvent } from 'react-native';\nimport { ComponentProps } from '../types';\n\ntype TextFieldKeyboardType = 'default' | 'numeric' | 'email-address';\n\nexport default interface TextFieldProps extends ComponentProps<{\n    /**\n     * If true, user won't be able to interact with the component.\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Whether to style the TextField with error style.\n     * @default false\n     */\n    error?: boolean,\n\n    /**\n     * It is an icon placed to the right of the TextField.\n     */\n    icon?: React.ReactElement;\n\n    /**\n     * User can specify the keyboard type.\n     * @default 'default'\n     */\n    keyboardType?: TextFieldKeyboardType;\n\n    /**\n     * The text to use for the floating label.\n     */\n    label?: string;\n\n    /**\n     * Callback that is called when the textField is blurred.\n     */\n    onBlur?: (event: NativeSyntheticEvent<TargetedEvent>) => void,\n\n    /**\n     * Callback that is called when the textField's text changes.\n     */\n    onChangeText?: (value: string) => void,\n\n    /**\n     * Callback that is called when the textField is focused.\n     */\n    onFocus?: (event: NativeSyntheticEvent<TargetedEvent>) => void,\n\n    /**\n     * Callback that is called when icon pressed.\n     */\n    onIconPress?: () => void;\n\n    /**\n     * Callback that is called when enter or submit key pressed.\n     */\n    onSubmitEditing?: () => void\n\n    /**\n     * Placeholder for textField.\n     */\n    placeholder?: string;\n\n    /**\n     * If true, the text input obscures the text entered so that sensitive text like passwords stay secure.\n     * @default false\n     */\n    secureTextEntry?: boolean;\n\n    /**\n     * Value of the textField.\n     */\n    value?: string;\n}> {}"],"mappings":""}
+{"version":3,"names":[],"sources":["TextFieldProps.ts"],"sourcesContent":["import React from 'react';\nimport { NativeSyntheticEvent, TargetedEvent } from 'react-native';\nimport { ComponentProps } from '../types';\n\ntype TextFieldKeyboardType = 'default' | 'numeric' | 'email-address';\n\nexport interface setStyleProp {\n    fontFamily: string;\n}\n\nexport default interface TextFieldProps extends ComponentProps<{\n    /**\n     * If true, user won't be able to interact with the component.\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Whether to style the TextField with error style.\n     * @default false\n     */\n    error?: boolean,\n\n    /**\n     * It is an icon placed to the right of the TextField.\n     */\n    icon?: React.ReactElement;\n\n    /**\n     * User can specify the keyboard type.\n     * @default 'default'\n     */\n    keyboardType?: TextFieldKeyboardType;\n\n    /**\n     * The text to use for the floating label.\n     */\n    label?: string;\n\n    /**\n     * Callback that is called when the textField is blurred.\n     */\n    onBlur?: (event: NativeSyntheticEvent<TargetedEvent>) => void,\n\n    /**\n     * Callback that is called when the textField's text changes.\n     */\n    onChangeText?: (value: string) => void,\n\n    /**\n     * Callback that is called when the textField is focused.\n     */\n    onFocus?: (event: NativeSyntheticEvent<TargetedEvent>) => void,\n\n    /**\n     * Callback that is called when icon pressed.\n     */\n    onIconPress?: () => void;\n\n    /**\n     * Callback that is called when enter or submit key pressed.\n     */\n    onSubmitEditing?: () => void\n\n    /**\n     * Placeholder for textField.\n     */\n    placeholder?: string;\n\n    /**\n     * If true, the text input obscures the text entered so that sensitive text like passwords stay secure.\n     * @default false\n     */\n    secureTextEntry?: boolean;\n\n    /**\n     * Value of the textField.\n     */\n    value?: string;\n}> {}"],"mappings":""}

package/build/module/hooks/useCollapsibleAppBar.js

@@ -13,6 +13,7 @@ const defaultOptions = {
 const ANIMATION_CONFIG = {
   duration: 100
 };
+const TRANSPARENT = '#FFFFFF00';
 const SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';
 export default function useCollapsibleAppBar() {
   let userOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultOptions;
@@ -39,8 +40,8 @@ export default function useCollapsibleAppBar() {
     }];
     return {
       transform,
-      borderColor: theme.palette.divider,
-      borderBottomWidth: dividerExposureMode === 'always' || overlapped.value ? StyleSheet.hairlineWidth : 0
+      borderColor: dividerExposureMode === 'always' || overlapped.value ? theme.palette.divider : TRANSPARENT,
+      borderWidth: StyleSheet.hairlineWidth
     };
   }, [theme, dividerExposureMode]);
   const indexRef = useRef(0);

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

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useRef","Keyboard","Platform","StyleSheet","runOnJS","useAnimatedScrollHandler","useAnimatedStyle","useDerivedValue","useSharedValue","withTiming","useSafeAreaInsets","useTheme","useHeight","useAppbarStyles","defaultOptions","keyboardDismissMode","dividerExposureMode","supportsReverseScroll","ANIMATION_CONFIG","duration","SUPPORTS_DRAG_DETECTION","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","translateY","lastTranslateY","lastOffsetY","overlapped","theme","animatedStyle","transform","value","borderColor","palette","divider","borderBottomWidth","hairlineWidth","indexRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","scrollHandler","onBeginDrag","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","Math","min","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport {\n    Falsy,\n    Keyboard,\n    Platform,\n    RegisteredStyle,\n    ScrollViewProps,\n    StyleSheet,\n    ViewProps,\n    ViewStyle,\n} from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\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 { useTheme } from '@fountain-ui/styles';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    keyboardDismissMode?: 'none' | 'on-drag';\n    dividerExposureMode?: 'always' | 'overlapped';\n    supportsReverseScroll?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    dividerExposureMode: 'overlapped',\n    supportsReverseScroll: true,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, dividerExposureMode, supportsReverseScroll }: 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, [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 theme = useTheme();\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n            borderColor: theme.palette.divider,\n            borderBottomWidth: dividerExposureMode === 'always' || overlapped.value ? StyleSheet.hairlineWidth : 0,\n        };\n    }, [\n        theme,\n        dividerExposureMode,\n    ]);\n\n    const indexRef = useRef<number>(0);\n    const offsetsRef = useRef<Array<number>>([]);\n\n    const onScrollViewChanged = useCallback((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, ANIMATION_CONFIG);\n        }\n    }, [appBarHeight]);\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 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                const minOffsetY = -maxTy;\n                const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n                const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n                const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n                const dy = safeOffsetY - safeLastOffsetY;\n\n                const newTranslateY = supportsReverseScroll\n                    ? dy === 0\n                        ? lastTranslateY.value\n                        : dy > 0\n                            ? maxTy\n                            : 0\n                    : safeLastOffsetY === minOffsetY\n                        ? 0\n                        : maxTy;\n\n                translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n                lastTranslateY.value = newTranslateY;\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, ANIMATION_CONFIG);\n        },\n    }, [keyboardDismissMode, appBarHeight]);\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":["useCallback","useRef","Keyboard","Platform","StyleSheet","runOnJS","useAnimatedScrollHandler","useAnimatedStyle","useDerivedValue","useSharedValue","withTiming","useSafeAreaInsets","useTheme","useHeight","useAppbarStyles","defaultOptions","keyboardDismissMode","dividerExposureMode","supportsReverseScroll","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","translateY","lastTranslateY","lastOffsetY","overlapped","theme","animatedStyle","transform","value","borderColor","palette","divider","borderWidth","hairlineWidth","indexRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","scrollHandler","onBeginDrag","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","Math","min","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport {\n    Falsy,\n    Keyboard,\n    Platform,\n    RegisteredStyle,\n    ScrollViewProps,\n    StyleSheet,\n    ViewProps,\n    ViewStyle,\n} from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\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 { useTheme } from '@fountain-ui/styles';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n    top?: number;\n    bottom?: number;\n    left?: number;\n    right?: number;\n}\n\nexport interface Options {\n    keyboardDismissMode?: 'none' | 'on-drag';\n    dividerExposureMode?: 'always' | 'overlapped';\n    supportsReverseScroll?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n    appBarStyle: ViewStyleProp;\n    onAppBarLayout: OnLayoutCallback;\n    onCollapsibleToolbarLayout: OnLayoutCallback;\n    onScroll: OnScroll;\n    onScrollViewChanged: (index: number) => void;\n    scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    dividerExposureMode: 'overlapped',\n    supportsReverseScroll: true,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, dividerExposureMode, supportsReverseScroll }: 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, [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 theme = useTheme();\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n            borderColor: dividerExposureMode === 'always' || overlapped.value ? theme.palette.divider : TRANSPARENT,\n            borderWidth: StyleSheet.hairlineWidth,\n        };\n    }, [\n        theme,\n        dividerExposureMode,\n    ]);\n\n    const indexRef = useRef<number>(0);\n    const offsetsRef = useRef<Array<number>>([]);\n\n    const onScrollViewChanged = useCallback((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, ANIMATION_CONFIG);\n        }\n    }, [appBarHeight]);\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 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                const minOffsetY = -maxTy;\n                const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n                const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n                const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n                const dy = safeOffsetY - safeLastOffsetY;\n\n                const newTranslateY = supportsReverseScroll\n                    ? dy === 0\n                        ? lastTranslateY.value\n                        : dy > 0\n                            ? maxTy\n                            : 0\n                    : safeLastOffsetY === minOffsetY\n                        ? 0\n                        : maxTy;\n\n                translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n                lastTranslateY.value = newTranslateY;\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, ANIMATION_CONFIG);\n        },\n    }, [keyboardDismissMode, appBarHeight]);\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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"}

package/build/typescript/TextField/TextFieldProps.d.ts

@@ -2,6 +2,9 @@ import React from 'react';
 import { NativeSyntheticEvent, TargetedEvent } from 'react-native';
 import { ComponentProps } from '../types';
 declare type TextFieldKeyboardType = 'default' | 'numeric' | 'email-address';
+export interface setStyleProp {
+    fontFamily: string;
+}
 export default interface TextFieldProps extends ComponentProps<{
     /**
      * If true, user won't be able to interact with the component.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fountain-ui/core",
-  "version": "2.0.0-beta.53",
+  "version": "2.0.0-beta.55",
   "author": "Fountain-UI Team",
   "description": "React components that implement Tappytoon's Fountain Design.",
   "license": "MIT",
@@ -67,5 +67,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "dff14bb159b46ca2c19473bd7d252d2aaa64040c"
+  "gitHead": "4f46471866fc14a97a6e5c9e89273dc48fe37f2f"
 }

package/src/TextField/TextField.tsx

@@ -1,9 +1,9 @@
-import React, { useEffect, useImperativeHandle, useRef } from 'react';
+import React, { useImperativeHandle, useRef } from 'react';
 import { Animated, LayoutChangeEvent, NativeSyntheticEvent, TargetedEvent, TextInput } from 'react-native';
 import { css } from '../styles';
 import { useAnimatedValue } from '../hooks';
 import OutlinedTextField from './OutlinedTextField';
-import TextFieldProps from './TextFieldProps';
+import TextFieldProps, { setStyleProp } from './TextFieldProps';
 import { blurAnimationDuration, focusAnimationDuration } from './utils';
 
 const TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {
@@ -40,6 +40,11 @@ const TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField
         blur: () => {
             innerRef.current?.blur();
         },
+        setStyle: (style: setStyleProp) => {
+            innerRef.current?.setNativeProps({
+                style,
+            });
+        },
     }));
 
     const animatedLabel = useAnimatedValue(value ? 0 : 1);
@@ -133,13 +138,6 @@ const TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField
         innerRef.current?.focus();
     };
 
-    // react-native TextInput font family issue at android
-    useEffect(() => {
-        innerRef.current?.setNativeProps({
-            style: { fontFamily: 'Inter-Regular' },
-        });
-    }, []);
-
     return (
         <OutlinedTextField
             animatedError={animatedError}

package/src/TextField/TextFieldProps.ts

@@ -4,6 +4,10 @@ import { ComponentProps } from '../types';
 
 type TextFieldKeyboardType = 'default' | 'numeric' | 'email-address';
 
+export interface setStyleProp {
+    fontFamily: string;
+}
+
 export default interface TextFieldProps extends ComponentProps<{
     /**
      * If true, user won't be able to interact with the component.

package/src/hooks/useCollapsibleAppBar.ts

@@ -60,6 +60,7 @@ const defaultOptions: Required<Options> = {
 };
 
 const ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };
+const TRANSPARENT = '#FFFFFF00';
 
 const SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';
 
@@ -90,8 +91,8 @@ export default function useCollapsibleAppBar(userOptions: Options = defaultOptio
 
         return {
             transform,
-            borderColor: theme.palette.divider,
-            borderBottomWidth: dividerExposureMode === 'always' || overlapped.value ? StyleSheet.hairlineWidth : 0,
+            borderColor: dividerExposureMode === 'always' || overlapped.value ? theme.palette.divider : TRANSPARENT,
+            borderWidth: StyleSheet.hairlineWidth,
         };
     }, [
         theme,