@fountain-ui/core 3.0.0-alpha.3 → 3.0.0-alpha.31

package/build/module/Toolbar/BackButton/BackButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","IconButton","AppBarChevronLeft","css","styles","create","root","height","left","paddingLeft","paddingRight","paddingVertical","position","width","BackButton","props","style","styleProp","otherProps","rootStyle"],"sources":["BackButton.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet } from 'react-native';\nimport IconButton from '../../IconButton';\nimport { AppBarChevronLeft } from '../../internal';\nimport type BackButtonProps from './BackButtonProps';\nimport { css } from '@fountain-ui/styles';\n\nconst styles = StyleSheet.create({\n    root: {\n        height: 40,\n        left: 4,\n        paddingLeft: 5,\n        paddingRight: 11,\n        paddingVertical: 8,\n        position: 'absolute',\n        width: 40,\n    },\n});\n\nexport default function BackButton(props: BackButtonProps) {\n    const {\n        style: styleProp,\n        ...otherProps\n    } = props;\n\n    const rootStyle = css([\n        styles.root,\n        styleProp,\n    ]);\n\n    return (\n        <IconButton\n            style={rootStyle}\n            {...otherProps}\n        >\n            <React.Fragment>\n                <AppBarChevronLeft\n                    height={24}\n                    width={24}\n                />\n            </React.Fragment>\n        </IconButton>\n    );\n}\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,OAAOC,UAAP,MAAuB,kBAAvB;AACA,SAASC,iBAAT,QAAkC,gBAAlC;AAEA,SAASC,GAAT,QAAoB,qBAApB;AAEA,MAAMC,MAAM,GAAGJ,UAAU,CAACK,MAAX,CAAkB;EAC7BC,IAAI,EAAE;IACFC,MAAM,EAAE,EADN;IAEFC,IAAI,EAAE,CAFJ;IAGFC,WAAW,EAAE,CAHX;IAIFC,YAAY,EAAE,EAJZ;IAKFC,eAAe,EAAE,CALf;IAMFC,QAAQ,EAAE,UANR;IAOFC,KAAK,EAAE;EAPL;AADuB,CAAlB,CAAf;AAYA,eAAe,SAASC,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,KAAK,EAAEC,SADL;IAEF,GAAGC;EAFD,IAGFH,KAHJ;EAKA,MAAMI,SAAS,GAAGhB,GAAG,CAAC,CAClBC,MAAM,CAACE,IADW,EAElBW,SAFkB,CAAD,CAArB;EAKA,oBACI,oBAAC,UAAD;IACI,KAAK,EAAEE;EADX,GAEQD,UAFR,gBAII,oBAAC,KAAD,CAAO,QAAP,qBACI,oBAAC,iBAAD;IACI,MAAM,EAAE,EADZ;IAEI,KAAK,EAAE;EAFX,EADJ,CAJJ,CADJ;AAaH"}

package/build/module/Toolbar/BackButton/BackButtonProps.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=BackButtonProps.js.map

package/build/module/Toolbar/BackButton/BackButtonProps.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["BackButtonProps.ts"],"sourcesContent":["import type { IconButtonProps } from '../../IconButton';\nimport type { OverridableComponentProps } from '../../types';\n\nexport default interface BackButtonProps extends OverridableComponentProps<Omit<IconButtonProps, 'children'>, {}> {}\n"],"mappings":""}

package/build/module/Toolbar/BackButton/index.js

@@ -0,0 +1,2 @@
+export { default } from './BackButton';
+//# sourceMappingURL=index.js.map

package/build/module/Toolbar/BackButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["default"],"sources":["index.ts"],"sourcesContent":["export { default } from './BackButton';\nexport type { default as BackButtonProps } from './BackButtonProps';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,cAAxB"}

package/build/module/Toolbar/Toolbar.js

@@ -3,6 +3,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 import React from 'react';
 import Row from '../Row';
 import { css, useTheme } from '../styles';
+import BackButton from './BackButton';
 
 const useStyles = function () {
   const theme = useTheme();
@@ -28,7 +29,8 @@ const sizeMap = {
     height: 56
   }
 };
