@fountain-ui/core 2.0.0-beta.5 → 2.0.0-beta.50

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

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

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
+{"version":3,"names":[],"sources":["TabsProps.ts"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport type { ViewProps } from 'react-native';\nimport type { TabIndicatorColor } from './TabIndicatorProps';\nimport type { TabVariant } from '../Tab';\nimport type { OverridableComponentProps, SyncAnimatedValue } from '../types';\nimport type { KeyboardDismissMode, KeyboardShouldPersistTaps, TabsInstance } from './types';\n\nexport default interface TabsProps extends OverridableComponentProps<ViewProps, {\n    ref?: Ref<TabsInstance>;\n\n    /**\n     * Collection of Tab components.\n     */\n    children: ReactNode;\n\n    /**\n     * If `true`, the indicator is disabled.\n     * @default false\n     */\n    disableIndicator?: boolean;\n\n    /**\n     * The color of tab indicator\n     * @default 'primary'\n     */\n    indicatorColor?: TabIndicatorColor;\n\n    /**\n     * Index of initial tab that should be selected.\n     * @default 0\n     */\n    initialIndex?: number;\n\n    /**\n     * keyboard dismissing condition of dragging.\n     * @default 'none'\n     */\n    keyboardDismissMode?: KeyboardDismissMode,\n\n    /**\n     * keyboard persisting condition of tapping.\n     * @default 'never'\n     */\n    keyboardShouldPersistTaps?: KeyboardShouldPersistTaps,\n\n    /**\n     * Callback fired when a tab is selected.\n     */\n    onChange?: (newIndex: number) => void;\n\n    /**\n     * If `true`, the component will be able to scroll.\n     * @default false\n     */\n    scrollable?: boolean;\n\n    /**\n     * Unstable API.\n     */\n    UNSTABLE_sharedIndex?: SyncAnimatedValue;\n\n    /**\n     * The variant to use.\n     * @default 'primary'\n     */\n    variant?: TabVariant;\n}> {}\n"],"mappings":""}

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA","sourcesContent":["export { default } from './Tabs';\nexport type { default as TabsProps } from './TabsProps';"]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './Tabs';\nexport type { default as TabsProps } from './TabsProps';\nexport type { TabsInstance } from './types';\n"],"mappings":";;;;;;;;;;;;AAAA"}

package/build/commonjs/Tabs/types.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["export type KeyboardDismissMode =\n    'none'\n    | 'on-drag'\n    | 'interactive'; // ios only\n\nexport type KeyboardShouldPersistTaps =\n    'never'\n    | boolean\n    | 'always'\n    | 'handled'; // app only\n\nexport interface TabsInstance {\n    /**\n     * Function to scroll to a specific tab. Invalid index is ignored.\n     * @param index\n     */\n    setTab: (index: number) => void;\n}\n"],"mappings":""}

package/build/commonjs/Tabs/useIndexStore.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useIndexStore;
+
+var _react = require("react");
+
+var _store = require("../store");
+
+function useIndexStore(value) {
+  const {
+    animatedValue,
+    initialValue
+  } = value;
+  const store = (0, _react.useRef)(new _store.SimpleStore(initialValue)).current;
+  (0, _react.useEffect)(() => {
+    const id = animatedValue.addListener(newIndex => {
+      store.dispatch(newIndex.value);
+    });
+    return () => {
+      animatedValue.removeListener(id);
+    };
+  }, [animatedValue]);
+  (0, _react.useEffect)(() => {
+    return () => {
+      store.removeAllListeners();
+    };
+  }, [store]);
+  return store;
+}
+
+;
+//# sourceMappingURL=useIndexStore.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["useIndexStore","value","animatedValue","initialValue","store","useRef","SimpleStore","current","useEffect","id","addListener","newIndex","dispatch","removeListener","removeAllListeners"],"sources":["useIndexStore.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { MonoStore } from '../store';\nimport { SimpleStore } from '../store';\nimport type { SyncAnimatedValue } from '../types';\n\nexport default function useIndexStore(value: SyncAnimatedValue): MonoStore<number> {\n    const {\n        animatedValue,\n        initialValue,\n    } = value;\n\n    const store = useRef(new SimpleStore(initialValue)).current;\n\n    useEffect(() => {\n        const id = animatedValue.addListener((newIndex) => {\n            store.dispatch(newIndex.value);\n        });\n\n        return () => {\n            animatedValue.removeListener(id);\n        };\n    }, [animatedValue]);\n\n    useEffect(() => {\n        return () => {\n            store.removeAllListeners();\n        };\n    }, [store]);\n\n    return store;\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAGe,SAASA,aAAT,CAAuBC,KAAvB,EAAoE;EAC/E,MAAM;IACFC,aADE;IAEFC;EAFE,IAGFF,KAHJ;EAKA,MAAMG,KAAK,GAAG,IAAAC,aAAA,EAAO,IAAIC,kBAAJ,CAAgBH,YAAhB,CAAP,EAAsCI,OAApD;EAEA,IAAAC,gBAAA,EAAU,MAAM;IACZ,MAAMC,EAAE,GAAGP,aAAa,CAACQ,WAAd,CAA2BC,QAAD,IAAc;MAC/CP,KAAK,CAACQ,QAAN,CAAeD,QAAQ,CAACV,KAAxB;IACH,CAFU,CAAX;IAIA,OAAO,MAAM;MACTC,aAAa,CAACW,cAAd,CAA6BJ,EAA7B;IACH,CAFD;EAGH,CARD,EAQG,CAACP,aAAD,CARH;EAUA,IAAAM,gBAAA,EAAU,MAAM;IACZ,OAAO,MAAM;MACTJ,KAAK,CAACU,kBAAN;IACH,CAFD;EAGH,CAJD,EAIG,CAACV,KAAD,CAJH;EAMA,OAAOA,KAAP;AACH;;AAAA"}