-export default function Toolbar(props) {
+
+const Toolbar = props => {
   const {
     disableGutters = false,
     size = 'medium',
@@ -39,6 +41,8 @@ export default function Toolbar(props) {
   return /*#__PURE__*/React.createElement(Row, _extends({
     style: css([styles.root, !disableGutters ? styles.gutters : undefined, sizeMap[size], style])
   }, otherProps));
-}
-;
+};
+
+Toolbar.BackButton = BackButton;
+export default Toolbar;
 //# sourceMappingURL=Toolbar.js.map

package/build/module/Toolbar/Toolbar.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Row","css","useTheme","useStyles","theme","root","alignItems","flexWrap","gutters","paddingHorizontal","spacing","sizeMap","small","height","medium","large","Toolbar","props","disableGutters","size","style","otherProps","styles","undefined"],"sources":["Toolbar.tsx"],"sourcesContent":["import React from 'react';\nimport type { FountainUiStyle, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Row from '../Row';\nimport { css, useTheme } from '../styles';\nimport type ToolbarProps from './ToolbarProps';\nimport type { ToolbarSize } from './ToolbarProps';\n\ntype ToolbarStyles = NamedStylesStringUnion<'root' | 'gutters'>;\n\nconst useStyles: UseStyles<ToolbarStyles> = function (): ToolbarStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            flexWrap: 'nowrap',\n        },\n        gutters: {\n            paddingHorizontal: theme.spacing(4),\n        },\n    };\n};\n\nconst sizeMap: Record<ToolbarSize, FountainUiStyle> = {\n    small: { height: 48 },\n    medium: { height: 50 },\n    large: { height: 56 },\n};\n\nexport default function Toolbar(props: ToolbarProps) {\n    const {\n        disableGutters = false,\n        size = 'medium',\n        style,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    return (\n        <Row\n            style={css([\n                styles.root,\n                !disableGutters ? styles.gutters : undefined,\n                sizeMap[size],\n                style,\n            ])}\n            {...otherProps}\n        />\n    );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,GAAP,MAAgB,QAAhB;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;;AAMA,MAAMC,SAAmC,GAAG,YAA2B;EACnE,MAAMC,KAAK,GAAGF,QAAQ,EAAtB;EAEA,OAAO;IACHG,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,QAAQ,EAAE;IAFR,CADH;IAKHC,OAAO,EAAE;MACLC,iBAAiB,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IADd;EALN,CAAP;AASH,CAZD;;AAcA,MAAMC,OAA6C,GAAG;EAClDC,KAAK,EAAE;IAAEC,MAAM,EAAE;EAAV,CAD2C;EAElDC,MAAM,EAAE;IAAED,MAAM,EAAE;EAAV,CAF0C;EAGlDE,KAAK,EAAE;IAAEF,MAAM,EAAE;EAAV;AAH2C,CAAtD;AAMA,eAAe,SAASG,OAAT,CAAiBC,KAAjB,EAAsC;EACjD,MAAM;IACFC,cAAc,GAAG,KADf;IAEFC,IAAI,GAAG,QAFL;IAGFC,KAHE;IAIF,GAAGC;EAJD,IAKFJ,KALJ;EAOA,MAAMK,MAAM,GAAGnB,SAAS,EAAxB;EAEA,oBACI,oBAAC,GAAD;IACI,KAAK,EAAEF,GAAG,CAAC,CACPqB,MAAM,CAACjB,IADA,EAEP,CAACa,cAAD,GAAkBI,MAAM,CAACd,OAAzB,GAAmCe,SAF5B,EAGPZ,OAAO,CAACQ,IAAD,CAHA,EAIPC,KAJO,CAAD;EADd,GAOQC,UAPR,EADJ;AAWH;AAAA"}
+{"version":3,"names":["React","Row","css","useTheme","BackButton","useStyles","theme","root","alignItems","flexWrap","gutters","paddingHorizontal","spacing","sizeMap","small","height","medium","large","Toolbar","props","disableGutters","size","style","otherProps","styles","undefined"],"sources":["Toolbar.tsx"],"sourcesContent":["import React from 'react';\nimport type { FountainUiStyle, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Row from '../Row';\nimport { css, useTheme } from '../styles';\nimport BackButton from './BackButton';\nimport type ToolbarProps from './ToolbarProps';\nimport type { ToolbarSize } from './ToolbarProps';\n\ntype ToolbarStyles = NamedStylesStringUnion<'root' | 'gutters'>;\n\nconst useStyles: UseStyles<ToolbarStyles> = function (): ToolbarStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            alignItems: 'center',\n            flexWrap: 'nowrap',\n        },\n        gutters: {\n            paddingHorizontal: theme.spacing(4),\n        },\n    };\n};\n\nconst sizeMap: Record<ToolbarSize, FountainUiStyle> = {\n    small: { height: 48 },\n    medium: { height: 50 },\n    large: { height: 56 },\n};\n\nconst Toolbar = (props: ToolbarProps) => {\n    const {\n        disableGutters = false,\n        size = 'medium',\n        style,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    return (\n        <Row\n            style={css([\n                styles.root,\n                !disableGutters ? styles.gutters : undefined,\n                sizeMap[size],\n                style,\n            ])}\n            {...otherProps}\n        />\n    );\n};\n\nToolbar.BackButton = BackButton;\n\nexport default Toolbar;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,GAAP,MAAgB,QAAhB;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AACA,OAAOC,UAAP,MAAuB,cAAvB;;AAMA,MAAMC,SAAmC,GAAG,YAA2B;EACnE,MAAMC,KAAK,GAAGH,QAAQ,EAAtB;EAEA,OAAO;IACHI,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,QAAQ,EAAE;IAFR,CADH;IAKHC,OAAO,EAAE;MACLC,iBAAiB,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IADd;EALN,CAAP;AASH,CAZD;;AAcA,MAAMC,OAA6C,GAAG;EAClDC,KAAK,EAAE;IAAEC,MAAM,EAAE;EAAV,CAD2C;EAElDC,MAAM,EAAE;IAAED,MAAM,EAAE;EAAV,CAF0C;EAGlDE,KAAK,EAAE;IAAEF,MAAM,EAAE;EAAV;AAH2C,CAAtD;;AAMA,MAAMG,OAAO,GAAIC,KAAD,IAAyB;EACrC,MAAM;IACFC,cAAc,GAAG,KADf;IAEFC,IAAI,GAAG,QAFL;IAGFC,KAHE;IAIF,GAAGC;EAJD,IAKFJ,KALJ;EAOA,MAAMK,MAAM,GAAGnB,SAAS,EAAxB;EAEA,oBACI,oBAAC,GAAD;IACI,KAAK,EAAEH,GAAG,CAAC,CACPsB,MAAM,CAACjB,IADA,EAEP,CAACa,cAAD,GAAkBI,MAAM,CAACd,OAAzB,GAAmCe,SAF5B,EAGPZ,OAAO,CAACQ,IAAD,CAHA,EAIPC,KAJO,CAAD;EADd,GAOQC,UAPR,EADJ;AAWH,CArBD;;AAuBAL,OAAO,CAACd,UAAR,GAAqBA,UAArB;AAEA,eAAec,OAAf"}

package/build/module/Tooltip/Beaks/index.js

@@ -1,2 +1,6 @@
 export { default } from './Beak';
+export { default as HorizontalLargeBeak } from './HorizontalLargeBeak';
+export { default as HorizontalSmallBeak } from './HorizontalSmallBeak';
+export { default as VerticalLargeBeak } from './VerticalLargeBeak';
+export { default as VerticalSmallBeak } from './VerticalSmallBeak';
 //# sourceMappingURL=index.js.map

package/build/module/Tooltip/Beaks/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["default"],"sources":["index.ts"],"sourcesContent":["export { default } from './Beak';\nexport type { default as BeakProps } from './BeakProps';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,QAAxB"}
+{"version":3,"names":["default","HorizontalLargeBeak","HorizontalSmallBeak","VerticalLargeBeak","VerticalSmallBeak"],"sources":["index.ts"],"sourcesContent":["export { default } from './Beak';\nexport type { default as BeakProps } from './BeakProps';\nexport { default as HorizontalLargeBeak } from './HorizontalLargeBeak';\nexport { default as HorizontalSmallBeak } from './HorizontalSmallBeak';\nexport { default as VerticalLargeBeak } from './VerticalLargeBeak';\nexport { default as VerticalSmallBeak } from './VerticalSmallBeak';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,QAAxB;AAEA,SAASA,OAAO,IAAIC,mBAApB,QAA+C,uBAA/C;AACA,SAASD,OAAO,IAAIE,mBAApB,QAA+C,uBAA/C;AACA,SAASF,OAAO,IAAIG,iBAApB,QAA6C,qBAA7C;AACA,SAASH,OAAO,IAAII,iBAApB,QAA6C,qBAA7C"}

package/build/module/Tooltip/Tooltip.js

@@ -1,7 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { Platform, Text, View } from 'react-native';
 import Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
-import { typographyOf } from '@fountain-ui/styles';
 import ButtonBase from '../ButtonBase';
 import { createFontStyle, css, useTheme } from '../styles';
 import Beak from './Beaks';
@@ -50,14 +49,14 @@ const useStyles = function () {
     },
     small: {
       borderRadius: theme.shape.radius.sm,
+      paddingBottom: theme.spacing(1.75),
       paddingHorizontal: theme.spacing(2),
-      paddingVertical: theme.spacing(1.5)
+      paddingTop: theme.spacing(1.5)
     },
     large: {
       borderRadius: 5,
-      paddingBottom: theme.spacing(2.5),
       paddingHorizontal: theme.spacing(4),
-      paddingTop: theme.spacing(2)
+      paddingVertical: theme.spacing(2)
     }
   };
 };
@@ -121,12 +120,7 @@ export default function Tooltip(props) {
     scale.value = withTiming(nextScaleValue, ANIMATION_CONFIG);
   }, [visible]);
   const fontStyle = createFontStyle(theme, {
-    selector: typo => size === 'large' ? typographyOf({
-      fontSize: 13,
-      lineHeight: 19.5,
-      fontFamily: 'Pretendard-Regular',
-      letterSpacing: 0
-    }) : typo.caption2.regular,
+    selector: typo => size === 'large' ? typo.body3.regular : typo.caption2.regular,
     color: theme.palette.text.strongInverse
   });
   const textStyle = css([fontStyle, {

package/build/module/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useState","Platform","Text","View","Animated","useAnimatedStyle","useSharedValue","withTiming","typographyOf","ButtonBase","createFontStyle","css","useTheme","Beak","DEFAULT_BEAK_LAYOUT","offset","placement","INITIAL_LAYOUT","width","height","x","y","ANIMATION_CONFIG","duration","getFlexDirection","useStyles","theme","root","position","zIndex","tooltip","content","backgroundColor","palette","fill","base","paddingHorizontal","spacing","paddingVertical","small","borderRadius","shape","radius","sm","large","paddingBottom","paddingTop","Tooltip","props","beakLayout","children","initialLayout","left","onClose","right","numberOfTitleLines","size","style","title","tooltipStyle","verticalOffset","visible","beakOffset","beakPlacement","styles","layout","setLayout","scale","animatedStyle","transform","value","flexDirection","isVerticalPlacement","totalOffset","tooltipLayoutStyle","alignItems","undefined","overflow","select","web","display","default","contentStyle","flexGrow","flexShrink","nextScaleValue","fontStyle","selector","typo","fontSize","lineHeight","fontFamily","letterSpacing","caption2","regular","color","text","strongInverse","textStyle","beakStyle","translateX","translateY","buttonElem","beakElem","event","nativeEvent"],"sources":["Tooltip.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Platform, Text, View, ViewProps } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type TooltipProps from './TooltipProps';\nimport type { TooltipBeakLayout, TooltipPlacement, TooltipSize } from './TooltipProps';\nimport Beak from './Beaks';\n\nconst DEFAULT_BEAK_LAYOUT: TooltipBeakLayout = {\n    offset: 0,\n    placement: 'middle',\n};\n\nconst INITIAL_LAYOUT = { width: 0, height: 0, x: 0, y: 0 };\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 150 };\n\ntype FlexDirection = 'row' | 'column' | 'row-reverse' | 'column-reverse';\n\nconst getFlexDirection = (placement: TooltipPlacement): FlexDirection => {\n    switch (placement) {\n        case 'right':\n            return 'row-reverse';\n        case 'bottom':\n            return 'column-reverse';\n        case 'left':\n            return 'row';\n        case 'top':\n        default:\n            return 'column';\n    }\n};\n\ntype TooltipStyles = NamedStylesStringUnion<'root' | 'content' | 'small' | 'large'>;\n\nconst useStyles: UseStyles<TooltipStyles> = function (): TooltipStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            position: 'absolute',\n            zIndex: theme.zIndex.tooltip,\n        },\n        content: {\n            backgroundColor: theme.palette.fill.base,\n            paddingHorizontal: theme.spacing(2),\n            paddingVertical: theme.spacing(1.5),\n        },\n        small: {\n            borderRadius: theme.shape.radius.sm,\n            paddingHorizontal: theme.spacing(2),\n            paddingVertical: theme.spacing(1.5),\n        },\n        large: {\n            borderRadius: 5,\n            paddingBottom: theme.spacing(2.5),\n            paddingHorizontal: theme.spacing(4),\n            paddingTop: theme.spacing(2),\n        },\n    };\n};\n\nexport default function Tooltip(props: TooltipProps) {\n    const {\n        beakLayout = DEFAULT_BEAK_LAYOUT,\n        children,\n        initialLayout = INITIAL_LAYOUT,\n        left,\n        onClose,\n        placement = 'top' as TooltipPlacement,\n        right,\n        numberOfTitleLines = 1,\n        size = 'small' as TooltipSize,\n        style,\n        title,\n        tooltipStyle,\n        verticalOffset = 4,\n        visible = false,\n    } = props;\n\n    const {\n        offset: beakOffset,\n        placement: beakPlacement,\n    } = beakLayout;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const [layout, setLayout] = useState(initialLayout);\n\n    const scale = useSharedValue(0);\n\n    const animatedStyle = useAnimatedStyle(() => ({\n        transform: [{ scale: scale.value }],\n    }), []);\n\n    const flexDirection = getFlexDirection(placement);\n\n    const isVerticalPlacement = placement === 'top' || placement === 'bottom';\n\n    const totalOffset = -((isVerticalPlacement ? layout.height : layout.width) + verticalOffset);\n    const tooltipLayoutStyle: ViewProps['style'] = {\n        alignItems: beakPlacement === 'start'\n            ? 'flex-start'\n            : beakPlacement === 'end'\n                ? 'flex-end'\n                : 'center',\n        flexDirection,\n        left,\n        right,\n        height: visible ? undefined : 0,\n        overflow: visible ? undefined : 'hidden',\n        ...Platform.select({\n            web: {\n                display: visible ? 'flex' : 'none',\n            },\n            default: {},\n        }),\n        [placement]: totalOffset,\n    };\n\n    const contentStyle = css([\n        styles.content,\n        styles[size],\n        isVerticalPlacement\n            ? { width: '100%' }\n            : { flexGrow: 1, flexShrink: 1 },\n    ]);\n\n    useEffect(() => {\n        const nextScaleValue = visible ? 1 : 0;\n\n        scale.value = withTiming(nextScaleValue, ANIMATION_CONFIG);\n    }, [visible]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => size === 'large'\n            ? typographyOf({\n                fontSize: 13,\n                lineHeight: 19.5,\n                fontFamily: 'Pretendard-Regular',\n                letterSpacing: 0,\n            })\n            : typo.caption2.regular,\n        color: theme.palette.text.strongInverse,\n    });\n\n    const textStyle = css([\n        fontStyle,\n        { flexShrink: 1 },\n    ]);\n\n    const beakStyle = css({\n        transform: [isVerticalPlacement ? { translateX: beakOffset } : { translateY: beakOffset }],\n    });\n\n    const buttonElem = (\n        <ButtonBase\n            pressEffect={'none'}\n            onPress={onClose}\n            style={contentStyle}\n        >\n            <Text\n                // TODO: Should we provide text prop customization?\n                numberOfLines={numberOfTitleLines}\n                style={textStyle}\n            >\n                {title}\n            </Text>\n        </ButtonBase>\n    );\n\n    const beakElem = (\n        <View style={beakStyle}>\n            <Beak\n                fill={theme.palette.fill.base}\n                placement={placement}\n                size={size}\n            />\n        </View>\n    );\n\n    return (\n        <View style={style}>\n            {children}\n\n            <Animated.View\n                onLayout={(event) => {\n                    if (event.nativeEvent.layout.height === 0) {\n                        return;\n                    }\n\n                    setLayout(event.nativeEvent.layout);\n                }}\n                style={[\n                    styles.root,\n                    animatedStyle,\n                    tooltipLayoutStyle,\n                    tooltipStyle,\n                ]}\n            >\n                {buttonElem}\n\n                {beakElem}\n            </Animated.View>\n        </View>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["React","useEffect","useState","Platform","Text","View","Animated","useAnimatedStyle","useSharedValue","withTiming","ButtonBase","createFontStyle","css","useTheme","Beak","DEFAULT_BEAK_LAYOUT","offset","placement","INITIAL_LAYOUT","width","height","x","y","ANIMATION_CONFIG","duration","getFlexDirection","useStyles","theme","root","position","zIndex","tooltip","content","backgroundColor","palette","fill","base","paddingHorizontal","spacing","paddingVertical","small","borderRadius","shape","radius","sm","paddingBottom","paddingTop","large","Tooltip","props","beakLayout","children","initialLayout","left","onClose","right","numberOfTitleLines","size","style","title","tooltipStyle","verticalOffset","visible","beakOffset","beakPlacement","styles","layout","setLayout","scale","animatedStyle","transform","value","flexDirection","isVerticalPlacement","totalOffset","tooltipLayoutStyle","alignItems","undefined","overflow","select","web","display","default","contentStyle","flexGrow","flexShrink","nextScaleValue","fontStyle","selector","typo","body3","regular","caption2","color","text","strongInverse","textStyle","beakStyle","translateX","translateY","buttonElem","beakElem","event","nativeEvent"],"sources":["Tooltip.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Platform, Text, View, ViewProps } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type TooltipProps from './TooltipProps';\nimport type { TooltipBeakLayout, TooltipPlacement, TooltipSize } from './TooltipProps';\nimport Beak from './Beaks';\n\nconst DEFAULT_BEAK_LAYOUT: TooltipBeakLayout = {\n    offset: 0,\n    placement: 'middle',\n};\n\nconst INITIAL_LAYOUT = { width: 0, height: 0, x: 0, y: 0 };\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 150 };\n\ntype FlexDirection = 'row' | 'column' | 'row-reverse' | 'column-reverse';\n\nconst getFlexDirection = (placement: TooltipPlacement): FlexDirection => {\n    switch (placement) {\n        case 'right':\n            return 'row-reverse';\n        case 'bottom':\n            return 'column-reverse';\n        case 'left':\n            return 'row';\n        case 'top':\n        default:\n            return 'column';\n    }\n};\n\ntype TooltipStyles = NamedStylesStringUnion<'root' | 'content' | 'small' | 'large'>;\n\nconst useStyles: UseStyles<TooltipStyles> = function (): TooltipStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            position: 'absolute',\n            zIndex: theme.zIndex.tooltip,\n        },\n        content: {\n            backgroundColor: theme.palette.fill.base,\n            paddingHorizontal: theme.spacing(2),\n            paddingVertical: theme.spacing(1.5),\n        },\n        small: {\n            borderRadius: theme.shape.radius.sm,\n            paddingBottom: theme.spacing(1.75),\n            paddingHorizontal: theme.spacing(2),\n            paddingTop: theme.spacing(1.5),\n        },\n        large: {\n            borderRadius: 5,\n            paddingHorizontal: theme.spacing(4),\n            paddingVertical: theme.spacing(2),\n        },\n    };\n};\n\nexport default function Tooltip(props: TooltipProps) {\n    const {\n        beakLayout = DEFAULT_BEAK_LAYOUT,\n        children,\n        initialLayout = INITIAL_LAYOUT,\n        left,\n        onClose,\n        placement = 'top' as TooltipPlacement,\n        right,\n        numberOfTitleLines = 1,\n        size = 'small' as TooltipSize,\n        style,\n        title,\n        tooltipStyle,\n        verticalOffset = 4,\n        visible = false,\n    } = props;\n\n    const {\n        offset: beakOffset,\n        placement: beakPlacement,\n    } = beakLayout;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const [layout, setLayout] = useState(initialLayout);\n\n    const scale = useSharedValue(0);\n\n    const animatedStyle = useAnimatedStyle(() => ({\n        transform: [{ scale: scale.value }],\n    }), []);\n\n    const flexDirection = getFlexDirection(placement);\n\n    const isVerticalPlacement = placement === 'top' || placement === 'bottom';\n\n    const totalOffset = -((isVerticalPlacement ? layout.height : layout.width) + verticalOffset);\n    const tooltipLayoutStyle: ViewProps['style'] = {\n        alignItems: beakPlacement === 'start'\n            ? 'flex-start'\n            : beakPlacement === 'end'\n                ? 'flex-end'\n                : 'center',\n        flexDirection,\n        left,\n        right,\n        height: visible ? undefined : 0,\n        overflow: visible ? undefined : 'hidden',\n        ...Platform.select({\n            web: {\n                display: visible ? 'flex' : 'none',\n            },\n            default: {},\n        }),\n        [placement]: totalOffset,\n    };\n\n    const contentStyle = css([\n        styles.content,\n        styles[size],\n        isVerticalPlacement\n            ? { width: '100%' }\n            : { flexGrow: 1, flexShrink: 1 },\n    ]);\n\n    useEffect(() => {\n        const nextScaleValue = visible ? 1 : 0;\n\n        scale.value = withTiming(nextScaleValue, ANIMATION_CONFIG);\n    }, [visible]);\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typo) => size === 'large'\n            ? typo.body3.regular\n            : typo.caption2.regular,\n        color: theme.palette.text.strongInverse,\n    });\n\n    const textStyle = css([\n        fontStyle,\n        { flexShrink: 1 },\n    ]);\n\n    const beakStyle = css({\n        transform: [isVerticalPlacement ? { translateX: beakOffset } : { translateY: beakOffset }],\n    });\n\n    const buttonElem = (\n        <ButtonBase\n            pressEffect={'none'}\n            onPress={onClose}\n            style={contentStyle}\n        >\n            <Text\n                // TODO: Should we provide text prop customization?\n                numberOfLines={numberOfTitleLines}\n                style={textStyle}\n            >\n                {title}\n            </Text>\n        </ButtonBase>\n    );\n\n    const beakElem = (\n        <View style={beakStyle}>\n            <Beak\n                fill={theme.palette.fill.base}\n                placement={placement}\n                size={size}\n            />\n        </View>\n    );\n\n    return (\n        <View style={style}>\n            {children}\n\n            <Animated.View\n                onLayout={(event) => {\n                    if (event.nativeEvent.layout.height === 0) {\n                        return;\n                    }\n\n                    setLayout(event.nativeEvent.layout);\n                }}\n                style={[\n                    styles.root,\n                    animatedStyle,\n                    tooltipLayoutStyle,\n                    tooltipStyle,\n                ]}\n            >\n                {buttonElem}\n\n                {beakElem}\n            </Animated.View>\n        </View>\n    );\n};\n"],"mappings":"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"}

package/build/module/Tooltip/index.js

@@ -1,3 +1,4 @@
 export { default } from './Tooltip';
 export { tooltipBeakPlacements, tooltipPlacements, tooltipSizes } from './TooltipProps';
+export * from './Beaks';
 //# sourceMappingURL=index.js.map

package/build/module/Tooltip/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["default","tooltipBeakPlacements","tooltipPlacements","tooltipSizes"],"sources":["index.ts"],"sourcesContent":["export { default } from './Tooltip';\nexport type { default as TooltipProps, TooltipBeakLayout, TooltipBeakPlacement } from './TooltipProps';\nexport { tooltipBeakPlacements, tooltipPlacements, tooltipSizes } from './TooltipProps';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,WAAxB;AAEA,SAASC,qBAAT,EAAgCC,iBAAhC,EAAmDC,YAAnD,QAAuE,gBAAvE"}
+{"version":3,"names":["default","tooltipBeakPlacements","tooltipPlacements","tooltipSizes"],"sources":["index.ts"],"sourcesContent":["export { default } from './Tooltip';\nexport type { default as TooltipProps, TooltipBeakLayout, TooltipBeakPlacement } from './TooltipProps';\nexport { tooltipBeakPlacements, tooltipPlacements, tooltipSizes } from './TooltipProps';\nexport * from './Beaks';\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,WAAxB;AAEA,SAASC,qBAAT,EAAgCC,iBAAhC,EAAmDC,YAAnD,QAAuE,gBAAvE;AACA,cAAc,SAAd"}

package/build/module/Typography/Typography.js

@@ -42,6 +42,7 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(props, ref)
     color: colorProp = 'inherit',
     ellipsizeMode = 'tail',
     href,
+    lineHeight,
     numberOfLines,
     onPress,
     selectable,
@@ -53,7 +54,11 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(props, ref)
   } = props;
   const theme = useTheme();
   const fontStyle = createFontStyle(theme, {
-    selector: typography => typography[variant][weight],
+    selector: typography => {
+      var _typography$variant;
+
+      return (_typography$variant = typography[variant]) === null || _typography$variant === void 0 ? void 0 : _typography$variant[weight];
+    },
     color: selectColor(theme, colorProp)
   }); // To prevent white-space: pre, word-wrap:break-word style conflicting issue at safari browser.
 
@@ -62,7 +67,9 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(props, ref)
   } : {};
   const textStyle = css([styles.root, {
     textAlign: align === 'inherit' ? 'auto' : align
-  }, textWrapStyle, fontStyle, style]);
+  }, textWrapStyle, fontStyle, lineHeight ? {
+    lineHeight
+  } : undefined, style]);
   const accessibility = accessibilityMap[variant];
   const variantRole = href !== undefined ? 'link' : accessibility === null || accessibility === void 0 ? void 0 : accessibility.accessibilityRole;
   const variantLevel = accessibility === null || accessibility === void 0 ? void 0 : accessibility['area-level'];

package/build/module/Typography/Typography.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Platform","Text","createFontStyle","css","StyleSheet","useTheme","accessibilityMap","selectColor","theme","colorProp","OS","undefined","palette","text","styles","create","root","flexShrink","maxWidth","Typography","forwardRef","props","ref","accessibilityRole","align","ariaLevel","disableFontScaling","children","color","ellipsizeMode","href","numberOfLines","onPress","selectable","style","variant","weight","onLayout","onTextLayout","fontStyle","selector","typography","textWrapStyle","wordWrap","textStyle","textAlign","accessibility","variantRole","variantLevel","memo"],"sources":["Typography.tsx"],"sourcesContent":["import React from 'react';\nimport type { TextProps, TextStyle } from 'react-native';\nimport { Platform, Text } from 'react-native';\nimport type { FontVariant, FontWeight, Theme } from '@fountain-ui/styles';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport type TypographyProps from './TypographyProps';\nimport type { AccessibilityMap, TypographyAlign, TypographyColor } from './TypographyProps';\n\nconst accessibilityMap: AccessibilityMap = {\n    // TODO: set accessibilityRole.\n    // h1: { accessibilityRole: 'header', 'aria-level': 1 },\n    // h2: { accessibilityRole: 'header', 'aria-level': 2 },\n    // h3: { accessibilityRole: 'header', 'aria-level': 3 },\n    // subtitle1: { accessibilityRole: 'header', 'aria-level': 6 },\n    // subtitle2: { accessibilityRole: 'header', 'aria-level': 6 },\n    // body1: { accessibilityRole: 'text' },\n    // body2: { accessibilityRole: 'text' },\n    // caption1: { accessibilityRole: 'text' },\n    // caption2: { accessibilityRole: 'text' },\n    // flag: { accessibilityRole: 'text' },\n};\n\nfunction selectColor(theme: Theme, colorProp: TypographyColor): string | undefined {\n    switch (colorProp) {\n        case 'inherit':\n            return Platform.OS === 'web' ? 'inherit' : undefined;\n        default:\n            return theme.palette.text[colorProp];\n    }\n}\n\nconst styles = StyleSheet.create({\n    root: {\n        flexShrink: 1,\n        ...(Platform.OS === 'web' ? { maxWidth: '100%' } : {}),\n    },\n});\n\nconst Typography = React.forwardRef<Text, TypographyProps>(function Typography(props, ref) {\n    const {\n        accessibilityRole,\n        align = 'inherit' as TypographyAlign,\n        ariaLevel,\n        disableFontScaling = false,\n        children,\n        color: colorProp = 'inherit' as TypographyColor,\n        ellipsizeMode = 'tail' as TextProps['ellipsizeMode'],\n        href,\n        numberOfLines,\n        onPress,\n        selectable,\n        style,\n        variant = 'body1' as FontVariant,\n        weight = 'medium' as FontWeight,\n        onLayout,\n        onTextLayout,\n    } = props;\n\n    const theme = useTheme();\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typography) => typography[variant][weight],\n        color: selectColor(theme, colorProp),\n    });\n\n    // To prevent white-space: pre, word-wrap:break-word style conflicting issue at safari browser.\n    const textWrapStyle = numberOfLines && numberOfLines > 0 && Platform.OS === 'web' ? { wordWrap: 'normal' } : {};\n\n    const textStyle = css([\n        styles.root,\n        { textAlign: align === 'inherit' ? 'auto' : align },\n        textWrapStyle as TextStyle,\n        fontStyle,\n        style,\n    ]);\n\n    const accessibility = accessibilityMap[variant];\n    const variantRole = href !== undefined ? 'link' : accessibility?.accessibilityRole;\n    const variantLevel = accessibility?.['area-level'];\n\n    return (\n        <Text\n            ref={ref}\n            accessibilityRole={accessibilityRole || variantRole}\n            allowFontScaling={!disableFontScaling}\n            aria-level={ariaLevel || variantLevel}\n            children={children}\n            ellipsizeMode={ellipsizeMode}\n            // @ts-ignore\n            href={href}\n            numberOfLines={numberOfLines}\n            onPress={onPress}\n            selectable={selectable}\n            style={textStyle}\n            onLayout={onLayout}\n            onTextLayout={onTextLayout}\n        />\n    );\n});\n\nexport default React.memo(Typography);\n"],"mappings":"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"}
+{"version":3,"names":["React","Platform","Text","createFontStyle","css","StyleSheet","useTheme","accessibilityMap","selectColor","theme","colorProp","OS","undefined","palette","text","styles","create","root","flexShrink","maxWidth","Typography","forwardRef","props","ref","accessibilityRole","align","ariaLevel","disableFontScaling","children","color","ellipsizeMode","href","lineHeight","numberOfLines","onPress","selectable","style","variant","weight","onLayout","onTextLayout","fontStyle","selector","typography","textWrapStyle","wordWrap","textStyle","textAlign","accessibility","variantRole","variantLevel","memo"],"sources":["Typography.tsx"],"sourcesContent":["import React from 'react';\nimport type { TextProps, TextStyle } from 'react-native';\nimport { Platform, Text } from 'react-native';\nimport type { FontVariant, FontWeight, Theme } from '@fountain-ui/styles';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport type TypographyProps from './TypographyProps';\nimport type { AccessibilityMap, TypographyAlign, TypographyColor } from './TypographyProps';\n\nconst accessibilityMap: AccessibilityMap = {\n    // TODO: set accessibilityRole.\n    // h1: { accessibilityRole: 'header', 'aria-level': 1 },\n    // h2: { accessibilityRole: 'header', 'aria-level': 2 },\n    // h3: { accessibilityRole: 'header', 'aria-level': 3 },\n    // subtitle1: { accessibilityRole: 'header', 'aria-level': 6 },\n    // subtitle2: { accessibilityRole: 'header', 'aria-level': 6 },\n    // body1: { accessibilityRole: 'text' },\n    // body2: { accessibilityRole: 'text' },\n    // caption1: { accessibilityRole: 'text' },\n    // caption2: { accessibilityRole: 'text' },\n    // flag: { accessibilityRole: 'text' },\n};\n\nfunction selectColor(theme: Theme, colorProp: TypographyColor): string | undefined {\n    switch (colorProp) {\n        case 'inherit':\n            return Platform.OS === 'web' ? 'inherit' : undefined;\n        default:\n            return theme.palette.text[colorProp];\n    }\n}\n\nconst styles = StyleSheet.create({\n    root: {\n        flexShrink: 1,\n        ...(Platform.OS === 'web' ? { maxWidth: '100%' } : {}),\n    },\n});\n\nconst Typography = React.forwardRef<Text, TypographyProps>(function Typography(props, ref) {\n    const {\n        accessibilityRole,\n        align = 'inherit' as TypographyAlign,\n        ariaLevel,\n        disableFontScaling = false,\n        children,\n        color: colorProp = 'inherit' as TypographyColor,\n        ellipsizeMode = 'tail' as TextProps['ellipsizeMode'],\n        href,\n        lineHeight,\n        numberOfLines,\n        onPress,\n        selectable,\n        style,\n        variant = 'body1' as FontVariant,\n        weight = 'medium' as FontWeight,\n        onLayout,\n        onTextLayout,\n    } = props;\n\n    const theme = useTheme();\n\n    const fontStyle = createFontStyle(theme, {\n        selector: (typography) => typography[variant]?.[weight],\n        color: selectColor(theme, colorProp),\n    });\n\n    // To prevent white-space: pre, word-wrap:break-word style conflicting issue at safari browser.\n    const textWrapStyle = numberOfLines && numberOfLines > 0 && Platform.OS === 'web' ? { wordWrap: 'normal' } : {};\n\n    const textStyle = css([\n        styles.root,\n        { textAlign: align === 'inherit' ? 'auto' : align },\n        textWrapStyle as TextStyle,\n        fontStyle,\n        lineHeight ? { lineHeight } : undefined,\n        style,\n    ]);\n\n    const accessibility = accessibilityMap[variant];\n    const variantRole = href !== undefined ? 'link' : accessibility?.accessibilityRole;\n    const variantLevel = accessibility?.['area-level'];\n\n    return (\n        <Text\n            ref={ref}\n            accessibilityRole={accessibilityRole || variantRole}\n            allowFontScaling={!disableFontScaling}\n            aria-level={ariaLevel || variantLevel}\n            children={children}\n            ellipsizeMode={ellipsizeMode}\n            // @ts-ignore\n            href={href}\n            numberOfLines={numberOfLines}\n            onPress={onPress}\n            selectable={selectable}\n            style={textStyle}\n            onLayout={onLayout}\n            onTextLayout={onTextLayout}\n        />\n    );\n});\n\nexport default React.memo(Typography);\n"],"mappings":"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"}

package/build/module/Typography/TypographyProps.js.map

@@ -1 +1 @@
-{"version":3,"names":["typographyColors"],"sources":["TypographyProps.ts"],"sourcesContent":["import React from 'react';\nimport type { AccessibilityProps, TextProps, TextStyle } from 'react-native';\nimport type { FontVariant, FontWeight } from '@fountain-ui/styles';\nimport type { ComponentProps } from '../types';\n\nexport type TypographyAlign = 'inherit' | TextStyle['textAlign'];\n\nexport const typographyColors = [\n    'inherit',\n    'accent',\n    'accentAlt',\n    'strong',\n    'strongInverse',\n    'base',\n    'baseInverse',\n    'baseOpacity',\n    'baseOpacityInverse',\n    'weak',\n    'weakOpacity',\n    'weakInverse',\n    'weakOpacityInverse',\n] as const;\n\nexport type TypographyColor = typeof typographyColors[number];\n\nexport interface Accessibility {\n    accessibilityRole: AccessibilityProps['accessibilityRole'];\n    'area-level'?: number;\n}\n\nexport type AccessibilityMap = Partial<Record<FontVariant, Accessibility>>;\n\nexport default interface TypographyProps extends ComponentProps<{\n    /**\n     * Applies HTML tag at web and communicates purpose of component at app\n     */\n    accessibilityRole?: AccessibilityProps['accessibilityRole'];\n\n    /**\n     * Set the text-align on the component.\n     * The value 'justify' is not supported on Android and fallbacks to left.\n     * @default 'inherit'\n     */\n    align?: TypographyAlign;\n\n    /**\n     * Applies HTML heading level\n     */\n    ariaLevel?: number;\n\n    /**\n     * Specifies whether fonts should scale to respect Text Size accessibility settings.\n     * @default false\n     */\n    disableFontScaling?: boolean;\n\n    /**\n     * The content of the component.\n     */\n    children?: React.ReactNode;\n\n    /**\n     * The color of the component. It supports those theme colors that make sense for this component.\n     * @default 'inherit'\n     */\n    color?: TypographyColor;\n\n    /**\n     * The text ellipsis mode.\n     * @default 'tail'\n     */\n    ellipsizeMode?: TextProps['ellipsizeMode'];\n\n    /**\n     * Internal use only. The hyperlink of the text.\n     */\n    href?: string;\n\n    /**\n     * Used to truncate the text with an ellipsis after computing the text\n     * layout, including line wrapping, such that the total number of lines\n     * does not exceed this number.\n     */\n    numberOfLines?: TextProps['numberOfLines'];\n\n    /**\n     * Lets the user select text, to use the native copy and paste functionality.\n     */\n    onPress?: TextProps['onPress'];\n\n    /**\n     * Lets the user select text, to use the native copy and paste functionality.\n     */\n    selectable?: boolean;\n\n    /**\n     * Applies the theme typography styles.\n     * @default 'body1'\n     */\n    variant?: FontVariant;\n\n    /**\n     * Determines the font weight.\n     * @default 'medium'\n     */\n    weight?: FontWeight;\n\n    /**\n     * Callback that is called when the text layout has been calculated.\n     */\n    onTextLayout?: TextProps['onTextLayout'];\n\n    /**\n     * Callback that is called when the layout of the Text component changes.\n     */\n    onLayout?: TextProps['onLayout'];\n}> {}\n"],"mappings":"AAOA,OAAO,MAAMA,gBAAgB,GAAG,CAC5B,SAD4B,EAE5B,QAF4B,EAG5B,WAH4B,EAI5B,QAJ4B,EAK5B,eAL4B,EAM5B,MAN4B,EAO5B,aAP4B,EAQ5B,aAR4B,EAS5B,oBAT4B,EAU5B,MAV4B,EAW5B,aAX4B,EAY5B,aAZ4B,EAa5B,oBAb4B,CAAzB"}
+{"version":3,"names":["typographyColors"],"sources":["TypographyProps.ts"],"sourcesContent":["import React from 'react';\nimport type { AccessibilityProps, TextProps, TextStyle } from 'react-native';\nimport type { FontVariant, FontWeight } from '@fountain-ui/styles';\nimport type { ComponentProps } from '../types';\n\nexport type TypographyAlign = 'inherit' | TextStyle['textAlign'];\n\nexport const typographyColors = [\n    'inherit',\n    'accent',\n    'accentAlt',\n    'strong',\n    'strongInverse',\n    'base',\n    'baseInverse',\n    'baseOpacity',\n    'baseOpacityInverse',\n    'weak',\n    'weakOpacity',\n    'weakInverse',\n    'weakOpacityInverse',\n] as const;\n\nexport type TypographyColor = typeof typographyColors[number];\n\nexport interface Accessibility {\n    accessibilityRole: AccessibilityProps['accessibilityRole'];\n    'area-level'?: number;\n}\n\nexport type AccessibilityMap = Partial<Record<FontVariant, Accessibility>>;\n\nexport default interface TypographyProps extends ComponentProps<{\n    /**\n     * Applies HTML tag at web and communicates purpose of component at app\n     */\n    accessibilityRole?: AccessibilityProps['accessibilityRole'];\n\n    /**\n     * Set the text-align on the component.\n     * The value 'justify' is not supported on Android and fallbacks to left.\n     * @default 'inherit'\n     */\n    align?: TypographyAlign;\n\n    /**\n     * Applies HTML heading level\n     */\n    ariaLevel?: number;\n\n    /**\n     * Specifies whether fonts should scale to respect Text Size accessibility settings.\n     * @default false\n     */\n    disableFontScaling?: boolean;\n\n    /**\n     * The content of the component.\n     */\n    children?: React.ReactNode;\n\n    /**\n     * The color of the component. It supports those theme colors that make sense for this component.\n     * @default 'inherit'\n     */\n    color?: TypographyColor;\n\n    /**\n     * The text ellipsis mode.\n     * @default 'tail'\n     */\n    ellipsizeMode?: TextProps['ellipsizeMode'];\n\n    /**\n     * Internal use only. The hyperlink of the text.\n     */\n    href?: string;\n\n    /**\n     * Defines the vertical spacing between lines of text.\n     */\n    lineHeight?: TextStyle['lineHeight'];\n\n    /**\n     * Used to truncate the text with an ellipsis after computing the text\n     * layout, including line wrapping, such that the total number of lines\n     * does not exceed this number.\n     */\n    numberOfLines?: TextProps['numberOfLines'];\n\n    /**\n     * Lets the user select text, to use the native copy and paste functionality.\n     */\n    onPress?: TextProps['onPress'];\n\n    /**\n     * Lets the user select text, to use the native copy and paste functionality.\n     */\n    selectable?: boolean;\n\n    /**\n     * Applies the theme typography styles.\n     * @default 'body1'\n     */\n    variant?: FontVariant;\n\n    /**\n     * Determines the font weight.\n     * @default 'medium'\n     */\n    weight?: FontWeight;\n\n    /**\n     * Callback that is called when the text layout has been calculated.\n     */\n    onTextLayout?: TextProps['onTextLayout'];\n\n    /**\n     * Callback that is called when the layout of the Text component changes.\n     */\n    onLayout?: TextProps['onLayout'];\n}> {}\n"],"mappings":"AAOA,OAAO,MAAMA,gBAAgB,GAAG,CAC5B,SAD4B,EAE5B,QAF4B,EAG5B,WAH4B,EAI5B,QAJ4B,EAK5B,eAL4B,EAM5B,MAN4B,EAO5B,aAP4B,EAQ5B,aAR4B,EAS5B,oBAT4B,EAU5B,MAV4B,EAW5B,aAX4B,EAY5B,aAZ4B,EAa5B,oBAb4B,CAAzB"}

package/build/module/hooks/useBreakpointUp.js

@@ -6,9 +6,12 @@ export default function useBreakpointUp(target, yes, no) {
 
   const isUp = useMemo(() => {
     switch (target) {
-      case 'xs':
+      case 'xxs':
         return true;
 
+      case 'xs':
+        return current === 'xs' || current === 'sm' || current === 'md' || current === 'lg';
+
       case 'sm':
         return current === 'sm' || current === 'md' || current === 'lg';
 

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

@@ -1 +1 @@
-{"version":3,"names":["useMemo","useTheme","useBreakpointUp","target","yes","no","theme","current","breakpoints","isUp"],"sources":["useBreakpointUp.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { Theme } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\n\ntype Breakpoint = keyof Theme['breakpoints']['values'];\n\nexport default function useBreakpointUp<R>(target: Breakpoint, yes: R, no: R): R {\n    const theme = useTheme();\n\n    const current = theme.breakpoints.current;\n\n    // TODO: Needs to refactor\n    const isUp = useMemo<boolean>(() => {\n        switch (target) {\n            case 'xs':\n                return true;\n            case 'sm':\n                return current === 'sm' || current === 'md' || current === 'lg';\n            case 'md':\n                return current === 'md' || current === 'lg';\n            case 'lg':\n                return current === 'lg';\n        }\n    }, [target, current]);\n\n    return isUp ? yes : no;\n};\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,OAAxB;AAEA,SAASC,QAAT,QAAyB,WAAzB;AAIA,eAAe,SAASC,eAAT,CAA4BC,MAA5B,EAAgDC,GAAhD,EAAwDC,EAAxD,EAAkE;EAC7E,MAAMC,KAAK,GAAGL,QAAQ,EAAtB;EAEA,MAAMM,OAAO,GAAGD,KAAK,CAACE,WAAN,CAAkBD,OAAlC,CAH6E,CAK7E;;EACA,MAAME,IAAI,GAAGT,OAAO,CAAU,MAAM;IAChC,QAAQG,MAAR;MACI,KAAK,IAAL;QACI,OAAO,IAAP;;MACJ,KAAK,IAAL;QACI,OAAOI,OAAO,KAAK,IAAZ,IAAoBA,OAAO,KAAK,IAAhC,IAAwCA,OAAO,KAAK,IAA3D;;MACJ,KAAK,IAAL;QACI,OAAOA,OAAO,KAAK,IAAZ,IAAoBA,OAAO,KAAK,IAAvC;;MACJ,KAAK,IAAL;QACI,OAAOA,OAAO,KAAK,IAAnB;IARR;EAUH,CAXmB,EAWjB,CAACJ,MAAD,EAASI,OAAT,CAXiB,CAApB;EAaA,OAAOE,IAAI,GAAGL,GAAH,GAASC,EAApB;AACH;AAAA"}
+{"version":3,"names":["useMemo","useTheme","useBreakpointUp","target","yes","no","theme","current","breakpoints","isUp"],"sources":["useBreakpointUp.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { Theme } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\n\ntype Breakpoint = keyof Theme['breakpoints']['values'];\n\nexport default function useBreakpointUp<R>(target: Breakpoint, yes: R, no: R): R {\n    const theme = useTheme();\n\n    const current = theme.breakpoints.current;\n\n    // TODO: Needs to refactor\n    const isUp = useMemo<boolean>(() => {\n        switch (target) {\n            case 'xxs':\n                return true;\n            case 'xs':\n                return current === 'xs' || current === 'sm' || current === 'md' || current === 'lg';\n            case 'sm':\n                return current === 'sm' || current === 'md' || current === 'lg';\n            case 'md':\n                return current === 'md' || current === 'lg';\n            case 'lg':\n                return current === 'lg';\n        }\n    }, [target, current]);\n\n    return isUp ? yes : no;\n};\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,OAAxB;AAEA,SAASC,QAAT,QAAyB,WAAzB;AAIA,eAAe,SAASC,eAAT,CAA4BC,MAA5B,EAAgDC,GAAhD,EAAwDC,EAAxD,EAAkE;EAC7E,MAAMC,KAAK,GAAGL,QAAQ,EAAtB;EAEA,MAAMM,OAAO,GAAGD,KAAK,CAACE,WAAN,CAAkBD,OAAlC,CAH6E,CAK7E;;EACA,MAAME,IAAI,GAAGT,OAAO,CAAU,MAAM;IAChC,QAAQG,MAAR;MACI,KAAK,KAAL;QACI,OAAO,IAAP;;MACJ,KAAK,IAAL;QACI,OAAOI,OAAO,KAAK,IAAZ,IAAoBA,OAAO,KAAK,IAAhC,IAAwCA,OAAO,KAAK,IAApD,IAA4DA,OAAO,KAAK,IAA/E;;MACJ,KAAK,IAAL;QACI,OAAOA,OAAO,KAAK,IAAZ,IAAoBA,OAAO,KAAK,IAAhC,IAAwCA,OAAO,KAAK,IAA3D;;MACJ,KAAK,IAAL;QACI,OAAOA,OAAO,KAAK,IAAZ,IAAoBA,OAAO,KAAK,IAAvC;;MACJ,KAAK,IAAL;QACI,OAAOA,OAAO,KAAK,IAAnB;IAVR;EAYH,CAbmB,EAajB,CAACJ,MAAD,EAASI,OAAT,CAbiB,CAApB;EAeA,OAAOE,IAAI,GAAGL,GAAH,GAASC,EAApB;AACH;AAAA"}

package/build/module/hooks/useCollapsibleAppBar.js

@@ -1,13 +1,11 @@
 import { useCallback, useRef, useState } from 'react';
-import { Keyboard, Platform, StyleSheet } from 'react-native';
+import { Keyboard, Platform } from 'react-native';
 import { runOnJS, useAnimatedScrollHandler, useAnimatedStyle, useDerivedValue, useSharedValue, withTiming } from 'react-native-reanimated';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { useTheme } from '@fountain-ui/styles';
 import { useHeight } from '../internal/hooks';
 import useAppbarStyles from './useAppbarStyles';
 const defaultOptions = {
   keyboardDismissMode: 'none',
-  dividerExposureMode: 'overlapped',
   supportsReverseScroll: true
 };
 const ANIMATION_CONFIG = {
@@ -22,7 +20,6 @@ export default function useCollapsibleAppBar() {
   let userOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultOptions;
   const {
     keyboardDismissMode,
-    dividerExposureMode,
     supportsReverseScroll
   } = { ...defaultOptions,
     ...userOptions
@@ -37,17 +34,14 @@ export default function useCollapsibleAppBar() {
   const lastOffsetY = useSharedValue(0);
   const overlapped = useSharedValue(false);
   const [isScrolled, setIsScrolled] = useState(false);
-  const theme = useTheme();
   const animatedStyle = useAnimatedStyle(() => {
     const transform = [{
       translateY: translateY.value
     }];
     return {
-      transform,
-      borderColor: dividerExposureMode === 'always' || overlapped.value ? theme.palette.divider : TRANSPARENT,
-      borderBottomWidth: StyleSheet.hairlineWidth
+      transform
     };
-  }, [theme, dividerExposureMode]);
+  }, []);
   const indexRef = useRef(0);
   const offsetsRef = useRef([]);
   const onScrollViewChanged = useCallback(nextIndex => {
@@ -125,7 +119,7 @@ export default function useCollapsibleAppBar() {
       overlapped.value = offsetY + nextTranslateY > 0;
       translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);
     }
-  }, [keyboardDismissMode, appBarHeight, isScrolled]);
+  });
   const hasCollapsible = collapsibleToolbarHeight > 0;
   const appBarStyle = [animatedStyle, {
     paddingTop: safeAreaInsets.top

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

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useRef","useState","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","dismissKeyboard","dismiss","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","translateY","lastTranslateY","lastOffsetY","overlapped","isScrolled","setIsScrolled","theme","animatedStyle","transform","value","borderColor","palette","divider","borderBottomWidth","hairlineWidth","indexRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","scrollHandler","onBeginDrag","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, useState } 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    isScrolled: boolean;\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';\nconst dismissKeyboard = () => Keyboard.dismiss();\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 [isScrolled, setIsScrolled] = useState<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            borderBottomWidth: 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(dismissKeyboard)();\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            if (!isScrolled && offsetY > 0) {\n                runOnJS(setIsScrolled)(true);\n            } else if (isScrolled && offsetY <= 0) {\n                runOnJS(setIsScrolled)(false);\n            }\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 = safeOffsetY <= minOffsetY\n                    ? 0\n                    : supportsReverseScroll\n                        ? dy === 0\n                            ? lastTranslateY.value\n                            : dy > 0\n                                ? maxTy\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, isScrolled]);\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        isScrolled,\n    };\n};\n"],"mappings":"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"}
+{"version":3,"names":["useCallback","useRef","useState","Keyboard","Platform","runOnJS","useAnimatedScrollHandler","useAnimatedStyle","useDerivedValue","useSharedValue","withTiming","useSafeAreaInsets","useHeight","useAppbarStyles","defaultOptions","keyboardDismissMode","supportsReverseScroll","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","OS","dismissKeyboard","dismiss","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","translateY","lastTranslateY","lastOffsetY","overlapped","isScrolled","setIsScrolled","animatedStyle","transform","value","indexRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","scrollHandler","onBeginDrag","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, useState } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } 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 { 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    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    isScrolled: boolean;\n}\n\nconst defaultOptions: Required<Options> = {\n    keyboardDismissMode: 'none',\n    supportsReverseScroll: true,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\nconst dismissKeyboard = () => Keyboard.dismiss();\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n    const { keyboardDismissMode, 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 [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        const transform = [{ translateY: translateY.value }];\n\n        return {\n            transform,\n        };\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(dismissKeyboard)();\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            if (!isScrolled && offsetY > 0) {\n                runOnJS(setIsScrolled)(true);\n            } else if (isScrolled && offsetY <= 0) {\n                runOnJS(setIsScrolled)(false);\n            }\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 = safeOffsetY <= minOffsetY\n                    ? 0\n                    : supportsReverseScroll\n                        ? dy === 0\n                            ? lastTranslateY.value\n                            : dy > 0\n                                ? maxTy\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    });\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        isScrolled,\n    };\n};\n"],"mappings":"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"}

package/build/module/hooks/useContentContainerStyle.js

@@ -1,44 +1,62 @@
-import { useTheme } from '../styles';
-import useBreakpointUp from './useBreakpointUp';
-const defaultConfig = {
-  breakpoint: 'lg',
-  maxWidth: 'md',
-  styleProvider: () => undefined
-}; // TODO: Needs to refactor
-
-function getMaxWidth(theme, breakpoint) {
+import { css, useTheme } from '../styles';
+
+function getMaxWidth(theme, breakpoint, customMaxWidth) {
   switch (breakpoint) {
+    case 'lg':
+    case 'md':
+      return customMaxWidth ?? theme.breakpoints.values[breakpoint];
+
+    default:
+      return undefined;
+  }
+}
+
+function getHomeScreenPaddingHorizontal(theme, breakpoint) {
+  switch (breakpoint) {
+    case 'xxs':
     case 'xs':
-      return theme.breakpoints.values['sm'];
+      return theme.spacing(3);
 
     case 'sm':
-      return theme.breakpoints.values['md'];
+      return theme.spacing(6);
 
     case 'md':
-      return theme.breakpoints.values['lg'];
-
     case 'lg':
-      return 'none';
+    default:
+      return theme.spacing(4);
+  }
+}
+
+function getPaddingHorizontal(theme, breakpoint, isHomeScreen) {
+  if (isHomeScreen) {
+    return getHomeScreenPaddingHorizontal(theme, breakpoint);
+  }
+
+  switch (breakpoint) {
+    case 'sm':
+      return theme.spacing(6);
+
+    default:
+      return theme.spacing(4);
   }
 }
 
 export default function useContentContainerStyle() {
-  let config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultConfig;
+  let config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   const {
-    breakpoint,
-    maxWidth,
-    styleProvider
-  } = { ...defaultConfig,
-    ...config
-  };
+    maxWidth: customMaxWidth,
+    styleProvider,
+    isHomeScreen = false
+  } = config;
   const theme = useTheme();
+  const currentBreakpoint = theme.breakpoints.current;
   const additionalStyle = styleProvider === null || styleProvider === void 0 ? void 0 : styleProvider(theme);
-  const yesStyle = [{
+  return css([{
     alignSelf: 'center',
-    maxWidth: getMaxWidth(theme, maxWidth),
+    maxWidth: getMaxWidth(theme, currentBreakpoint, customMaxWidth),
+    paddingHorizontal: getPaddingHorizontal(theme, currentBreakpoint, isHomeScreen),
     width: '100%'
-  }, additionalStyle];
-  return useBreakpointUp(breakpoint, yesStyle, additionalStyle);
+  }, additionalStyle]);
 }
 ;
 //# sourceMappingURL=useContentContainerStyle.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["useTheme","useBreakpointUp","defaultConfig","breakpoint","maxWidth","styleProvider","undefined","getMaxWidth","theme","breakpoints","values","useContentContainerStyle","config","additionalStyle","yesStyle","alignSelf","width"],"sources":["useContentContainerStyle.ts"],"sourcesContent":["import type { ScrollViewProps, ViewStyle } from 'react-native';\nimport type { Theme } from '../types';\nimport { useTheme } from '../styles';\nimport useBreakpointUp from './useBreakpointUp';\n\ntype Breakpoint = keyof Theme['breakpoints']['values'];\n\ntype ContentContainerStyle = ScrollViewProps['contentContainerStyle'];\n\nexport interface Config {\n    breakpoint?: Breakpoint;\n    maxWidth?: Breakpoint;\n    styleProvider?: (theme: Theme) => ContentContainerStyle;\n}\n\nconst defaultConfig: Required<Config> = {\n    breakpoint: 'lg',\n    maxWidth: 'md',\n    styleProvider: () => undefined,\n};\n\n// TODO: Needs to refactor\nfunction getMaxWidth(theme: Theme, breakpoint: Breakpoint): ViewStyle['maxWidth'] {\n    switch (breakpoint) {\n        case 'xs':\n            return theme.breakpoints.values['sm'];\n        case 'sm':\n            return theme.breakpoints.values['md'];\n        case 'md':\n            return theme.breakpoints.values['lg'];\n        case 'lg':\n            return 'none';\n    }\n}\n\nexport default function useContentContainerStyle(config: Config = defaultConfig): ContentContainerStyle {\n    const {\n        breakpoint,\n        maxWidth,\n        styleProvider,\n    } = {\n        ...defaultConfig,\n        ...config,\n    };\n\n    const theme = useTheme();\n\n    const additionalStyle = styleProvider?.(theme);\n\n    const yesStyle: ContentContainerStyle = [\n        {\n            alignSelf: 'center',\n            maxWidth: getMaxWidth(theme, maxWidth),\n            width: '100%',\n        },\n        additionalStyle,\n    ];\n\n    return useBreakpointUp(breakpoint, yesStyle, additionalStyle);\n};\n"],"mappings":"AAEA,SAASA,QAAT,QAAyB,WAAzB;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AAYA,MAAMC,aAA+B,GAAG;EACpCC,UAAU,EAAE,IADwB;EAEpCC,QAAQ,EAAE,IAF0B;EAGpCC,aAAa,EAAE,MAAMC;AAHe,CAAxC,C,CAMA;;AACA,SAASC,WAAT,CAAqBC,KAArB,EAAmCL,UAAnC,EAAkF;EAC9E,QAAQA,UAAR;IACI,KAAK,IAAL;MACI,OAAOK,KAAK,CAACC,WAAN,CAAkBC,MAAlB,CAAyB,IAAzB,CAAP;;IACJ,KAAK,IAAL;MACI,OAAOF,KAAK,CAACC,WAAN,CAAkBC,MAAlB,CAAyB,IAAzB,CAAP;;IACJ,KAAK,IAAL;MACI,OAAOF,KAAK,CAACC,WAAN,CAAkBC,MAAlB,CAAyB,IAAzB,CAAP;;IACJ,KAAK,IAAL;MACI,OAAO,MAAP;EARR;AAUH;;AAED,eAAe,SAASC,wBAAT,GAAyF;EAAA,IAAvDC,MAAuD,uEAAtCV,aAAsC;EACpG,MAAM;IACFC,UADE;IAEFC,QAFE;IAGFC;EAHE,IAIF,EACA,GAAGH,aADH;IAEA,GAAGU;EAFH,CAJJ;EASA,MAAMJ,KAAK,GAAGR,QAAQ,EAAtB;EAEA,MAAMa,eAAe,GAAGR,aAAH,aAAGA,aAAH,uBAAGA,aAAa,CAAGG,KAAH,CAArC;EAEA,MAAMM,QAA+B,GAAG,CACpC;IACIC,SAAS,EAAE,QADf;IAEIX,QAAQ,EAAEG,WAAW,CAACC,KAAD,EAAQJ,QAAR,CAFzB;IAGIY,KAAK,EAAE;EAHX,CADoC,EAMpCH,eANoC,CAAxC;EASA,OAAOZ,eAAe,CAACE,UAAD,EAAaW,QAAb,EAAuBD,eAAvB,CAAtB;AACH;AAAA"}
+{"version":3,"names":["css","useTheme","getMaxWidth","theme","breakpoint","customMaxWidth","breakpoints","values","undefined","getHomeScreenPaddingHorizontal","spacing","getPaddingHorizontal","isHomeScreen","useContentContainerStyle","config","maxWidth","styleProvider","currentBreakpoint","current","additionalStyle","alignSelf","paddingHorizontal","width"],"sources":["useContentContainerStyle.ts"],"sourcesContent":["import type { FountainUiStyle } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type { Theme } from '../types';\n\ntype Breakpoint = keyof Theme['breakpoints']['values'];\n\nexport interface Config {\n    maxWidth?: number;\n    styleProvider?: (theme: Theme) => FountainUiStyle;\n    isHomeScreen?: boolean;\n}\n\nfunction getMaxWidth(theme: Theme, breakpoint: Breakpoint, customMaxWidth?: number): number | undefined {\n    switch (breakpoint) {\n        case 'lg':\n        case 'md':\n            return customMaxWidth ?? theme.breakpoints.values[breakpoint];\n        default:\n            return undefined;\n    }\n}\n\nfunction getHomeScreenPaddingHorizontal(theme: Theme, breakpoint: Breakpoint): number {\n    switch (breakpoint) {\n        case 'xxs':\n        case 'xs':\n            return theme.spacing(3);\n        case 'sm':\n            return theme.spacing(6);\n        case 'md':\n        case 'lg':\n        default:\n            return theme.spacing(4);\n    }\n}\n\nfunction getPaddingHorizontal(theme: Theme, breakpoint: Breakpoint, isHomeScreen?: boolean): number {\n    if (isHomeScreen) {\n        return getHomeScreenPaddingHorizontal(theme, breakpoint);\n    }\n\n    switch (breakpoint) {\n        case 'sm':\n            return theme.spacing(6);\n        default:\n            return theme.spacing(4);\n    }\n}\n\nexport default function useContentContainerStyle(config: Config = {}): FountainUiStyle {\n    const {\n        maxWidth: customMaxWidth,\n        styleProvider,\n        isHomeScreen = false,\n    } = config;\n\n    const theme = useTheme();\n\n    const currentBreakpoint = theme.breakpoints.current;\n\n    const additionalStyle = styleProvider?.(theme);\n\n    return css([\n        {\n            alignSelf: 'center',\n            maxWidth: getMaxWidth(theme, currentBreakpoint, customMaxWidth),\n            paddingHorizontal: getPaddingHorizontal(theme, currentBreakpoint, isHomeScreen),\n            width: '100%',\n        },\n        additionalStyle,\n    ]);\n};\n"],"mappings":"AACA,SAASA,GAAT,EAAcC,QAAd,QAA8B,WAA9B;;AAWA,SAASC,WAAT,CAAqBC,KAArB,EAAmCC,UAAnC,EAA2DC,cAA3D,EAAwG;EACpG,QAAQD,UAAR;IACI,KAAK,IAAL;IACA,KAAK,IAAL;MACI,OAAOC,cAAc,IAAIF,KAAK,CAACG,WAAN,CAAkBC,MAAlB,CAAyBH,UAAzB,CAAzB;;IACJ;MACI,OAAOI,SAAP;EALR;AAOH;;AAED,SAASC,8BAAT,CAAwCN,KAAxC,EAAsDC,UAAtD,EAAsF;EAClF,QAAQA,UAAR;IACI,KAAK,KAAL;IACA,KAAK,IAAL;MACI,OAAOD,KAAK,CAACO,OAAN,CAAc,CAAd,CAAP;;IACJ,KAAK,IAAL;MACI,OAAOP,KAAK,CAACO,OAAN,CAAc,CAAd,CAAP;;IACJ,KAAK,IAAL;IACA,KAAK,IAAL;IACA;MACI,OAAOP,KAAK,CAACO,OAAN,CAAc,CAAd,CAAP;EATR;AAWH;;AAED,SAASC,oBAAT,CAA8BR,KAA9B,EAA4CC,UAA5C,EAAoEQ,YAApE,EAAoG;EAChG,IAAIA,YAAJ,EAAkB;IACd,OAAOH,8BAA8B,CAACN,KAAD,EAAQC,UAAR,CAArC;EACH;;EAED,QAAQA,UAAR;IACI,KAAK,IAAL;MACI,OAAOD,KAAK,CAACO,OAAN,CAAc,CAAd,CAAP;;IACJ;MACI,OAAOP,KAAK,CAACO,OAAN,CAAc,CAAd,CAAP;EAJR;AAMH;;AAED,eAAe,SAASG,wBAAT,GAAwE;EAAA,IAAtCC,MAAsC,uEAArB,EAAqB;EACnF,MAAM;IACFC,QAAQ,EAAEV,cADR;IAEFW,aAFE;IAGFJ,YAAY,GAAG;EAHb,IAIFE,MAJJ;EAMA,MAAMX,KAAK,GAAGF,QAAQ,EAAtB;EAEA,MAAMgB,iBAAiB,GAAGd,KAAK,CAACG,WAAN,CAAkBY,OAA5C;EAEA,MAAMC,eAAe,GAAGH,aAAH,aAAGA,aAAH,uBAAGA,aAAa,CAAGb,KAAH,CAArC;EAEA,OAAOH,GAAG,CAAC,CACP;IACIoB,SAAS,EAAE,QADf;IAEIL,QAAQ,EAAEb,WAAW,CAACC,KAAD,EAAQc,iBAAR,EAA2BZ,cAA3B,CAFzB;IAGIgB,iBAAiB,EAAEV,oBAAoB,CAACR,KAAD,EAAQc,iBAAR,EAA2BL,YAA3B,CAH3C;IAIIU,KAAK,EAAE;EAJX,CADO,EAOPH,eAPO,CAAD,CAAV;AASH;AAAA"}

package/build/module/hooks/useFadeInAppBar.js

@@ -38,7 +38,7 @@ export default function useFadeInAppBar() {
   const dy = useSharedValue(0);
   const lastOffsetY = useSharedValue(0);
   const normalized = useSharedValue(0);
-  const originalBackgroundColor = theme.palette.background.default;
+  const originalBackgroundColor = theme.palette.background.base;
   const rgbValues = useMemo(() => rgb(originalBackgroundColor), [originalBackgroundColor]);
   const animatedAppBarStyle = useAnimatedStyle(() => {
     const [r, g, b] = rgbValues;
@@ -72,7 +72,7 @@ export default function useFadeInAppBar() {
     onMomentumEnd: event => {
       lastOffsetY.value = event.contentOffset.y;
     }
-  }, [keyboardDismissMode]);
+  });
   const appBarStyle = [animatedAppBarStyle, {
     paddingTop: safeAreaInsets.top
   }, floating ? styles.floating : undefined];