package/build/commonjs/Tabs/useScrollViewReaction.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useScrollViewReaction;
+
+var _react = require("react");
+
+var _InternalContext = _interopRequireDefault(require("./InternalContext"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function useScrollViewReaction(initialIndex, coordinates) {
+  const scrollViewRef = (0, _react.useRef)(null);
+  const lastScrolledXRef = (0, _react.useRef)(NaN);
+  const {
+    indexStore
+  } = (0, _react.useContext)(_InternalContext.default);
+
+  const scrollToX = x => {
+    if (Number.isFinite(x)) {
+      var _scrollViewRef$curren;
+
+      (_scrollViewRef$curren = scrollViewRef.current) === null || _scrollViewRef$curren === void 0 ? void 0 : _scrollViewRef$curren.scrollTo({
+        x,
+        y: 0,
+        animated: true
+      });
+      lastScrolledXRef.current = x;
+    }
+  };
+
+  const onLayout = (0, _react.useCallback)(() => {
+    scrollToX(lastScrolledXRef.current);
+  }, []);
+  const computeNextScrollX = (0, _react.useCallback)(index => {
+    const prevIndex = index - 1;
+    const prevCoordinate = coordinates[prevIndex];
+
+    if (prevCoordinate) {
+      const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
+      return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
+    }
+
+    return 0;
+  }, [coordinates]);
+  (0, _react.useEffect)(() => {
+    if (Number.isNaN(lastScrolledXRef.current)) {
+      const x = computeNextScrollX(initialIndex);
+
+      if (x > 0) {
+        scrollToX(x);
+      }
+    }
+  }, [initialIndex, computeNextScrollX]);
+  (0, _react.useEffect)(() => {
+    return indexStore.subscribe(currentIndex => {
+      scrollToX(computeNextScrollX(currentIndex));
+    });
+  }, [indexStore, computeNextScrollX]);
+  return {
+    scrollViewRef,
+    onLayout
+  };
+}
+
+;
+//# sourceMappingURL=useScrollViewReaction.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["useScrollViewReaction","initialIndex","coordinates","scrollViewRef","useRef","lastScrolledXRef","NaN","indexStore","useContext","InternalContext","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","useCallback","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","useEffect","isNaN","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n    scrollViewRef: MutableRefObject<ScrollView | null>;\n    onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n    initialIndex: number,\n    coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n    const scrollViewRef = useRef<ScrollView | null>(null);\n\n    const lastScrolledXRef = useRef<number>(NaN);\n\n    const { indexStore } = useContext(InternalContext);\n\n    const scrollToX = (x: number) => {\n        if (Number.isFinite(x)) {\n            scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n            lastScrolledXRef.current = x;\n        }\n    };\n\n    const onLayout = useCallback(() => {\n        scrollToX(lastScrolledXRef.current);\n    }, []);\n\n    const computeNextScrollX = useCallback((index: number): number => {\n        const prevIndex = index - 1;\n        const prevCoordinate = coordinates[prevIndex];\n\n        if (prevCoordinate) {\n            const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n            return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n        }\n\n        return 0;\n    }, [coordinates]);\n\n    useEffect(() => {\n        if (Number.isNaN(lastScrolledXRef.current)) {\n            const x = computeNextScrollX(initialIndex);\n            if (x > 0) {\n                scrollToX(x);\n            }\n        }\n    }, [initialIndex, computeNextScrollX]);\n\n    useEffect(() => {\n        return indexStore.subscribe(currentIndex => {\n            scrollToX(computeNextScrollX(currentIndex));\n        });\n    }, [indexStore, computeNextScrollX]);\n\n    return { scrollViewRef, onLayout };\n};\n"],"mappings":";;;;;;;AACA;;AAGA;;;;AAOe,SAASA,qBAAT,CACXC,YADW,EAEXC,WAFW,EAGU;EACrB,MAAMC,aAAa,GAAG,IAAAC,aAAA,EAA0B,IAA1B,CAAtB;EAEA,MAAMC,gBAAgB,GAAG,IAAAD,aAAA,EAAeE,GAAf,CAAzB;EAEA,MAAM;IAAEC;EAAF,IAAiB,IAAAC,iBAAA,EAAWC,wBAAX,CAAvB;;EAEA,MAAMC,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAR,aAAa,CAACW,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAZ,gBAAgB,CAACS,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAG,IAAAC,kBAAA,EAAY,MAAM;IAC/BT,SAAS,CAACL,gBAAgB,CAACS,OAAlB,CAAT;EACH,CAFgB,EAEd,EAFc,CAAjB;EAIA,MAAMM,kBAAkB,GAAG,IAAAD,kBAAA,EAAaE,KAAD,IAA2B;IAC9D,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;IACA,MAAME,cAAc,GAAGrB,WAAW,CAACoB,SAAD,CAAlC;;IAEA,IAAIC,cAAJ,EAAoB;MAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;MACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;IACH;;IAED,OAAO,CAAP;EACH,CAV0B,EAUxB,CAACtB,WAAD,CAVwB,CAA3B;EAYA,IAAA2B,gBAAA,EAAU,MAAM;IACZ,IAAIjB,MAAM,CAACkB,KAAP,CAAazB,gBAAgB,CAACS,OAA9B,CAAJ,EAA4C;MACxC,MAAMH,CAAC,GAAGS,kBAAkB,CAACnB,YAAD,CAA5B;;MACA,IAAIU,CAAC,GAAG,CAAR,EAAW;QACPD,SAAS,CAACC,CAAD,CAAT;MACH;IACJ;EACJ,CAPD,EAOG,CAACV,YAAD,EAAemB,kBAAf,CAPH;EASA,IAAAS,gBAAA,EAAU,MAAM;IACZ,OAAOtB,UAAU,CAACwB,SAAX,CAAqBC,YAAY,IAAI;MACxCtB,SAAS,CAACU,kBAAkB,CAACY,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAJD,EAIG,CAACzB,UAAD,EAAaa,kBAAb,CAJH;EAMA,OAAO;IAAEjB,aAAF;IAAiBe;EAAjB,CAAP;AACH;;AAAA"}

package/build/commonjs/Tabs/useTabCoordinates.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useTabCoordinates;
+
+var _react = require("react");
+
+var _utils = require("./utils");
+
+function useTabCoordinates(tabElements) {
+  const [coordinates, setCoordinates] = (0, _react.useState)([]);
+  const cacheRef = (0, _react.useRef)([]);
+
+  const updateCoordinate = (index, x, width) => {
+    cacheRef.current[index] = {
+      x1: x,
+      x2: x + width
+    };
+
+    if ((0, _utils.isEveryTabCoordinatesDefined)(cacheRef.current, tabElements)) {
+      setCoordinates([...cacheRef.current]);
+      cacheRef.current = [];
+    }
+  };
+
+  return [coordinates, updateCoordinate];
+}
+//# sourceMappingURL=useTabCoordinates.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["useTabCoordinates","tabElements","coordinates","setCoordinates","useState","cacheRef","useRef","updateCoordinate","index","x","width","current","x1","x2","isEveryTabCoordinatesDefined"],"sources":["useTabCoordinates.ts"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport TabCoordinate from './TabCoordinate';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\nexport interface UpdateCoordinate {\n    (index: number, x: number, width: number): void;\n}\n\nexport default function useTabCoordinates(tabElements: React.ReactNode): [TabCoordinate[], UpdateCoordinate] {\n    const [coordinates, setCoordinates] = useState<TabCoordinate[]>([]);\n\n    const cacheRef = useRef<TabCoordinate[]>([]);\n\n    const updateCoordinate: UpdateCoordinate = (index, x, width) => {\n        cacheRef.current[index] = { x1: x, x2: x + width };\n\n        if (isEveryTabCoordinatesDefined(cacheRef.current, tabElements)) {\n            setCoordinates([...cacheRef.current]);\n\n            cacheRef.current = [];\n        }\n    };\n\n    return [coordinates, updateCoordinate];\n}\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAMe,SAASA,iBAAT,CAA2BC,WAA3B,EAA8F;EACzG,MAAM,CAACC,WAAD,EAAcC,cAAd,IAAgC,IAAAC,eAAA,EAA0B,EAA1B,CAAtC;EAEA,MAAMC,QAAQ,GAAG,IAAAC,aAAA,EAAwB,EAAxB,CAAjB;;EAEA,MAAMC,gBAAkC,GAAG,CAACC,KAAD,EAAQC,CAAR,EAAWC,KAAX,KAAqB;IAC5DL,QAAQ,CAACM,OAAT,CAAiBH,KAAjB,IAA0B;MAAEI,EAAE,EAAEH,CAAN;MAASI,EAAE,EAAEJ,CAAC,GAAGC;IAAjB,CAA1B;;IAEA,IAAI,IAAAI,mCAAA,EAA6BT,QAAQ,CAACM,OAAtC,EAA+CV,WAA/C,CAAJ,EAAiE;MAC7DE,cAAc,CAAC,CAAC,GAAGE,QAAQ,CAACM,OAAb,CAAD,CAAd;MAEAN,QAAQ,CAACM,OAAT,GAAmB,EAAnB;IACH;EACJ,CARD;;EAUA,OAAO,CAACT,WAAD,EAAcK,gBAAd,CAAP;AACH"}

package/build/commonjs/Tabs/utils.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isEveryTabCoordinatesDefined = isEveryTabCoordinatesDefined;
+
+var _react = require("react");
+
+var _utils = require("@fountain-ui/utils");
+
+function isEveryTabCoordinatesDefined(coordinates, tabElements) {
+  const numberOfTabs = _react.Children.count(tabElements);
+
+  const numberOfCoordinates = coordinates.length;
+  const everyCoordinatesDefined = (0, _utils.isEveryDefined)(coordinates);
+  return numberOfTabs === numberOfCoordinates && everyCoordinatesDefined;
+}
+//# sourceMappingURL=utils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["isEveryTabCoordinatesDefined","coordinates","tabElements","numberOfTabs","Children","count","numberOfCoordinates","length","everyCoordinatesDefined","isEveryDefined"],"sources":["utils.ts"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { Children } from 'react';\nimport { isEveryDefined } from '@fountain-ui/utils';\nimport type TabCoordinate from './TabCoordinate';\n\n\nexport function isEveryTabCoordinatesDefined(coordinates: TabCoordinate[], tabElements: ReactNode): boolean {\n    const numberOfTabs = Children.count(tabElements);\n    const numberOfCoordinates = coordinates.length;\n\n    const everyCoordinatesDefined = isEveryDefined(coordinates);\n\n    return numberOfTabs === numberOfCoordinates && everyCoordinatesDefined;\n}\n"],"mappings":";;;;;;;AACA;;AACA;;AAIO,SAASA,4BAAT,CAAsCC,WAAtC,EAAoEC,WAApE,EAAqG;EACxG,MAAMC,YAAY,GAAGC,eAAA,CAASC,KAAT,CAAeH,WAAf,CAArB;;EACA,MAAMI,mBAAmB,GAAGL,WAAW,CAACM,MAAxC;EAEA,MAAMC,uBAAuB,GAAG,IAAAC,qBAAA,EAAeR,WAAf,CAAhC;EAEA,OAAOE,YAAY,KAAKG,mBAAjB,IAAwCE,uBAA/C;AACH"}

package/build/commonjs/TextField/InputLabel.js

@@ -26,7 +26,7 @@ const useStyles = function () {
       bottom: 0,
       right: 0,
       width: 8,
-      height: 2
+      height: 4
     },
     backgroundText: {
       position: 'absolute',
@@ -43,8 +43,6 @@ const useStyles = function () {
 };
 
 const InputLabel = props => {
-  var _paperStyles$backgrou;
-
   const {
     activeColor,
     animatedError,
@@ -70,7 +68,7 @@ const InputLabel = props => {
   const styles = useStyles();
   const paperStyles = (0, _usePaperStyles.default)();
   const backgroundStyle = {
-    backgroundColor: (_paperStyles$backgrou = paperStyles === null || paperStyles === void 0 ? void 0 : paperStyles.backgroundColor) !== null && _paperStyles$backgrou !== void 0 ? _paperStyles$backgrou : theme.palette.background.default
+    backgroundColor: (paperStyles === null || paperStyles === void 0 ? void 0 : paperStyles.backgroundColor) ?? theme.palette.background.default
   };
   const hasFocus = hasActiveOutline || value;
   const opacity = animatedLabel.interpolate({
@@ -85,7 +83,11 @@ const InputLabel = props => {
       })
     }]
   };
+  const labelTextFontStyle = (0, _styles.createFontStyle)(theme, {
+    selector: typo => typo.caption2
+  });
   const labelStyle = {
+    labelTextFontStyle,
     fontSize,
     transform: [{
       translateX: animatedError.interpolate({
@@ -112,7 +114,7 @@ const InputLabel = props => {
   }, [/*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
     key: 'labelBackground-view',
     pointerEvents: 'none',
-    style: [backgroundStyle, {
+    style: [styles.background, backgroundStyle, {
       opacity,
       transform: [{
         translateX: animatedLabel.interpolate({
@@ -123,7 +125,7 @@ const InputLabel = props => {
     }]
   }), /*#__PURE__*/_react.default.createElement(_reactNative.Animated.Text, {
     key: 'labelBackground-text',
-    style: [styles.placeholder, backgroundStyle, labelStyle, {
+    style: [styles.placeholder, styles.backgroundText, backgroundStyle, labelStyle, {
       top: topPosition + 1,
       opacity,
       transform: [...labelStyle.transform, {

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

@@ -1 +1 @@
-{"version":3,"sources":["InputLabel.tsx"],"names":["useStyles","background","position","top","left","bottom","right","width","height","backgroundText","paddingHorizontal","color","placeholder","inputPaddingHorizontal","InputLabel","props","activeColor","animatedError","animatedLabel","error","errorColor","focused","fontSize","hasActiveOutline","label","labelLayout","labelScale","labelTranslateX","labelTranslateY","onLayoutAnimatedText","paddingOffset","placeholderColor","placeholderOpacity","topPosition","value","theme","styles","paperStyles","backgroundStyle","backgroundColor","palette","default","hasFocus","opacity","interpolate","inputRange","outputRange","labelTranslationX","transform","translateX","labelStyle","translateY","scale","StyleSheet","absoluteFill","measured","scaleY","textAlign"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Animated, LayoutChangeEvent, StyleSheet } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport usePaperStyles from '../Paper/usePaperStyles';\nimport { inputPaddingHorizontal } from './utils';\n\ninterface LabelProps {\n    activeColor: string;\n    animatedError: Animated.Value;\n    animatedLabel: Animated.Value;\n    error?: boolean;\n    errorColor?: string;\n    focused?: boolean;\n    fontSize?: number;\n    hasActiveOutline?: boolean;\n    label?: string;\n    labelLayout: { measured: boolean; width: number; height: number };\n    labelScale: number;\n    labelTranslateX: number;\n    labelTranslateY: number;\n    onLayoutAnimatedText: (event: LayoutChangeEvent) => void;\n    paddingOffset?: { paddingLeft: number; paddingRight: number };\n    placeholder?: string;\n    placeholderColor?: string;\n    placeholderOpacity: number | Animated.AnimatedInterpolation;\n    topPosition: number;\n    value?: string;\n}\n\ntype InputLabelStyles = NamedStylesStringUnion<'background' | 'backgroundText' | 'placeholder'>;\n\nconst useStyles: UseStyles<InputLabelStyles> = function (): InputLabelStyles {\n    return {\n        background: {\n            position: 'absolute',\n            top: 6,\n            left: 10,\n            bottom: 0,\n            right: 0,\n            width: 8,\n            height: 2,\n        },\n        backgroundText: {\n            position: 'absolute',\n            left: 18,\n            paddingHorizontal: 0,\n            color: 'transparent',\n        },\n        placeholder: {\n            position: 'absolute',\n            left: 0,\n            paddingHorizontal: inputPaddingHorizontal,\n        },\n    };\n};\n\nconst InputLabel = (props: LabelProps) => {\n    const {\n        activeColor,\n        animatedError,\n        animatedLabel,\n        error = false,\n        errorColor,\n        focused,\n        fontSize,\n        hasActiveOutline,\n        label,\n        labelLayout,\n        labelScale,\n        labelTranslateX,\n        labelTranslateY,\n        onLayoutAnimatedText,\n        paddingOffset,\n        placeholderColor,\n        placeholderOpacity,\n        topPosition,\n        value,\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const paperStyles = usePaperStyles();\n\n    const backgroundStyle = {\n        backgroundColor: paperStyles?.backgroundColor ?? theme.palette.background.default,\n    };\n\n    const hasFocus = hasActiveOutline || value;\n    const opacity = animatedLabel.interpolate({\n        inputRange: [0, 1],\n        outputRange: [hasFocus ? 1 : 0, 0],\n    });\n\n    const labelTranslationX = {\n        transform: [\n            {\n                translateX: animatedLabel.interpolate({\n                    inputRange: [0, 1],\n                    outputRange: [labelTranslateX, 0 || 0],\n                }),\n            },\n        ],\n    };\n\n    const labelStyle = {\n        fontSize,\n        transform: [\n            {\n                translateX: animatedError.interpolate({\n                    inputRange: [0, 0.5, 1],\n                    outputRange: [0, value && error ? 4 : 0, 0],\n                }),\n            },\n            {\n                translateY: animatedLabel.interpolate({\n                    inputRange: [0, 1],\n                    outputRange: [labelTranslateY, 0],\n                }),\n            },\n            {\n                scale: animatedLabel.interpolate({\n                    inputRange: [0, 1],\n                    outputRange: [labelScale, 1],\n                }),\n            },\n        ],\n    };\n\n    return (label ? (\n        <Animated.View\n            pointerEvents={'none'}\n            style={[\n                StyleSheet.absoluteFill,\n                {\n                    opacity: value || focused ? (labelLayout.measured ? 1 : 0) : 1,\n                },\n                labelTranslationX,\n            ]}\n        >\n            {[\n                <Animated.View\n                    key={'labelBackground-view'}\n                    pointerEvents={'none'}\n                    style={[\n                        backgroundStyle,\n                        {\n                            opacity,\n                            transform: [\n                                {\n                                    translateX: animatedLabel.interpolate({\n                                        inputRange: [0, 1],\n                                        outputRange: [-labelTranslateX, 0],\n                                    }),\n                                },\n                            ],\n                        },\n                    ]}\n                />,\n                <Animated.Text\n                    key={'labelBackground-text'}\n                    style={[\n                        styles.placeholder,\n                        backgroundStyle,\n                        labelStyle,\n                        {\n                            top: topPosition + 1,\n                            opacity,\n                            transform: [\n                                ...labelStyle.transform,\n                                {\n                                    scaleY: animatedLabel.interpolate({\n                                        inputRange: [0, 1],\n                                        outputRange: [0.2, 1],\n                                    }),\n                                },\n                            ],\n                        },\n                    ]}\n                    numberOfLines={1}\n                >\n                    {label}\n                </Animated.Text>,\n            ]}\n            <Animated.Text\n                onLayout={onLayoutAnimatedText}\n                style={[\n                    styles.placeholder,\n                    labelStyle,\n                    paddingOffset,\n                    {\n                        textAlign: 'left',\n                        top: topPosition,\n                        color: error && errorColor ? errorColor : activeColor,\n                        opacity: animatedLabel.interpolate({\n                            inputRange: [0, 1],\n                            outputRange: [hasActiveOutline ? 1 : 0, 0],\n                        }),\n                    },\n                ]}\n                numberOfLines={1}\n            >\n                {label}\n            </Animated.Text>\n            <Animated.Text\n                style={[\n                    styles.placeholder,\n                    labelStyle,\n                    paddingOffset,\n                    {\n                        textAlign: 'left',\n                        top: topPosition,\n                        color: error && errorColor ? errorColor : placeholderColor,\n                        opacity: placeholderOpacity,\n                    },\n                ]}\n                numberOfLines={1}\n            >\n                {label}\n            </Animated.Text>\n        </Animated.View>\n    ) : null);\n};\n\nexport default InputLabel;\n"]}
+{"version":3,"names":["useStyles","background","position","top","left","bottom","right","width","height","backgroundText","paddingHorizontal","color","placeholder","inputPaddingHorizontal","InputLabel","props","activeColor","animatedError","animatedLabel","error","errorColor","focused","fontSize","hasActiveOutline","label","labelLayout","labelScale","labelTranslateX","labelTranslateY","onLayoutAnimatedText","paddingOffset","placeholderColor","placeholderOpacity","topPosition","value","theme","useTheme","styles","paperStyles","usePaperStyles","backgroundStyle","backgroundColor","palette","default","hasFocus","opacity","interpolate","inputRange","outputRange","labelTranslationX","transform","translateX","labelTextFontStyle","createFontStyle","selector","typo","caption2","labelStyle","translateY","scale","StyleSheet","absoluteFill","measured","scaleY","textAlign"],"sources":["InputLabel.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated, LayoutChangeEvent, StyleSheet } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport usePaperStyles from '../Paper/usePaperStyles';\nimport { inputPaddingHorizontal } from './utils';\n\ninterface LabelProps {\n    activeColor: string;\n    animatedError: Animated.Value;\n    animatedLabel: Animated.Value;\n    error?: boolean;\n    errorColor?: string;\n    focused?: boolean;\n    fontSize?: number;\n    hasActiveOutline?: boolean;\n    label?: string;\n    labelLayout: { measured: boolean; width: number; height: number };\n    labelScale: number;\n    labelTranslateX: number;\n    labelTranslateY: number;\n    onLayoutAnimatedText: (event: LayoutChangeEvent) => void;\n    paddingOffset?: { paddingLeft: number; paddingRight: number };\n    placeholder?: string;\n    placeholderColor?: string;\n    placeholderOpacity: number | Animated.AnimatedInterpolation;\n    topPosition: number;\n    value?: string;\n}\n\ntype InputLabelStyles = NamedStylesStringUnion<'background' | 'backgroundText' | 'placeholder'>;\n\nconst useStyles: UseStyles<InputLabelStyles> = function (): InputLabelStyles {\n    return {\n        background: {\n            position: 'absolute',\n            top: 6,\n            left: 10,\n            bottom: 0,\n            right: 0,\n            width: 8,\n            height: 4,\n        },\n        backgroundText: {\n            position: 'absolute',\n            left: 18,\n            paddingHorizontal: 0,\n            color: 'transparent',\n        },\n        placeholder: {\n            position: 'absolute',\n            left: 0,\n            paddingHorizontal: inputPaddingHorizontal,\n        },\n    };\n};\n\nconst InputLabel = (props: LabelProps) => {\n    const {\n        activeColor,\n        animatedError,\n        animatedLabel,\n        error = false,\n        errorColor,\n        focused,\n        fontSize,\n        hasActiveOutline,\n        label,\n        labelLayout,\n        labelScale,\n        labelTranslateX,\n        labelTranslateY,\n        onLayoutAnimatedText,\n        paddingOffset,\n        placeholderColor,\n        placeholderOpacity,\n        topPosition,\n        value,\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const paperStyles = usePaperStyles();\n\n    const backgroundStyle = {\n        backgroundColor: paperStyles?.backgroundColor ?? theme.palette.background.default,\n    };\n\n    const hasFocus = hasActiveOutline || value;\n    const opacity = animatedLabel.interpolate({\n        inputRange: [0, 1],\n        outputRange: [hasFocus ? 1 : 0, 0],\n    });\n\n    const labelTranslationX = {\n        transform: [\n            {\n                translateX: animatedLabel.interpolate({\n                    inputRange: [0, 1],\n                    outputRange: [labelTranslateX, 0 || 0],\n                }),\n            },\n        ],\n    };\n\n    const labelTextFontStyle = createFontStyle(theme, { selector: (typo) => typo.caption2 });\n\n    const labelStyle = {\n        labelTextFontStyle,\n        fontSize,\n        transform: [\n            {\n                translateX: animatedError.interpolate({\n                    inputRange: [0, 0.5, 1],\n                    outputRange: [0, value && error ? 4 : 0, 0],\n                }),\n            },\n            {\n                translateY: animatedLabel.interpolate({\n                    inputRange: [0, 1],\n                    outputRange: [labelTranslateY, 0],\n                }),\n            },\n            {\n                scale: animatedLabel.interpolate({\n                    inputRange: [0, 1],\n                    outputRange: [labelScale, 1],\n                }),\n            },\n        ],\n    };\n\n    return (label ? (\n        <Animated.View\n            pointerEvents={'none'}\n            style={[\n                StyleSheet.absoluteFill,\n                {\n                    opacity: value || focused ? (labelLayout.measured ? 1 : 0) : 1,\n                },\n                labelTranslationX,\n            ]}\n        >\n            {[\n                <Animated.View\n                    key={'labelBackground-view'}\n                    pointerEvents={'none'}\n                    style={[\n                        styles.background,\n                        backgroundStyle,\n                        {\n                            opacity,\n                            transform: [\n                                {\n                                    translateX: animatedLabel.interpolate({\n                                        inputRange: [0, 1],\n                                        outputRange: [-labelTranslateX, 0],\n                                    }),\n                                },\n                            ],\n                        },\n                    ]}\n                />,\n                <Animated.Text\n                    key={'labelBackground-text'}\n                    style={[\n                        styles.placeholder,\n                        styles.backgroundText,\n                        backgroundStyle,\n                        labelStyle,\n                        {\n                            top: topPosition + 1,\n                            opacity,\n                            transform: [\n                                ...labelStyle.transform,\n                                {\n                                    scaleY: animatedLabel.interpolate({\n                                        inputRange: [0, 1],\n                                        outputRange: [0.2, 1],\n                                    }),\n                                },\n                            ],\n                        },\n                    ]}\n                    numberOfLines={1}\n                >\n                    {label}\n                </Animated.Text>,\n            ]}\n            <Animated.Text\n                onLayout={onLayoutAnimatedText}\n                style={[\n                    styles.placeholder,\n                    labelStyle,\n                    paddingOffset,\n                    {\n                        textAlign: 'left',\n                        top: topPosition,\n                        color: error && errorColor ? errorColor : activeColor,\n                        opacity: animatedLabel.interpolate({\n                            inputRange: [0, 1],\n                            outputRange: [hasActiveOutline ? 1 : 0, 0],\n                        }),\n                    },\n                ]}\n                numberOfLines={1}\n            >\n                {label}\n            </Animated.Text>\n            <Animated.Text\n                style={[\n                    styles.placeholder,\n                    labelStyle,\n                    paddingOffset,\n                    {\n                        textAlign: 'left',\n                        top: topPosition,\n                        color: error && errorColor ? errorColor : placeholderColor,\n                        opacity: placeholderOpacity,\n                    },\n                ]}\n                numberOfLines={1}\n            >\n                {label}\n            </Animated.Text>\n        </Animated.View>\n    ) : null);\n};\n\nexport default InputLabel;\n"],"mappings":"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"}

package/build/commonjs/TextField/OutlinedTextField.js

@@ -19,7 +19,7 @@ var _utils = require("./utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 const useStyles = function () {
   const theme = (0, _styles.useTheme)();
@@ -112,12 +112,16 @@ const OutlinedTextField = /*#__PURE__*/_react.default.forwardRef(function Outlin
     placeholderOpacity,
     topPosition
   };
+  const inputTextFontStyle = (0, _styles.createFontStyle)(theme, {
+    selector: typo => typo.body1,
+    color: inputTextColor
+  });
   const outlineStyle = (0, _styles.css)([styles.outline, {
     borderWidth: hasActiveOutline ? 2 : 1,
     borderColor: error ? errorColor : hasActiveOutline ? activeColor : outlineColor,
     top: label ? 6 : 0
   }]);
-  const textInputStyle = (0, _styles.css)([styles.input, {
+  const textInputStyle = (0, _styles.css)([inputTextFontStyle, styles.input, {
     fontSize,
     color: inputTextColor,
     height: inputHeight

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

@@ -1 +1 @@
-{"version":3,"sources":["OutlinedTextField.tsx"],"names":["useStyles","theme","outline","position","left","right","bottom","borderRadius","shape","roundness","input","flexGrow","paddingHorizontal","inputPaddingHorizontal","textAlignVertical","textAlign","zIndex","textField","iconContainer","width","height","justifyContent","alignItems","OutlinedTextField","React","forwardRef","props","ref","animatedError","animatedLabel","disabled","error","focused","forceFocus","icon","keyboardType","label","labelLayout","onBlur","onChangeText","onFocus","onIconPress","onLayoutAnimatedText","onSubmitEditing","placeholder","secureTextEntry","style","value","styles","hasActiveOutline","inputTextColor","palette","tertiary","main","primary","activeColor","warning","accent","placeholderColor","text","hint","outlineColor","border","errorColor","typography","body2","fontSize","unitless","labelScale","labelFontSize","labelWidth","labelHeight","labelHalfWidth","labelHalfHeight","labelTranslateX","minInputHeight","defaultHeight","labelPaddingTop","inputHeight","topPosition","Math","floor","iconTopPosition","iconSize","labelYOffset","labelTranslateY","placeholderOpacity","interpolate","inputRange","outputRange","measured","labelProps","outlineStyle","borderWidth","borderColor","top","textInputStyle","color","marginRight","paddingRight","Platform","OS","outlineWidth","containerStyle","paddingTop","minHeight","iconContainerStyle","onIconButtonPress"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Animated, LayoutChangeEvent, Platform, TextInput, View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport IconButton from '../IconButton';\nimport TextFieldProps from './TextFieldProps';\nimport InputLabel from './InputLabel';\nimport {\n    defaultHeight,\n    iconSize,\n    inputPaddingHorizontal,\n    labelFontSize,\n    labelPaddingTop,\n    labelYOffset,\n} from './utils';\n\ninterface OutlinedTextFieldProps extends TextFieldProps {\n    animatedError: Animated.Value;\n    animatedLabel: Animated.Value;\n    focused: boolean;\n    forceFocus: () => void;\n    labelLayout: { measured: boolean; width: number; height: number };\n    onLayoutAnimatedText: (event: LayoutChangeEvent) => void;\n}\n\ntype OutlinedTextFieldStyles = NamedStylesStringUnion<'outline' | 'input' | 'iconContainer'>;\n\nconst useStyles: UseStyles<OutlinedTextFieldStyles> = function (): OutlinedTextFieldStyles {\n    const theme = useTheme();\n\n    return {\n        outline: {\n            position: 'absolute',\n            left: 0,\n            right: 0,\n            bottom: 0,\n            borderRadius: theme.shape.roundness,\n        },\n        input: {\n            flexGrow: 1,\n            paddingHorizontal: inputPaddingHorizontal,\n            textAlignVertical: 'center',\n            textAlign: 'left',\n            zIndex: theme.zIndex.textField,\n        },\n        iconContainer: {\n            position: 'absolute',\n            width: 24,\n            height: 24,\n            justifyContent: 'center',\n            alignItems: 'center',\n            right: 12,\n        },\n    };\n};\n\nconst OutlinedTextField = React.forwardRef<TextInput, OutlinedTextFieldProps>(function OutlinedTextField(props, ref) {\n    const {\n        animatedError,\n        animatedLabel,\n        disabled,\n        error,\n        focused,\n        forceFocus,\n        icon,\n        keyboardType,\n        label,\n        labelLayout,\n        onBlur,\n        onChangeText,\n        onFocus,\n        onIconPress,\n        onLayoutAnimatedText,\n        onSubmitEditing,\n        placeholder,\n        secureTextEntry,\n        style,\n        value,\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const hasActiveOutline = focused || error;\n    const inputTextColor = disabled ? theme.palette.tertiary.main : theme.palette.primary.main;\n    const activeColor = error\n        ? theme.palette.warning.main\n        : disabled\n            ? theme.palette.tertiary.main\n            : theme.palette.accent.main;\n    const placeholderColor = disabled ? theme.palette.tertiary.main : theme.palette.text.hint;\n    const outlineColor = disabled ? theme.palette.border : theme.palette.border;\n    const errorColor = disabled ? theme.palette.tertiary.main : theme.palette.warning.main;\n\n    const typography = theme.typography.body2;\n    const fontSize = typography.fontSize.unitless;\n\n    const labelScale = labelFontSize / fontSize;\n    const labelWidth = labelLayout.width;\n    const labelHeight = labelLayout.height;\n    const labelHalfWidth = labelWidth / 2;\n    const labelHalfHeight = labelHeight / 2;\n\n    const labelTranslateX = -1 * (labelHalfWidth - (labelScale * labelWidth) / 2 - (fontSize - labelFontSize) * labelScale);\n    const minInputHeight = defaultHeight - labelPaddingTop;\n    const inputHeight = labelHeight < minInputHeight ? minInputHeight : labelHeight;\n    const topPosition = Math.floor(((inputHeight > 0 ? inputHeight : 0) - labelHeight) / 2 + labelPaddingTop);\n    const iconTopPosition = (defaultHeight - (label ? 0 : labelPaddingTop) - iconSize - (label ? labelYOffset : 0)) / 2;\n    const labelTranslateY = -labelHalfHeight - (topPosition + labelYOffset);\n\n    const placeholderOpacity = hasActiveOutline\n        ? animatedLabel.interpolate({\n            inputRange: [0, 1],\n            outputRange: [hasActiveOutline ? 0 : 1, 1],\n        })\n        : labelLayout.measured ? 1 : 0;\n\n    const labelProps = {\n        activeColor,\n        error,\n        errorColor,\n        fontSize,\n        hasActiveOutline,\n        label,\n        labelScale,\n        labelTranslateX,\n        labelTranslateY,\n        onLayoutAnimatedText,\n        placeholderColor,\n        placeholderOpacity,\n        topPosition,\n    };\n\n    const outlineStyle = css([\n        styles.outline,\n        {\n            borderWidth: hasActiveOutline ? 2 : 1,\n            borderColor: error ? errorColor : (hasActiveOutline ? activeColor : outlineColor),\n            top: label ? 6 : 0,\n        },\n    ]);\n\n    const textInputStyle = css([\n        styles.input,\n        {\n            fontSize,\n            color: inputTextColor,\n            height: inputHeight,\n        },\n        icon && {\n            marginRight: iconSize + 20,\n            paddingRight: 0,\n        },\n        Platform.OS === 'web' && {\n            //@ts-ignore\n            outlineWidth: 0,\n        },\n    ]);\n\n    const containerStyle = css([\n        {\n            paddingTop: label ? labelPaddingTop : 0,\n            minHeight: label ? defaultHeight : defaultHeight + labelYOffset,\n        },\n    ]);\n\n    const iconContainerStyle = css([\n        styles.iconContainer,\n        { top: iconTopPosition },\n    ]);\n\n    const onIconButtonPress = () => {\n        forceFocus();\n        onIconPress?.();\n    };\n\n    return (\n        <View style={style}>\n            <View\n                pointerEvents={'none'}\n                style={outlineStyle}\n            />\n            <View style={containerStyle}>\n                {label ? (\n                    <InputLabel\n                        animatedLabel={animatedLabel}\n                        animatedError={animatedError}\n                        focused={focused}\n                        labelLayout={labelLayout}\n                        placeholder={placeholder}\n                        value={value}\n                        {...labelProps}\n                    />\n                ) : null}\n                <TextInput\n                    autoCapitalize={'none'}\n                    autoCorrect={false}\n                    disableFullscreenUI={true}\n                    ref={ref}\n                    onChangeText={onChangeText}\n                    placeholder={placeholder}\n                    placeholderTextColor={placeholderColor}\n                    editable={!disabled}\n                    selectionColor={activeColor}\n                    onFocus={onFocus}\n                    onBlur={onBlur}\n                    onSubmitEditing={onSubmitEditing}\n                    keyboardType={keyboardType}\n                    secureTextEntry={secureTextEntry}\n                    underlineColorAndroid={'transparent'}\n                    style={textInputStyle}\n                    value={value}\n                />\n            </View>\n            {icon ? (\n                <View style={iconContainerStyle}>\n                    <IconButton\n                        children={icon}\n                        onPress={onIconButtonPress}\n                    />\n                </View>\n            ) : null}\n        </View>\n    );\n});\n\nexport default OutlinedTextField;\n"]}
+{"version":3,"names":["useStyles","theme","useTheme","outline","position","left","right","bottom","borderRadius","shape","roundness","input","flexGrow","paddingHorizontal","inputPaddingHorizontal","textAlignVertical","textAlign","zIndex","textField","iconContainer","width","height","justifyContent","alignItems","OutlinedTextField","React","forwardRef","props","ref","animatedError","animatedLabel","disabled","error","focused","forceFocus","icon","keyboardType","label","labelLayout","onBlur","onChangeText","onFocus","onIconPress","onLayoutAnimatedText","onSubmitEditing","placeholder","secureTextEntry","style","value","styles","hasActiveOutline","inputTextColor","palette","tertiary","main","primary","activeColor","warning","accent","placeholderColor","text","hint","outlineColor","border","errorColor","typography","body2","fontSize","unitless","labelScale","labelFontSize","labelWidth","labelHeight","labelHalfWidth","labelHalfHeight","labelTranslateX","minInputHeight","defaultHeight","labelPaddingTop","inputHeight","topPosition","Math","floor","iconTopPosition","iconSize","labelYOffset","labelTranslateY","placeholderOpacity","interpolate","inputRange","outputRange","measured","labelProps","inputTextFontStyle","createFontStyle","selector","typo","body1","color","outlineStyle","css","borderWidth","borderColor","top","textInputStyle","marginRight","paddingRight","Platform","OS","outlineWidth","containerStyle","paddingTop","minHeight","iconContainerStyle","onIconButtonPress"],"sources":["OutlinedTextField.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated, LayoutChangeEvent, Platform, TextInput, View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport IconButton from '../IconButton';\nimport TextFieldProps from './TextFieldProps';\nimport InputLabel from './InputLabel';\nimport {\n    defaultHeight,\n    iconSize,\n    inputPaddingHorizontal,\n    labelFontSize,\n    labelPaddingTop,\n    labelYOffset,\n} from './utils';\n\ninterface OutlinedTextFieldProps extends TextFieldProps {\n    animatedError: Animated.Value;\n    animatedLabel: Animated.Value;\n    focused: boolean;\n    forceFocus: () => void;\n    labelLayout: { measured: boolean; width: number; height: number };\n    onLayoutAnimatedText: (event: LayoutChangeEvent) => void;\n}\n\ntype OutlinedTextFieldStyles = NamedStylesStringUnion<'outline' | 'input' | 'iconContainer'>;\n\nconst useStyles: UseStyles<OutlinedTextFieldStyles> = function (): OutlinedTextFieldStyles {\n    const theme = useTheme();\n\n    return {\n        outline: {\n            position: 'absolute',\n            left: 0,\n            right: 0,\n            bottom: 0,\n            borderRadius: theme.shape.roundness,\n        },\n        input: {\n            flexGrow: 1,\n            paddingHorizontal: inputPaddingHorizontal,\n            textAlignVertical: 'center',\n            textAlign: 'left',\n            zIndex: theme.zIndex.textField,\n        },\n        iconContainer: {\n            position: 'absolute',\n            width: 24,\n            height: 24,\n            justifyContent: 'center',\n            alignItems: 'center',\n            right: 12,\n        },\n    };\n};\n\nconst OutlinedTextField = React.forwardRef<TextInput, OutlinedTextFieldProps>(function OutlinedTextField(props, ref) {\n    const {\n        animatedError,\n        animatedLabel,\n        disabled,\n        error,\n        focused,\n        forceFocus,\n        icon,\n        keyboardType,\n        label,\n        labelLayout,\n        onBlur,\n        onChangeText,\n        onFocus,\n        onIconPress,\n        onLayoutAnimatedText,\n        onSubmitEditing,\n        placeholder,\n        secureTextEntry,\n        style,\n        value,\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const hasActiveOutline = focused || error;\n    const inputTextColor = disabled ? theme.palette.tertiary.main : theme.palette.primary.main;\n    const activeColor = error\n        ? theme.palette.warning.main\n        : disabled\n            ? theme.palette.tertiary.main\n            : theme.palette.accent.main;\n    const placeholderColor = disabled ? theme.palette.tertiary.main : theme.palette.text.hint;\n    const outlineColor = disabled ? theme.palette.border : theme.palette.border;\n    const errorColor = disabled ? theme.palette.tertiary.main : theme.palette.warning.main;\n\n    const typography = theme.typography.body2;\n    const fontSize = typography.fontSize.unitless;\n\n    const labelScale = labelFontSize / fontSize;\n    const labelWidth = labelLayout.width;\n    const labelHeight = labelLayout.height;\n    const labelHalfWidth = labelWidth / 2;\n    const labelHalfHeight = labelHeight / 2;\n\n    const labelTranslateX = -1 * (labelHalfWidth - (labelScale * labelWidth) / 2 - (fontSize - labelFontSize) * labelScale);\n    const minInputHeight = defaultHeight - labelPaddingTop;\n    const inputHeight = labelHeight < minInputHeight ? minInputHeight : labelHeight;\n    const topPosition = Math.floor(((inputHeight > 0 ? inputHeight : 0) - labelHeight) / 2 + labelPaddingTop);\n    const iconTopPosition = (defaultHeight - (label ? 0 : labelPaddingTop) - iconSize - (label ? labelYOffset : 0)) / 2;\n    const labelTranslateY = -labelHalfHeight - (topPosition + labelYOffset);\n\n    const placeholderOpacity = hasActiveOutline\n        ? animatedLabel.interpolate({\n            inputRange: [0, 1],\n            outputRange: [hasActiveOutline ? 0 : 1, 1],\n        })\n        : labelLayout.measured ? 1 : 0;\n\n    const labelProps = {\n        activeColor,\n        error,\n        errorColor,\n        fontSize,\n        hasActiveOutline,\n        label,\n        labelScale,\n        labelTranslateX,\n        labelTranslateY,\n        onLayoutAnimatedText,\n        placeholderColor,\n        placeholderOpacity,\n        topPosition,\n    };\n\n    const inputTextFontStyle = createFontStyle(theme, {\n        selector: (typo) => typo.body1,\n        color: inputTextColor,\n    });\n\n    const outlineStyle = css([\n        styles.outline,\n        {\n            borderWidth: hasActiveOutline ? 2 : 1,\n            borderColor: error ? errorColor : (hasActiveOutline ? activeColor : outlineColor),\n            top: label ? 6 : 0,\n        },\n    ]);\n\n    const textInputStyle = css([\n        inputTextFontStyle,\n        styles.input,\n        {\n            fontSize,\n            color: inputTextColor,\n            height: inputHeight,\n        },\n        icon && {\n            marginRight: iconSize + 20,\n            paddingRight: 0,\n        },\n        Platform.OS === 'web' && {\n            //@ts-ignore\n            outlineWidth: 0,\n        },\n    ]);\n\n    const containerStyle = css([\n        {\n            paddingTop: label ? labelPaddingTop : 0,\n            minHeight: label ? defaultHeight : defaultHeight + labelYOffset,\n        },\n    ]);\n\n    const iconContainerStyle = css([\n        styles.iconContainer,\n        { top: iconTopPosition },\n    ]);\n\n    const onIconButtonPress = () => {\n        forceFocus();\n        onIconPress?.();\n    };\n\n    return (\n        <View style={style}>\n            <View\n                pointerEvents={'none'}\n                style={outlineStyle}\n            />\n            <View style={containerStyle}>\n                {label ? (\n                    <InputLabel\n                        animatedLabel={animatedLabel}\n                        animatedError={animatedError}\n                        focused={focused}\n                        labelLayout={labelLayout}\n                        placeholder={placeholder}\n                        value={value}\n                        {...labelProps}\n                    />\n                ) : null}\n                <TextInput\n                    autoCapitalize={'none'}\n                    autoCorrect={false}\n                    disableFullscreenUI={true}\n                    ref={ref}\n                    onChangeText={onChangeText}\n                    placeholder={placeholder}\n                    placeholderTextColor={placeholderColor}\n                    editable={!disabled}\n                    selectionColor={activeColor}\n                    onFocus={onFocus}\n                    onBlur={onBlur}\n                    onSubmitEditing={onSubmitEditing}\n                    keyboardType={keyboardType}\n                    secureTextEntry={secureTextEntry}\n                    underlineColorAndroid={'transparent'}\n                    style={textInputStyle}\n                    value={value}\n                />\n            </View>\n            {icon ? (\n                <View style={iconContainerStyle}>\n                    <IconButton\n                        children={icon}\n                        onPress={onIconButtonPress}\n                    />\n                </View>\n            ) : null}\n        </View>\n    );\n});\n\nexport default OutlinedTextField;\n"],"mappings":"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"}

package/build/commonjs/TextField/TextField.js

@@ -9,12 +9,14 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _reactNative = require("react-native");
 
+var _styles = require("../styles");
+
+var _hooks = require("../hooks");
+
 var _OutlinedTextField = _interopRequireDefault(require("./OutlinedTextField"));
 
 var _utils = require("./utils");
 
-var _styles = require("../styles");
-
 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); }
@@ -61,10 +63,8 @@ const TextField = /*#__PURE__*/_react.default.forwardRef(function TextField(prop
       (_innerRef$current3 = innerRef.current) === null || _innerRef$current3 === void 0 ? void 0 : _innerRef$current3.blur();
     }
   }));
-
-  const [animatedLabel] = _react.default.useState(() => new _reactNative.Animated.Value(value ? 0 : 1));
-
-  const [animatedError] = _react.default.useState(() => new _reactNative.Animated.Value(error ? 1 : 0));
+  const animatedLabel = (0, _hooks.useAnimatedValue)(value ? 0 : 1);
+  const animatedError = (0, _hooks.useAnimatedValue)(error ? 1 : 0);
 
   const [focused, setFocused] = _react.default.useState(false);
 

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

@@ -1 +1 @@
-{"version":3,"sources":["TextField.tsx"],"names":["TextField","React","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","useState","Animated","Value","animatedError","focused","setFocused","setPlaceholder","labelLayout","setLabelLayout","measured","width","height","minimizeLabel","timing","toValue","duration","blurAnimationDuration","useNativeDriver","start","restoreLabel","focusAnimationDuration","showError","hideError","showPlaceholder","hidePlaceholder","useEffect","handleFocus","event","handleBlur","opacity","handleLayoutAnimatedText","nativeEvent","layout","forceFocus"],"mappings":"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","sourcesContent":["import React, { useImperativeHandle, useRef } from 'react';\nimport { Animated, LayoutChangeEvent, NativeSyntheticEvent, TargetedEvent, TextInput } from 'react-native';\nimport OutlinedTextField from './OutlinedTextField';\nimport TextFieldProps from './TextFieldProps';\nimport { blurAnimationDuration, focusAnimationDuration } from './utils';\nimport { css } from '../styles';\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] = React.useState(() => new Animated.Value(value ? 0 : 1));\n    const [animatedError] = React.useState(() => new Animated.Value(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"]}
+{"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"],"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 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    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/commonjs/TextField/TextFieldProps.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
+{"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":""}

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

@@ -1 +1 @@
-{"version":3,"sources":["index.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA","sourcesContent":["export { default } from './TextField';\nexport type { default as TextFieldProps } from './TextFieldProps';"]}
+{"version":3,"names":[],"sources":["index.tsx"],"sourcesContent":["export { default } from './TextField';\nexport type { default as TextFieldProps } from './TextFieldProps';"],"mappings":";;;;;;;;;;;;AAAA"}

package/build/commonjs/TextField/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.focusAnimationDuration = exports.blurAnimationDuration = exports.inputPaddingHorizontal = exports.labelPaddingTop = exports.labelYOffset = exports.labelFontSize = exports.iconSize = exports.defaultHeight = void 0;
+exports.labelYOffset = exports.labelPaddingTop = exports.labelFontSize = exports.inputPaddingHorizontal = exports.iconSize = exports.focusAnimationDuration = exports.defaultHeight = exports.blurAnimationDuration = void 0;
 const defaultHeight = 52;
 exports.defaultHeight = defaultHeight;
 const iconSize = 24;

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

@@ -1 +1 @@
-{"version":3,"sources":["utils.ts"],"names":["defaultHeight","iconSize","labelFontSize","labelYOffset","labelPaddingTop","inputPaddingHorizontal","blurAnimationDuration","focusAnimationDuration"],"mappings":";;;;;;AAAO,MAAMA,aAAa,GAAG,EAAtB;;AAEA,MAAMC,QAAQ,GAAG,EAAjB;;AAEA,MAAMC,aAAa,GAAG,EAAtB;;AAEA,MAAMC,YAAY,GAAG,CAAC,CAAtB;;AAEA,MAAMC,eAAe,GAAG,CAAxB;;AAEA,MAAMC,sBAAsB,GAAG,EAA/B;;AAEA,MAAMC,qBAAqB,GAAG,GAA9B;;AAEA,MAAMC,sBAAsB,GAAG,GAA/B","sourcesContent":["export const defaultHeight = 52;\n\nexport const iconSize = 24;\n\nexport const labelFontSize = 12;\n\nexport const labelYOffset = -6;\n\nexport const labelPaddingTop = 8;\n\nexport const inputPaddingHorizontal = 14;\n\nexport const blurAnimationDuration = 180;\n\nexport const focusAnimationDuration = 150;"]}
+{"version":3,"names":["defaultHeight","iconSize","labelFontSize","labelYOffset","labelPaddingTop","inputPaddingHorizontal","blurAnimationDuration","focusAnimationDuration"],"sources":["utils.ts"],"sourcesContent":["export const defaultHeight = 52;\n\nexport const iconSize = 24;\n\nexport const labelFontSize = 12;\n\nexport const labelYOffset = -6;\n\nexport const labelPaddingTop = 8;\n\nexport const inputPaddingHorizontal = 14;\n\nexport const blurAnimationDuration = 180;\n\nexport const focusAnimationDuration = 150;"],"mappings":";;;;;;AAAO,MAAMA,aAAa,GAAG,EAAtB;;AAEA,MAAMC,QAAQ,GAAG,EAAjB;;AAEA,MAAMC,aAAa,GAAG,EAAtB;;AAEA,MAAMC,YAAY,GAAG,CAAC,CAAtB;;AAEA,MAAMC,eAAe,GAAG,CAAxB;;AAEA,MAAMC,sBAAsB,GAAG,EAA/B;;AAEA,MAAMC,qBAAqB,GAAG,GAA9B;;AAEA,MAAMC,sBAAsB,GAAG,GAA/B"}

package/build/commonjs/Toolbar/Toolbar.js

@@ -13,7 +13,7 @@ var _styles = require("../styles");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 const useStyles = function () {
   const theme = (0, _styles.useTheme)();