@fountain-ui/core 1.12.0 → 1.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/build/commonjs/Accordion/Accordion.js +20 -10
  3. package/build/commonjs/Accordion/Accordion.js.map +1 -1
  4. package/build/commonjs/ButtonBase/ButtonBase.js +8 -0
  5. package/build/commonjs/ButtonBase/ButtonBase.js.map +1 -1
  6. package/build/commonjs/Chip/Chip.js +4 -4
  7. package/build/commonjs/Chip/Chip.js.map +1 -1
  8. package/build/commonjs/Radio/Radio.js +6 -2
  9. package/build/commonjs/Radio/Radio.js.map +1 -1
  10. package/build/commonjs/Snackbar/Snackbar.js +5 -1
  11. package/build/commonjs/Snackbar/Snackbar.js.map +1 -1
  12. package/build/commonjs/SnackbarContent/SnackbarContent.js +31 -4
  13. package/build/commonjs/SnackbarContent/SnackbarContent.js.map +1 -1
  14. package/build/commonjs/Tab/Tab.js +4 -2
  15. package/build/commonjs/Tab/Tab.js.map +1 -1
  16. package/build/commonjs/Tooltip/Tooltip.js +5 -4
  17. package/build/commonjs/Tooltip/Tooltip.js.map +1 -1
  18. package/build/commonjs/Typography/Typography.js +7 -4
  19. package/build/commonjs/Typography/Typography.js.map +1 -1
  20. package/build/commonjs/hooks/useCollapsibleAppBar.js +5 -5
  21. package/build/commonjs/hooks/useCollapsibleAppBar.js.map +1 -1
  22. package/build/module/Accordion/Accordion.js +6 -1
  23. package/build/module/Accordion/Accordion.js.map +1 -1
  24. package/build/module/ButtonBase/ButtonBase.js +7 -0
  25. package/build/module/ButtonBase/ButtonBase.js.map +1 -1
  26. package/build/module/Chip/Chip.js +3 -3
  27. package/build/module/Chip/Chip.js.map +1 -1
  28. package/build/module/Radio/Radio.js +6 -2
  29. package/build/module/Radio/Radio.js.map +1 -1
  30. package/build/module/Snackbar/Snackbar.js +5 -1
  31. package/build/module/Snackbar/Snackbar.js.map +1 -1
  32. package/build/module/SnackbarContent/SnackbarContent.js +29 -4
  33. package/build/module/SnackbarContent/SnackbarContent.js.map +1 -1
  34. package/build/module/Tab/Tab.js +4 -2
  35. package/build/module/Tab/Tab.js.map +1 -1
  36. package/build/module/Tooltip/Tooltip.js +5 -4
  37. package/build/module/Tooltip/Tooltip.js.map +1 -1
  38. package/build/module/Typography/Typography.js +7 -4
  39. package/build/module/Typography/Typography.js.map +1 -1
  40. package/build/module/hooks/useCollapsibleAppBar.js +1 -1
  41. package/build/module/hooks/useCollapsibleAppBar.js.map +1 -1
  42. package/build/typescript/Slider/Slider.d.ts +1 -1
  43. package/build/typescript/Snackbar/SnackbarProps.d.ts +8 -0
  44. package/build/typescript/SnackbarContent/SnackbarContentProps.d.ts +8 -0
  45. package/package.json +4 -4
  46. package/src/Accordion/Accordion.tsx +7 -1
  47. package/src/ButtonBase/ButtonBase.tsx +11 -0
  48. package/src/Chip/Chip.tsx +4 -4
  49. package/src/Radio/Radio.tsx +13 -4
  50. package/src/Snackbar/Snackbar.tsx +7 -1
  51. package/src/Snackbar/SnackbarProps.ts +10 -0
  52. package/src/SnackbarContent/SnackbarContent.tsx +40 -3
  53. package/src/SnackbarContent/SnackbarContentProps.ts +10 -0
  54. package/src/Tab/Tab.tsx +4 -1
  55. package/src/Tooltip/Tooltip.tsx +8 -5
  56. package/src/Typography/Typography.tsx +6 -2
  57. package/src/hooks/useCollapsibleAppBar.ts +1 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["Typography.tsx"],"names":["accessibilityMap","h1","accessibilityRole","h2","h3","subtitle1","subtitle2","body1","body2","caption1","caption2","flag","selectColor","theme","colorProp","palette","text","Platform","OS","undefined","primary","secondary","accent","hint","main","styles","StyleSheet","create","root","flexShrink","maxWidth","wordWrap","Typography","React","forwardRef","props","ref","align","children","color","ellipsizeMode","href","numberOfLines","onPress","selectable","style","variant","fontStyle","selector","typography","textStyle","textAlign","accessibility","memo"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Platform, Text } from 'react-native';\nimport type { Theme } from '@fountain-ui/styles';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport TypographyProps, { AccessibilityMap, TypographyColor } from './TypographyProps';\n\nconst accessibilityMap: AccessibilityMap = {\n h1: { accessibilityRole: 'header', 'area-level': 1 },\n h2: { accessibilityRole: 'header', 'area-level': 2 },\n h3: { accessibilityRole: 'header', 'area-level': 3 },\n subtitle1: { accessibilityRole: 'header', 'area-level': 6 },\n subtitle2: { accessibilityRole: 'header', 'area-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 const palette = theme.palette.text;\n\n switch (colorProp) {\n case 'inherit':\n return Platform.OS === 'web' ? 'inherit' : undefined;\n case 'textPrimary':\n return palette.primary;\n case 'textSecondary':\n return palette.secondary;\n case 'textAccent':\n return palette.accent;\n case 'textHint':\n return palette.hint;\n }\n\n return theme.palette[colorProp]?.main;\n}\n\nconst styles = StyleSheet.create({\n root: {\n flexShrink: 1,\n ...(Platform.OS === 'web' ? { maxWidth: '100%', wordWrap: 'normal' } : {}),\n },\n});\n\nconst Typography = React.forwardRef<Text, TypographyProps>(function Typography(props, ref) {\n const {\n align = 'inherit',\n children,\n color: colorProp = 'inherit',\n ellipsizeMode = 'tail',\n href,\n numberOfLines,\n onPress,\n selectable,\n style,\n variant = 'body1',\n } = props;\n\n const theme = useTheme();\n\n const fontStyle = createFontStyle(theme, {\n selector: (typography) => typography[variant],\n color: selectColor(theme, colorProp),\n });\n\n const textStyle = css([\n styles.root,\n { textAlign: align === 'inherit' ? 'auto' : align },\n fontStyle,\n style,\n ]);\n\n const accessibility = accessibilityMap[variant];\n const accessibilityRole = href !== undefined ? 'link' : accessibility?.accessibilityRole;\n\n return (\n <Text\n ref={ref}\n accessibilityRole={accessibilityRole}\n aria-level={accessibility?.['area-level']}\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 />\n );\n});\n\nexport default React.memo(Typography);\n"]}
1
+ {"version":3,"sources":["Typography.tsx"],"names":["accessibilityMap","h1","accessibilityRole","h2","h3","subtitle1","subtitle2","body1","body2","caption1","caption2","flag","selectColor","theme","colorProp","palette","text","Platform","OS","undefined","primary","secondary","accent","hint","main","styles","StyleSheet","create","root","flexShrink","maxWidth","Typography","React","forwardRef","props","ref","align","children","color","ellipsizeMode","href","numberOfLines","onPress","selectable","style","variant","fontStyle","selector","typography","textWrapStyle","wordWrap","textStyle","textAlign","accessibility","memo"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Platform, Text, TextStyle } from 'react-native';\nimport type { Theme } from '@fountain-ui/styles';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport TypographyProps, { AccessibilityMap, TypographyColor } from './TypographyProps';\n\nconst accessibilityMap: AccessibilityMap = {\n h1: { accessibilityRole: 'header', 'area-level': 1 },\n h2: { accessibilityRole: 'header', 'area-level': 2 },\n h3: { accessibilityRole: 'header', 'area-level': 3 },\n subtitle1: { accessibilityRole: 'header', 'area-level': 6 },\n subtitle2: { accessibilityRole: 'header', 'area-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 const palette = theme.palette.text;\n\n switch (colorProp) {\n case 'inherit':\n return Platform.OS === 'web' ? 'inherit' : undefined;\n case 'textPrimary':\n return palette.primary;\n case 'textSecondary':\n return palette.secondary;\n case 'textAccent':\n return palette.accent;\n case 'textHint':\n return palette.hint;\n }\n\n return theme.palette[colorProp]?.main;\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 align = 'inherit',\n children,\n color: colorProp = 'inherit',\n ellipsizeMode = 'tail',\n href,\n numberOfLines,\n onPress,\n selectable,\n style,\n variant = 'body1',\n } = props;\n\n const theme = useTheme();\n\n const fontStyle = createFontStyle(theme, {\n selector: (typography) => typography[variant],\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 accessibilityRole = href !== undefined ? 'link' : accessibility?.accessibilityRole;\n\n return (\n <Text\n ref={ref}\n accessibilityRole={accessibilityRole}\n aria-level={accessibility?.['area-level']}\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 />\n );\n});\n\nexport default React.memo(Typography);\n"]}
@@ -13,9 +13,9 @@ var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanim
13
13
 
14
14
  var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
15
15
 
16
- var _hooks = require("../hooks");
16
+ var _hooks = require("../internal/hooks");
17
17
 
18
- var _hooks2 = require("../internal/hooks");
18
+ var _useElevationStyle = _interopRequireDefault(require("./useElevationStyle"));
19
19
 
20
20
  var _useAppbarStyles = _interopRequireDefault(require("./useAppbarStyles"));
21
21
 
@@ -35,8 +35,8 @@ function useCollapsibleAppBar(userOptions = defaultOptions) {
35
35
  };
36
36
  const styles = (0, _useAppbarStyles.default)();
37
37
  const safeAreaInsets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
38
- const [appBarHeight, onAppBarLayout] = (0, _hooks2.useHeight)();
39
- const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = (0, _hooks2.useHeight)();
38
+ const [appBarHeight, onAppBarLayout] = (0, _hooks.useHeight)();
39
+ const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = (0, _hooks.useHeight)();
40
40
 
41
41
  const maxTranslateY = _reactNativeReanimated.default.useDerivedValue(() => -collapsibleToolbarHeight);
42
42
 
@@ -48,7 +48,7 @@ function useCollapsibleAppBar(userOptions = defaultOptions) {
48
48
 
49
49
  const overlapped = _reactNativeReanimated.default.useSharedValue(false);
50
50
 
51
- const elevationStyle = (0, _hooks.useElevationStyle)(4);
51
+ const elevationStyle = (0, _useElevationStyle.default)(4);
52
52
 
53
53
  const animatedStyle = _reactNativeReanimated.default.useAnimatedStyle(() => {
54
54
  return _reactNative.Platform.OS === 'web' ? {
@@ -1 +1 @@
1
- {"version":3,"sources":["useCollapsibleAppBar.ts"],"names":["defaultOptions","translucent","ANIMATION_DURATION_MILLIS","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","Animated","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","animatedStyle","useAnimatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","React","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","duration","scrollHandler","useAnimatedScrollHandler","onBeginDrag","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","undefined","floating","scrollContentInsets"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Falsy, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport Animated from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useElevationStyle } from '../hooks';\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 translucent?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n appBarStyle: ViewStyleProp;\n onAppBarLayout: OnLayoutCallback;\n onCollapsibleToolbarLayout: OnLayoutCallback;\n onScroll: OnScroll;\n onScrollViewChanged: (index: number) => void;\n scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n translucent: false,\n};\n\nconst ANIMATION_DURATION_MILLIS = 100;\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n const { translucent }: 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 = Animated.useDerivedValue(() => -collapsibleToolbarHeight);\n\n const translateY = Animated.useSharedValue<number>(0);\n const lastTranslateY = Animated.useSharedValue<number>(0);\n const lastOffsetY = Animated.useSharedValue<number>(0);\n const overlapped = Animated.useSharedValue<boolean>(false);\n\n const elevationStyle = useElevationStyle(4);\n const animatedStyle = Animated.useAnimatedStyle(() => {\n return Platform.OS === 'web' ? ({\n transform: [{ translateY: translateY.value }],\n boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n }) : ({\n transform: [{ translateY: translateY.value }],\n elevation: overlapped.value ? elevationStyle?.elevation : 0,\n shadowColor: elevationStyle?.shadowColor,\n shadowOffset: elevationStyle?.shadowOffset,\n shadowRadius: elevationStyle?.shadowRadius,\n shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n });\n });\n\n const indexRef = React.useRef<number>(0);\n const offsetsRef = React.useRef<Array<number>>([]);\n\n const onScrollViewChanged = (nextIndex: number) => {\n const prevIndex = indexRef.current;\n if (prevIndex === nextIndex) {\n return;\n }\n\n offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n lastOffsetY.value = savedOffsetY;\n\n indexRef.current = nextIndex;\n\n // Determine whether to overlap every time index is changed.\n overlapped.value = savedOffsetY > 0;\n\n // If next ScrollView's offset is too short, expand app bar.\n if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n translateY.value = Animated.withTiming(0, {\n duration: ANIMATION_DURATION_MILLIS,\n });\n }\n };\n\n const scrollHandler = Animated.useAnimatedScrollHandler({\n onBeginDrag: () => {\n lastTranslateY.value = translateY.value;\n },\n onMomentumBegin: () => {\n lastTranslateY.value = translateY.value;\n },\n onScroll: (event) => {\n const offsetY = event.contentOffset.y;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n if (SUPPORTS_DRAG_DETECTION) {\n const dy = offsetY - lastOffsetY.value;\n\n translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n overlapped.value = offsetY + translateY.value > 0;\n } else {\n if (offsetY > -maxTy) {\n if (ty === 0) {\n translateY.value = Animated.withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {\n duration: ANIMATION_DURATION_MILLIS,\n });\n }\n } else {\n if (ty === maxTy) {\n translateY.value = Animated.withTiming(0, {\n duration: ANIMATION_DURATION_MILLIS,\n });\n }\n }\n\n overlapped.value = offsetY > 0;\n\n lastOffsetY.value = offsetY;\n }\n },\n onEndDrag: (event) => {\n lastOffsetY.value = event.contentOffset.y;\n },\n onMomentumEnd: (event) => {\n const offsetY = event.contentOffset.y;\n\n lastOffsetY.value = offsetY;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n // If toolbar is already positioned on edge, do nothing.\n if (ty <= maxTy || ty >= 0) {\n return;\n }\n\n const threshold = maxTy * 0.5;\n\n const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n overlapped.value = offsetY + nextTranslateY > 0;\n\n translateY.value = Animated.withTiming(nextTranslateY, {\n duration: ANIMATION_DURATION_MILLIS,\n });\n },\n });\n\n const hasCollapsible = collapsibleToolbarHeight > 0;\n\n const appBarStyle = [\n animatedStyle,\n translucent ? { paddingTop: safeAreaInsets.top } : undefined,\n hasCollapsible ? styles.floating : undefined,\n ];\n\n return {\n appBarStyle,\n onAppBarLayout,\n onCollapsibleToolbarLayout,\n onScroll: scrollHandler,\n onScrollViewChanged,\n scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n };\n};\n"]}
1
+ {"version":3,"sources":["useCollapsibleAppBar.ts"],"names":["defaultOptions","translucent","ANIMATION_DURATION_MILLIS","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","Animated","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","animatedStyle","useAnimatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","React","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","duration","scrollHandler","useAnimatedScrollHandler","onBeginDrag","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","undefined","floating","scrollContentInsets"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Falsy, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport Animated from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useElevationStyle from './useElevationStyle';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n top?: number;\n bottom?: number;\n left?: number;\n right?: number;\n}\n\nexport interface Options {\n translucent?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n appBarStyle: ViewStyleProp;\n onAppBarLayout: OnLayoutCallback;\n onCollapsibleToolbarLayout: OnLayoutCallback;\n onScroll: OnScroll;\n onScrollViewChanged: (index: number) => void;\n scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n translucent: false,\n};\n\nconst ANIMATION_DURATION_MILLIS = 100;\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n const { translucent }: 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 = Animated.useDerivedValue(() => -collapsibleToolbarHeight);\n\n const translateY = Animated.useSharedValue<number>(0);\n const lastTranslateY = Animated.useSharedValue<number>(0);\n const lastOffsetY = Animated.useSharedValue<number>(0);\n const overlapped = Animated.useSharedValue<boolean>(false);\n\n const elevationStyle = useElevationStyle(4);\n const animatedStyle = Animated.useAnimatedStyle(() => {\n return Platform.OS === 'web' ? ({\n transform: [{ translateY: translateY.value }],\n boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n }) : ({\n transform: [{ translateY: translateY.value }],\n elevation: overlapped.value ? elevationStyle?.elevation : 0,\n shadowColor: elevationStyle?.shadowColor,\n shadowOffset: elevationStyle?.shadowOffset,\n shadowRadius: elevationStyle?.shadowRadius,\n shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n });\n });\n\n const indexRef = React.useRef<number>(0);\n const offsetsRef = React.useRef<Array<number>>([]);\n\n const onScrollViewChanged = (nextIndex: number) => {\n const prevIndex = indexRef.current;\n if (prevIndex === nextIndex) {\n return;\n }\n\n offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n lastOffsetY.value = savedOffsetY;\n\n indexRef.current = nextIndex;\n\n // Determine whether to overlap every time index is changed.\n overlapped.value = savedOffsetY > 0;\n\n // If next ScrollView's offset is too short, expand app bar.\n if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n translateY.value = Animated.withTiming(0, {\n duration: ANIMATION_DURATION_MILLIS,\n });\n }\n };\n\n const scrollHandler = Animated.useAnimatedScrollHandler({\n onBeginDrag: () => {\n lastTranslateY.value = translateY.value;\n },\n onMomentumBegin: () => {\n lastTranslateY.value = translateY.value;\n },\n onScroll: (event) => {\n const offsetY = event.contentOffset.y;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n if (SUPPORTS_DRAG_DETECTION) {\n const dy = offsetY - lastOffsetY.value;\n\n translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n overlapped.value = offsetY + translateY.value > 0;\n } else {\n if (offsetY > -maxTy) {\n if (ty === 0) {\n translateY.value = Animated.withTiming(Math.min(Math.max(-offsetY, maxTy), 0), {\n duration: ANIMATION_DURATION_MILLIS,\n });\n }\n } else {\n if (ty === maxTy) {\n translateY.value = Animated.withTiming(0, {\n duration: ANIMATION_DURATION_MILLIS,\n });\n }\n }\n\n overlapped.value = offsetY > 0;\n\n lastOffsetY.value = offsetY;\n }\n },\n onEndDrag: (event) => {\n lastOffsetY.value = event.contentOffset.y;\n },\n onMomentumEnd: (event) => {\n const offsetY = event.contentOffset.y;\n\n lastOffsetY.value = offsetY;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n // If toolbar is already positioned on edge, do nothing.\n if (ty <= maxTy || ty >= 0) {\n return;\n }\n\n const threshold = maxTy * 0.5;\n\n const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n overlapped.value = offsetY + nextTranslateY > 0;\n\n translateY.value = Animated.withTiming(nextTranslateY, {\n duration: ANIMATION_DURATION_MILLIS,\n });\n },\n });\n\n const hasCollapsible = collapsibleToolbarHeight > 0;\n\n const appBarStyle = [\n animatedStyle,\n translucent ? { paddingTop: safeAreaInsets.top } : undefined,\n hasCollapsible ? styles.floating : undefined,\n ];\n\n return {\n appBarStyle,\n onAppBarLayout,\n onCollapsibleToolbarLayout,\n onScroll: scrollHandler,\n onScrollViewChanged,\n scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n };\n};\n"]}
@@ -1,7 +1,12 @@
1
1
  import React, { useState } from 'react';
2
2
  import Animated from 'react-native-reanimated';
3
3
  import { ChevronDown as ChevronDownIcon } from '../internal/icons';
4
- import { ButtonBase, Column, Divider, Spacer, Typography, useTheme } from '../index';
4
+ import ButtonBase from '../ButtonBase';
5
+ import Column from '../Column';
6
+ import Divider from '../Divider';
7
+ import Spacer from '../Spacer';
8
+ import Typography from '../Typography';
9
+ import { useTheme } from '../styles';
5
10
  const ANIMATION_OPTION = {
6
11
  duration: 250
7
12
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["Accordion.tsx"],"names":["React","useState","Animated","ChevronDown","ChevronDownIcon","ButtonBase","Column","Divider","Spacer","Typography","useTheme","ANIMATION_OPTION","duration","useStyles","theme","root","flexDirection","paddingVertical","spacing","Accordion","props","content","LeftIcon","RightIcon","title","titleVariant","styles","isExpanded","setIsExpanded","rotate","useSharedValue","animatedChevronDownStyles","useAnimatedStyle","transform","value","onPress","prev","withTiming","isValidElement"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,OAAOC,QAAP,MAAqB,yBAArB;AAEA,SAASC,WAAW,IAAIC,eAAxB,QAA+C,mBAA/C;AACA,SAASC,UAAT,EAAqBC,MAArB,EAA6BC,OAA7B,EAAsCC,MAAtC,EAA8CC,UAA9C,EAA0DC,QAA1D,QAA0E,UAA1E;AAKA,MAAMC,gBAAgB,GAAG;AAAEC,EAAAA,QAAQ,EAAE;AAAZ,CAAzB;;AAEA,MAAMC,SAAqC,GAAG,YAA6B;AACvE,QAAMC,KAAK,GAAGJ,QAAQ,EAAtB;AAEA,SAAO;AACHK,IAAAA,IAAI,EAAE;AACFC,MAAAA,aAAa,EAAE,KADb;AAEFC,MAAAA,eAAe,EAAEH,KAAK,CAACI,OAAN,CAAc,CAAd;AAFf;AADH,GAAP;AAMH,CATD;;AAWA,eAAe,SAASC,SAAT,CAAmBC,KAAnB,EAA0C;AACrD,QAAM;AACFC,IAAAA,OADE;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,SAHE;AAIFC,IAAAA,KAJE;AAKFC,IAAAA,YAAY,GAAG;AALb,MAMFL,KANJ;AAQA,QAAMM,MAAM,GAAGb,SAAS,EAAxB;AAEA,QAAM,CAACc,UAAD,EAAaC,aAAb,IAA8B3B,QAAQ,CAAC,KAAD,CAA5C;AACA,QAAM4B,MAAM,GAAG3B,QAAQ,CAAC4B,cAAT,CAAwB,CAAxB,CAAf;AAEA,QAAMC,yBAAyB,GAAG7B,QAAQ,CAAC8B,gBAAT,CAA0B,OAAO;AAC/DC,IAAAA,SAAS,EAAE,CAAC;AAAEJ,MAAAA,MAAM,EAAG,GAAEA,MAAM,CAACK,KAAM;AAA1B,KAAD;AADoD,GAAP,CAA1B,CAAlC;;AAIA,QAAMC,OAAO,GAAG,MAAM;AAClBP,IAAAA,aAAa,CAACQ,IAAI,IAAI,CAACA,IAAV,CAAb;AACAP,IAAAA,MAAM,CAACK,KAAP,GAAehC,QAAQ,CAACmC,UAAT,CAAoB,CAACV,UAAD,GAAc,GAAd,GAAoB,CAAxC,EAA2ChB,gBAA3C,CAAf;AACH,GAHD;;AAKA,sBACI,oBAAC,MAAD,qBACI,oBAAC,UAAD;AACI,IAAA,OAAO,EAAEwB,OADb;AAEI,IAAA,KAAK,EAAET,MAAM,CAACX;AAFlB,KAIKO,QAAQ,gBACL,oBAAC,KAAD,CAAO,QAAP,QACKA,QADL,eAEI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE;AAAd,IAFJ,CADK,GAKL,IATR,eAWI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEE,KADd;AAEI,IAAA,OAAO,EAAEC;AAFb,IAXJ,eAgBI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE;AAAd,IAhBJ,eAkBI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE;AAAd,IAlBJ,eAoBI,oBAAC,MAAD,qBACI,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEM;AAAtB,KACKR,SAAS,GAAGA,SAAH;AAAA;AACN;AACA,sBAAC,eAAD;AAAiB,IAAA,MAAM,EAAE,EAAzB;AAA6B,IAAA,KAAK,EAAE;AAApC,IAHR,CADJ,CApBJ,CADJ,EA+BKI,UAAU,GACP,aAAA3B,KAAK,CAACsC,cAAN,CAAqBjB,OAArB,IAAiCA,OAAjC,gBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEA,OADd;AAEI,IAAA,KAAK,EAAE,eAFX;AAGI,IAAA,OAAO,EAAE;AAHb,IAFG,GAQP,IAvCR,eAyCI,oBAAC,OAAD,OAzCJ,CADJ;AA6CH","sourcesContent":["import React, { useState } from 'react';\nimport Animated from 'react-native-reanimated';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { ChevronDown as ChevronDownIcon } from '../internal/icons';\nimport { ButtonBase, Column, Divider, Spacer, Typography, useTheme } from '../index';\nimport AccordionProps from './AccordionProps';\n\ntype AccordionStyles = NamedStylesStringUnion<'root'>;\n\nconst ANIMATION_OPTION = { duration: 250 };\n\nconst useStyles: UseStyles<AccordionStyles> = function (): AccordionStyles {\n const theme = useTheme();\n\n return {\n root: {\n flexDirection: 'row',\n paddingVertical: theme.spacing(3),\n },\n };\n};\n\nexport default function Accordion(props: AccordionProps) {\n const {\n content,\n LeftIcon,\n RightIcon,\n title,\n titleVariant = 'subtitle2',\n } = props;\n\n const styles = useStyles();\n\n const [isExpanded, setIsExpanded] = useState(false);\n const rotate = Animated.useSharedValue(0);\n\n const animatedChevronDownStyles = Animated.useAnimatedStyle(() => ({\n transform: [{ rotate: `${rotate.value}deg` }],\n }));\n\n const onPress = () => {\n setIsExpanded(prev => !prev);\n rotate.value = Animated.withTiming(!isExpanded ? 180 : 0, ANIMATION_OPTION);\n };\n\n return (\n <Column>\n <ButtonBase\n onPress={onPress}\n style={styles.root}\n >\n {LeftIcon ? (\n <React.Fragment>\n {LeftIcon}\n <Spacer size={2}/>\n </React.Fragment>\n ) : null}\n\n <Typography\n children={title}\n variant={titleVariant}\n />\n\n <Spacer flex={1}/>\n\n <Spacer size={2}/>\n\n <Column>\n <Animated.View style={animatedChevronDownStyles}>\n {RightIcon ? RightIcon : (\n // @ts-ignore\n <ChevronDownIcon height={24} width={24}/>\n )}\n </Animated.View>\n </Column>\n </ButtonBase>\n\n {isExpanded ? (\n React.isValidElement(content) ? (content) : (\n <Typography\n children={content}\n color={'textSecondary'}\n variant={'body2'}\n />\n )\n ) : null}\n\n <Divider/>\n </Column>\n );\n}\n"]}
1
+ {"version":3,"sources":["Accordion.tsx"],"names":["React","useState","Animated","ChevronDown","ChevronDownIcon","ButtonBase","Column","Divider","Spacer","Typography","useTheme","ANIMATION_OPTION","duration","useStyles","theme","root","flexDirection","paddingVertical","spacing","Accordion","props","content","LeftIcon","RightIcon","title","titleVariant","styles","isExpanded","setIsExpanded","rotate","useSharedValue","animatedChevronDownStyles","useAnimatedStyle","transform","value","onPress","prev","withTiming","isValidElement"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,OAAOC,QAAP,MAAqB,yBAArB;AAEA,SAASC,WAAW,IAAIC,eAAxB,QAA+C,mBAA/C;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,OAAP,MAAoB,YAApB;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,QAAT,QAAyB,WAAzB;AAMA,MAAMC,gBAAgB,GAAG;AAAEC,EAAAA,QAAQ,EAAE;AAAZ,CAAzB;;AAEA,MAAMC,SAAqC,GAAG,YAA6B;AACvE,QAAMC,KAAK,GAAGJ,QAAQ,EAAtB;AAEA,SAAO;AACHK,IAAAA,IAAI,EAAE;AACFC,MAAAA,aAAa,EAAE,KADb;AAEFC,MAAAA,eAAe,EAAEH,KAAK,CAACI,OAAN,CAAc,CAAd;AAFf;AADH,GAAP;AAMH,CATD;;AAWA,eAAe,SAASC,SAAT,CAAmBC,KAAnB,EAA0C;AACrD,QAAM;AACFC,IAAAA,OADE;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,SAHE;AAIFC,IAAAA,KAJE;AAKFC,IAAAA,YAAY,GAAG;AALb,MAMFL,KANJ;AAQA,QAAMM,MAAM,GAAGb,SAAS,EAAxB;AAEA,QAAM,CAACc,UAAD,EAAaC,aAAb,IAA8B3B,QAAQ,CAAC,KAAD,CAA5C;AACA,QAAM4B,MAAM,GAAG3B,QAAQ,CAAC4B,cAAT,CAAwB,CAAxB,CAAf;AAEA,QAAMC,yBAAyB,GAAG7B,QAAQ,CAAC8B,gBAAT,CAA0B,OAAO;AAC/DC,IAAAA,SAAS,EAAE,CAAC;AAAEJ,MAAAA,MAAM,EAAG,GAAEA,MAAM,CAACK,KAAM;AAA1B,KAAD;AADoD,GAAP,CAA1B,CAAlC;;AAIA,QAAMC,OAAO,GAAG,MAAM;AAClBP,IAAAA,aAAa,CAACQ,IAAI,IAAI,CAACA,IAAV,CAAb;AACAP,IAAAA,MAAM,CAACK,KAAP,GAAehC,QAAQ,CAACmC,UAAT,CAAoB,CAACV,UAAD,GAAc,GAAd,GAAoB,CAAxC,EAA2ChB,gBAA3C,CAAf;AACH,GAHD;;AAKA,sBACI,oBAAC,MAAD,qBACI,oBAAC,UAAD;AACI,IAAA,OAAO,EAAEwB,OADb;AAEI,IAAA,KAAK,EAAET,MAAM,CAACX;AAFlB,KAIKO,QAAQ,gBACL,oBAAC,KAAD,CAAO,QAAP,QACKA,QADL,eAEI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE;AAAd,IAFJ,CADK,GAKL,IATR,eAWI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEE,KADd;AAEI,IAAA,OAAO,EAAEC;AAFb,IAXJ,eAgBI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE;AAAd,IAhBJ,eAkBI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE;AAAd,IAlBJ,eAoBI,oBAAC,MAAD,qBACI,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAEM;AAAtB,KACKR,SAAS,GAAGA,SAAH;AAAA;AACN;AACA,sBAAC,eAAD;AAAiB,IAAA,MAAM,EAAE,EAAzB;AAA6B,IAAA,KAAK,EAAE;AAApC,IAHR,CADJ,CApBJ,CADJ,EA+BKI,UAAU,GACP,aAAA3B,KAAK,CAACsC,cAAN,CAAqBjB,OAArB,IAAiCA,OAAjC,gBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEA,OADd;AAEI,IAAA,KAAK,EAAE,eAFX;AAGI,IAAA,OAAO,EAAE;AAHb,IAFG,GAQP,IAvCR,eAyCI,oBAAC,OAAD,OAzCJ,CADJ;AA6CH","sourcesContent":["import React, { useState } from 'react';\nimport Animated from 'react-native-reanimated';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { ChevronDown as ChevronDownIcon } from '../internal/icons';\nimport ButtonBase from '../ButtonBase';\nimport Column from '../Column';\nimport Divider from '../Divider';\nimport Spacer from '../Spacer';\nimport Typography from '../Typography';\nimport { useTheme } from '../styles';\n\nimport AccordionProps from './AccordionProps';\n\ntype AccordionStyles = NamedStylesStringUnion<'root'>;\n\nconst ANIMATION_OPTION = { duration: 250 };\n\nconst useStyles: UseStyles<AccordionStyles> = function (): AccordionStyles {\n const theme = useTheme();\n\n return {\n root: {\n flexDirection: 'row',\n paddingVertical: theme.spacing(3),\n },\n };\n};\n\nexport default function Accordion(props: AccordionProps) {\n const {\n content,\n LeftIcon,\n RightIcon,\n title,\n titleVariant = 'subtitle2',\n } = props;\n\n const styles = useStyles();\n\n const [isExpanded, setIsExpanded] = useState(false);\n const rotate = Animated.useSharedValue(0);\n\n const animatedChevronDownStyles = Animated.useAnimatedStyle(() => ({\n transform: [{ rotate: `${rotate.value}deg` }],\n }));\n\n const onPress = () => {\n setIsExpanded(prev => !prev);\n rotate.value = Animated.withTiming(!isExpanded ? 180 : 0, ANIMATION_OPTION);\n };\n\n return (\n <Column>\n <ButtonBase\n onPress={onPress}\n style={styles.root}\n >\n {LeftIcon ? (\n <React.Fragment>\n {LeftIcon}\n <Spacer size={2}/>\n </React.Fragment>\n ) : null}\n\n <Typography\n children={title}\n variant={titleVariant}\n />\n\n <Spacer flex={1}/>\n\n <Spacer size={2}/>\n\n <Column>\n <Animated.View style={animatedChevronDownStyles}>\n {RightIcon ? RightIcon : (\n // @ts-ignore\n <ChevronDownIcon height={24} width={24}/>\n )}\n </Animated.View>\n </Column>\n </ButtonBase>\n\n {isExpanded ? (\n React.isValidElement(content) ? (content) : (\n <Typography\n children={content}\n color={'textSecondary'}\n variant={'body2'}\n />\n )\n ) : null}\n\n <Divider/>\n </Column>\n );\n}\n"]}
@@ -44,6 +44,13 @@ export default function ButtonBase(props) {
44
44
  scale: scale.value
45
45
  }]
46
46
  }));
47
+ Animated.useAnimatedReaction(() => disabled, result => {
48
+ if (result) {
49
+ opacity.value = DISABLED_OPACITY;
50
+ } else {
51
+ opacity.value = ORIGINAL_OPACITY;
52
+ }
53
+ });
47
54
 
48
55
  const startAnimation = (pressIn, isHovered = false) => {
49
56
  if (pressEffect === 'none') {
@@ -1 +1 @@
1
- {"version":3,"sources":["ButtonBase.tsx"],"names":["React","Animated","useThrottle","AnimatedPressable","StyleSheet","ORIGINAL_OPACITY","ACTIVE_OPACITY","DISABLED_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","animationTimingConfig","duration","styles","create","disabled","opacity","transform","scale","ButtonBase","props","children","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","periodMillis","callback","useSharedValue","animatedStyle","useAnimatedStyle","value","startAnimation","pressIn","isHovered","withTiming","withDelay","undefined","hovered"],"mappings":"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","sourcesContent":["import React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport { StyleSheet } from '../styles';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\nconst ORIGINAL_OPACITY = 1;\nconst ACTIVE_OPACITY = .65;\nconst DISABLED_OPACITY = .3;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\nconst animationTimingConfig: Animated.WithTimingConfig = { duration: 150 };\n\nconst styles = StyleSheet.create({\n disabled: {\n opacity: DISABLED_OPACITY,\n transform: [{ scale: ORIGINAL_SCALE }],\n },\n});\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n const {\n children,\n disabled = false,\n disableThrottle = false,\n onPress,\n pressEffect = 'opacity',\n style,\n throttleMillis = 650,\n ...otherProps\n } = props;\n\n const handlePress = useThrottle({\n periodMillis: disableThrottle ? 0 : throttleMillis,\n callback: onPress,\n });\n\n const opacity = Animated.useSharedValue(ORIGINAL_OPACITY);\n const scale = Animated.useSharedValue(ORIGINAL_SCALE);\n\n const animatedStyle = Animated.useAnimatedStyle(() => ({\n opacity: opacity.value,\n transform: [{ scale: scale.value }],\n }));\n\n const startAnimation = (pressIn: boolean, isHovered: boolean = false) => {\n if (pressEffect === 'none') {\n return;\n }\n\n if (pressEffect === 'opacity') {\n if (pressIn) {\n opacity.value = ACTIVE_OPACITY;\n } else {\n opacity.value = Animated.withTiming(ORIGINAL_OPACITY, animationTimingConfig);\n }\n } else if (!isHovered) {\n if (pressIn) {\n scale.value = Animated.withDelay(\n 100,\n Animated.withTiming(MINIFIED_SCALE, animationTimingConfig),\n );\n } else {\n scale.value = Animated.withTiming(ORIGINAL_SCALE, animationTimingConfig);\n }\n }\n };\n\n return (\n <AnimatedPressable\n disabled={disabled}\n onPress={handlePress}\n onPressIn={() => startAnimation(true)}\n onPressOut={() => startAnimation(false)}\n style={[\n animatedStyle,\n disabled ? styles.disabled : undefined,\n style,\n ]}\n {...otherProps}\n >\n {typeof children !== 'function' ? (\n ({ hovered }) => {\n if (hovered !== undefined && !disabled) {\n startAnimation(hovered, true);\n }\n\n return children;\n }\n ) : children}\n </AnimatedPressable>\n );\n};\n"]}
1
+ {"version":3,"sources":["ButtonBase.tsx"],"names":["React","Animated","useThrottle","AnimatedPressable","StyleSheet","ORIGINAL_OPACITY","ACTIVE_OPACITY","DISABLED_OPACITY","ORIGINAL_SCALE","MINIFIED_SCALE","animationTimingConfig","duration","styles","create","disabled","opacity","transform","scale","ButtonBase","props","children","disableThrottle","onPress","pressEffect","style","throttleMillis","otherProps","handlePress","periodMillis","callback","useSharedValue","animatedStyle","useAnimatedStyle","value","useAnimatedReaction","result","startAnimation","pressIn","isHovered","withTiming","withDelay","undefined","hovered"],"mappings":"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","sourcesContent":["import React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { useThrottle } from '../hooks';\nimport { AnimatedPressable } from '../animated';\nimport { StyleSheet } from '../styles';\nimport type ButtonBaseProps from './ButtonBaseProps';\n\nconst ORIGINAL_OPACITY = 1;\nconst ACTIVE_OPACITY = .65;\nconst DISABLED_OPACITY = .3;\n\nconst ORIGINAL_SCALE = 1;\nconst MINIFIED_SCALE = .96;\n\nconst animationTimingConfig: Animated.WithTimingConfig = { duration: 150 };\n\nconst styles = StyleSheet.create({\n disabled: {\n opacity: DISABLED_OPACITY,\n transform: [{ scale: ORIGINAL_SCALE }],\n },\n});\n\nexport default function ButtonBase(props: ButtonBaseProps) {\n const {\n children,\n disabled = false,\n disableThrottle = false,\n onPress,\n pressEffect = 'opacity',\n style,\n throttleMillis = 650,\n ...otherProps\n } = props;\n\n const handlePress = useThrottle({\n periodMillis: disableThrottle ? 0 : throttleMillis,\n callback: onPress,\n });\n\n const opacity = Animated.useSharedValue(ORIGINAL_OPACITY);\n const scale = Animated.useSharedValue(ORIGINAL_SCALE);\n\n const animatedStyle = Animated.useAnimatedStyle(() => ({\n opacity: opacity.value,\n transform: [{ scale: scale.value }],\n }));\n\n Animated.useAnimatedReaction(\n () => disabled,\n (result) => {\n if (result) {\n opacity.value = DISABLED_OPACITY;\n } else {\n opacity.value = ORIGINAL_OPACITY;\n }\n },\n );\n\n const startAnimation = (pressIn: boolean, isHovered: boolean = false) => {\n if (pressEffect === 'none') {\n return;\n }\n\n if (pressEffect === 'opacity') {\n if (pressIn) {\n opacity.value = ACTIVE_OPACITY;\n } else {\n opacity.value = Animated.withTiming(ORIGINAL_OPACITY, animationTimingConfig);\n }\n } else if (!isHovered) {\n if (pressIn) {\n scale.value = Animated.withDelay(\n 100,\n Animated.withTiming(MINIFIED_SCALE, animationTimingConfig),\n );\n } else {\n scale.value = Animated.withTiming(ORIGINAL_SCALE, animationTimingConfig);\n }\n }\n };\n\n return (\n <AnimatedPressable\n disabled={disabled}\n onPress={handlePress}\n onPressIn={() => startAnimation(true)}\n onPressOut={() => startAnimation(false)}\n style={[\n animatedStyle,\n disabled ? styles.disabled : undefined,\n style,\n ]}\n {...otherProps}\n >\n {typeof children !== 'function' ? (\n ({ hovered }) => {\n if (hovered !== undefined && !disabled) {\n startAnimation(hovered, true);\n }\n\n return children;\n }\n ) : children}\n </AnimatedPressable>\n );\n};\n"]}
@@ -3,7 +3,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
3
3
  import React from 'react';
4
4
  import { Text } from 'react-native';
5
5
  import { cloneSvgIcon, createFontStyle, css, useTheme } from '../styles';
6
- import { ButtonBase } from '../index';
6
+ import ButtonBase from '../ButtonBase';
7
7
  const ICON_SIZE = 'tiny';
8
8
 
9
9
  const useStyles = function () {
@@ -38,7 +38,7 @@ export default function Chip(props) {
38
38
  outlined: {
39
39
  backgroundColor: theme.palette.paper.default,
40
40
  borderColor: theme.palette.border,
41
- borderWidth: 1
41
+ borderWidth: 2
42
42
  },
43
43
  filled: {
44
44
  backgroundColor: theme.palette.paper.grey
@@ -46,7 +46,7 @@ export default function Chip(props) {
46
46
  bold: {
47
47
  backgroundColor: theme.palette.paper.grey,
48
48
  borderColor: theme.palette.primary.main,
49
- borderWidth: 1
49
+ borderWidth: 2
50
50
  }
51
51
  };
52
52
  const chipStyle = css([styles.root, variantStyleMap[variant], styleProp]);
@@ -1 +1 @@
1
- {"version":3,"sources":["Chip.tsx"],"names":["React","Text","cloneSvgIcon","createFontStyle","css","useTheme","ButtonBase","ICON_SIZE","useStyles","theme","root","alignItems","borderRadius","flexDirection","height","justifyContent","paddingLeft","spacing","paddingRight","Chip","props","children","endIcon","endIconProp","onPress","startIcon","startIconProp","style","styleProp","variant","otherProps","styles","fontColor","palette","tertiary","main","primary","variantStyleMap","outlined","backgroundColor","paper","default","borderColor","border","borderWidth","filled","grey","bold","chipStyle","fontStyle","selector","typo","subtitle2","color","textMarginSize","textMarginStyle","marginLeft","marginRight","undefined","textStyle","textAlign","size"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { cloneSvgIcon, createFontStyle, css, useTheme } from '../styles';\nimport { ButtonBase } from '../index';\nimport type ChipProps from './ChipProps';\n\ntype ChipStyles = NamedStylesStringUnion<'root'>;\n\nconst ICON_SIZE = 'tiny';\n\nconst useStyles: UseStyles<ChipStyles> = function (): ChipStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'center',\n borderRadius: 20,\n flexDirection: 'row',\n height: 32,\n justifyContent: 'center',\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n };\n};\n\nexport default function Chip(props: ChipProps) {\n const {\n children,\n endIcon: endIconProp,\n onPress,\n startIcon: startIconProp,\n style: styleProp,\n variant = 'outlined',\n ...otherProps\n } = props;\n\n const theme = useTheme();\n const styles = useStyles();\n\n const fontColor = variant === 'outlined'\n ? theme.palette.tertiary.main\n : theme.palette.primary.main;\n\n const variantStyleMap = {\n outlined: {\n backgroundColor: theme.palette.paper.default,\n borderColor: theme.palette.border,\n borderWidth: 1,\n },\n filled: {\n backgroundColor: theme.palette.paper.grey,\n },\n bold: {\n backgroundColor: theme.palette.paper.grey,\n borderColor: theme.palette.primary.main,\n borderWidth: 1,\n },\n };\n\n const chipStyle = css([\n styles.root,\n variantStyleMap[variant],\n styleProp,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.subtitle2,\n color: fontColor,\n });\n\n const textMarginSize = theme.spacing(1);\n const textMarginStyle = startIconProp\n ? { marginLeft: textMarginSize }\n : endIconProp\n ? { marginRight: textMarginSize }\n : undefined;\n\n const textStyle = css([\n fontStyle,\n textMarginStyle,\n { textAlign: 'center' },\n ]);\n\n const startIcon = cloneSvgIcon(startIconProp, { size: ICON_SIZE, color: fontColor });\n const endIcon = cloneSvgIcon(endIconProp, { size: ICON_SIZE, color: fontColor });\n\n return (\n <ButtonBase\n onPress={onPress}\n style={chipStyle}\n {...otherProps}\n >\n {startIcon}\n\n <Text\n children={children}\n style={textStyle}\n />\n\n {endIcon}\n </ButtonBase>\n );\n}"]}
1
+ {"version":3,"sources":["Chip.tsx"],"names":["React","Text","cloneSvgIcon","createFontStyle","css","useTheme","ButtonBase","ICON_SIZE","useStyles","theme","root","alignItems","borderRadius","flexDirection","height","justifyContent","paddingLeft","spacing","paddingRight","Chip","props","children","endIcon","endIconProp","onPress","startIcon","startIconProp","style","styleProp","variant","otherProps","styles","fontColor","palette","tertiary","main","primary","variantStyleMap","outlined","backgroundColor","paper","default","borderColor","border","borderWidth","filled","grey","bold","chipStyle","fontStyle","selector","typo","subtitle2","color","textMarginSize","textMarginStyle","marginLeft","marginRight","undefined","textStyle","textAlign","size"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { cloneSvgIcon, createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase';\nimport type ChipProps from './ChipProps';\n\ntype ChipStyles = NamedStylesStringUnion<'root'>;\n\nconst ICON_SIZE = 'tiny';\n\nconst useStyles: UseStyles<ChipStyles> = function (): ChipStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'center',\n borderRadius: 20,\n flexDirection: 'row',\n height: 32,\n justifyContent: 'center',\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n };\n};\n\nexport default function Chip(props: ChipProps) {\n const {\n children,\n endIcon: endIconProp,\n onPress,\n startIcon: startIconProp,\n style: styleProp,\n variant = 'outlined',\n ...otherProps\n } = props;\n\n const theme = useTheme();\n const styles = useStyles();\n\n const fontColor = variant === 'outlined'\n ? theme.palette.tertiary.main\n : theme.palette.primary.main;\n\n const variantStyleMap = {\n outlined: {\n backgroundColor: theme.palette.paper.default,\n borderColor: theme.palette.border,\n borderWidth: 2,\n },\n filled: {\n backgroundColor: theme.palette.paper.grey,\n },\n bold: {\n backgroundColor: theme.palette.paper.grey,\n borderColor: theme.palette.primary.main,\n borderWidth: 2,\n },\n };\n\n const chipStyle = css([\n styles.root,\n variantStyleMap[variant],\n styleProp,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.subtitle2,\n color: fontColor,\n });\n\n const textMarginSize = theme.spacing(1);\n const textMarginStyle = startIconProp\n ? { marginLeft: textMarginSize }\n : endIconProp\n ? { marginRight: textMarginSize }\n : undefined;\n\n const textStyle = css([\n fontStyle,\n textMarginStyle,\n { textAlign: 'center' },\n ]);\n\n const startIcon = cloneSvgIcon(startIconProp, { size: ICON_SIZE, color: fontColor });\n const endIcon = cloneSvgIcon(endIconProp, { size: ICON_SIZE, color: fontColor });\n\n return (\n <ButtonBase\n onPress={onPress}\n style={chipStyle}\n {...otherProps}\n >\n {startIcon}\n\n <Text\n children={children}\n style={textStyle}\n />\n\n {endIcon}\n </ButtonBase>\n );\n}\n"]}
@@ -50,9 +50,13 @@ export default function Radio(props) {
50
50
  onPress: handlePress,
51
51
  style: rootStyle
52
52
  }, otherProps), isChecked ? /*#__PURE__*/React.createElement(RadioCheckedIcon, {
53
- fill: checkedColor
53
+ fill: checkedColor,
54
+ height: 20,
55
+ width: 20
54
56
  }) : /*#__PURE__*/React.createElement(RadioIcon, {
55
- fill: color
57
+ fill: color,
58
+ height: 20,
59
+ width: 20
56
60
  }), children ? children : null);
57
61
  }
58
62
  ;
@@ -1 +1 @@
1
- {"version":3,"sources":["Radio.tsx"],"names":["React","ButtonBase","Radio","RadioIcon","RadioChecked","RadioCheckedIcon","css","useTheme","RadioContext","useStyles","root","alignItems","flexDirection","props","checked","children","disabled","onChange","onChangeProp","style","value","otherProps","styles","theme","context","useContext","handlePress","isChecked","color","palette","tertiary","main","checkedColor","primary","rootStyle"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,KAAK,IAAIC,SAAlB,EAA6BC,YAAY,IAAIC,gBAA7C,QAAqE,aAArE;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AACA,SAASC,YAAT,QAA6B,oCAA7B;;AAKA,MAAMC,SAAiC,GAAG,YAAyB;AAC/D,SAAO;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,UAAU,EAAE,QADV;AAEFC,MAAAA,aAAa,EAAE;AAFb;AADH,GAAP;AAMH,CAPD;;AASA,eAAe,SAASV,KAAT,CAAeW,KAAf,EAAkC;AAAA;;AAC7C,QAAM;AACFC,IAAAA,OAAO,GAAG,KADR;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,QAAQ,EAAEC,YAJR;AAKFC,IAAAA,KALE;AAMFC,IAAAA,KANE;AAOF,OAAGC;AAPD,MAQFR,KARJ;AAUA,QAAMS,MAAM,GAAGb,SAAS,EAAxB;AAEA,QAAMc,KAAK,GAAGhB,QAAQ,EAAtB;AAEA,QAAMiB,OAAO,GAAGxB,KAAK,CAACyB,UAAN,CAAiBjB,YAAjB,CAAhB;;AAEA,QAAMkB,WAAW,GAAG,MAAM;AAAA;;AACtB,UAAMT,QAAQ,wBAAGO,OAAH,aAAGA,OAAH,uBAAGA,OAAO,CAAEP,QAAZ,iEAAwBC,YAAtC;;AACA,QAAID,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACG,KAAD,CAAR;AACH;AACJ,GALD;;AAOA,QAAMO,SAAS,WAAG,CAAAH,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEJ,KAAT,MAAmBA,KAAtB,uCAA+BN,OAA9C;AAEA,QAAMc,KAAK,GAAGL,KAAK,CAACM,OAAN,CAAcC,QAAd,CAAuBC,IAArC;AACA,QAAMC,YAAY,GAAGT,KAAK,CAACM,OAAN,CAAcI,OAAd,CAAsBF,IAA3C;AAEA,QAAMG,SAAS,GAAG5B,GAAG,CAAC,CAClBgB,MAAM,CAACZ,IADW,EAElBS,KAFkB,CAAD,CAArB;AAKA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEH,QADd;AAEI,IAAA,OAAO,EAAEU,WAFb;AAGI,IAAA,KAAK,EAAEQ;AAHX,KAIQb,UAJR,GAMKM,SAAS,gBACJ,oBAAC,gBAAD;AAAkB,IAAA,IAAI,EAAEK;AAAxB,IADI,gBAEJ,oBAAC,SAAD;AAAW,IAAA,IAAI,EAAEJ;AAAjB,IARV,EAUKb,QAAQ,GAAGA,QAAH,GAAc,IAV3B,CADJ;AAcH;AAAA","sourcesContent":["import React from 'react';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { Radio as RadioIcon, RadioChecked as RadioCheckedIcon } from '../internal';\nimport { css, useTheme } from '../styles';\nimport { RadioContext } from '../RadioGroup/RadioContextProvider';\nimport type RadioProps from './RadioProps';\n\ntype RadioStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<RadioStyles> = function (): RadioStyles {\n return {\n root: {\n alignItems: 'center',\n flexDirection: 'row',\n },\n };\n};\n\nexport default function Radio(props: RadioProps) {\n const {\n checked = false,\n children,\n disabled = false,\n onChange: onChangeProp,\n style,\n value,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const context = React.useContext(RadioContext);\n\n const handlePress = () => {\n const onChange = context?.onChange ?? onChangeProp;\n if (onChange) {\n onChange(value);\n }\n };\n\n const isChecked = context?.value === value ?? checked;\n\n const color = theme.palette.tertiary.main;\n const checkedColor = theme.palette.primary.main;\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n {isChecked\n ? <RadioCheckedIcon fill={checkedColor}/>\n : <RadioIcon fill={color}/>\n }\n {children ? children : null}\n </ButtonBase>\n );\n};\n"]}
1
+ {"version":3,"sources":["Radio.tsx"],"names":["React","ButtonBase","Radio","RadioIcon","RadioChecked","RadioCheckedIcon","css","useTheme","RadioContext","useStyles","root","alignItems","flexDirection","props","checked","children","disabled","onChange","onChangeProp","style","value","otherProps","styles","theme","context","useContext","handlePress","isChecked","color","palette","tertiary","main","checkedColor","primary","rootStyle"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,KAAK,IAAIC,SAAlB,EAA6BC,YAAY,IAAIC,gBAA7C,QAAqE,aAArE;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AACA,SAASC,YAAT,QAA6B,oCAA7B;;AAKA,MAAMC,SAAiC,GAAG,YAAyB;AAC/D,SAAO;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,UAAU,EAAE,QADV;AAEFC,MAAAA,aAAa,EAAE;AAFb;AADH,GAAP;AAMH,CAPD;;AASA,eAAe,SAASV,KAAT,CAAeW,KAAf,EAAkC;AAAA;;AAC7C,QAAM;AACFC,IAAAA,OAAO,GAAG,KADR;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,QAAQ,EAAEC,YAJR;AAKFC,IAAAA,KALE;AAMFC,IAAAA,KANE;AAOF,OAAGC;AAPD,MAQFR,KARJ;AAUA,QAAMS,MAAM,GAAGb,SAAS,EAAxB;AAEA,QAAMc,KAAK,GAAGhB,QAAQ,EAAtB;AAEA,QAAMiB,OAAO,GAAGxB,KAAK,CAACyB,UAAN,CAAiBjB,YAAjB,CAAhB;;AAEA,QAAMkB,WAAW,GAAG,MAAM;AAAA;;AACtB,UAAMT,QAAQ,wBAAGO,OAAH,aAAGA,OAAH,uBAAGA,OAAO,CAAEP,QAAZ,iEAAwBC,YAAtC;;AACA,QAAID,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACG,KAAD,CAAR;AACH;AACJ,GALD;;AAOA,QAAMO,SAAS,WAAG,CAAAH,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEJ,KAAT,MAAmBA,KAAtB,uCAA+BN,OAA9C;AAEA,QAAMc,KAAK,GAAGL,KAAK,CAACM,OAAN,CAAcC,QAAd,CAAuBC,IAArC;AACA,QAAMC,YAAY,GAAGT,KAAK,CAACM,OAAN,CAAcI,OAAd,CAAsBF,IAA3C;AAEA,QAAMG,SAAS,GAAG5B,GAAG,CAAC,CAClBgB,MAAM,CAACZ,IADW,EAElBS,KAFkB,CAAD,CAArB;AAKA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEH,QADd;AAEI,IAAA,OAAO,EAAEU,WAFb;AAGI,IAAA,KAAK,EAAEQ;AAHX,KAIQb,UAJR,GAMKM,SAAS,gBACN,oBAAC,gBAAD;AACI,IAAA,IAAI,EAAEK,YADV;AAEI,IAAA,MAAM,EAAE,EAFZ;AAGI,IAAA,KAAK,EAAE;AAHX,IADM,gBAON,oBAAC,SAAD;AACI,IAAA,IAAI,EAAEJ,KADV;AAEI,IAAA,MAAM,EAAE,EAFZ;AAGI,IAAA,KAAK,EAAE;AAHX,IAbR,EAmBKb,QAAQ,GAAGA,QAAH,GAAc,IAnB3B,CADJ;AAuBH;AAAA","sourcesContent":["import React from 'react';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { Radio as RadioIcon, RadioChecked as RadioCheckedIcon } from '../internal';\nimport { css, useTheme } from '../styles';\nimport { RadioContext } from '../RadioGroup/RadioContextProvider';\nimport type RadioProps from './RadioProps';\n\ntype RadioStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<RadioStyles> = function (): RadioStyles {\n return {\n root: {\n alignItems: 'center',\n flexDirection: 'row',\n },\n };\n};\n\nexport default function Radio(props: RadioProps) {\n const {\n checked = false,\n children,\n disabled = false,\n onChange: onChangeProp,\n style,\n value,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const context = React.useContext(RadioContext);\n\n const handlePress = () => {\n const onChange = context?.onChange ?? onChangeProp;\n if (onChange) {\n onChange(value);\n }\n };\n\n const isChecked = context?.value === value ?? checked;\n\n const color = theme.palette.tertiary.main;\n const checkedColor = theme.palette.primary.main;\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n {isChecked ? (\n <RadioCheckedIcon\n fill={checkedColor}\n height={20}\n width={20}\n />\n ) : (\n <RadioIcon\n fill={color}\n height={20}\n width={20}\n />\n )}\n {children ? children : null}\n </ButtonBase>\n );\n};\n"]}
@@ -28,10 +28,12 @@ const useStyles = function () {
28
28
 
29
29
  export default function Snackbar(props) {
30
30
  const {
31
+ actionLabel,
31
32
  animatedY,
32
33
  autoHideDuration = null,
33
34
  children,
34
35
  message,
36
+ onActionPress,
35
37
  onClose,
36
38
  style,
37
39
  visible = false,
@@ -76,7 +78,9 @@ export default function Snackbar(props) {
76
78
  onEnter: () => setExited(false),
77
79
  onExited: () => setExited(true)
78
80
  }, children ? children : /*#__PURE__*/React.createElement(SnackbarContent, {
79
- message: message
81
+ actionLabel: actionLabel,
82
+ message: message,
83
+ onActionPress: onActionPress
80
84
  })));
81
85
  }
82
86
  ;
@@ -1 +1 @@
1
- {"version":3,"sources":["Snackbar.tsx"],"names":["React","View","useSafeAreaInsets","css","Slide","SnackbarContent","useTheme","useStyles","theme","insets","root","alignSelf","bottom","spacing","maxWidth","paddingBottom","paddingHorizontal","position","width","zIndex","Snackbar","props","animatedY","autoHideDuration","children","message","onClose","style","visible","otherProps","autoHideTimer","useRef","clearAutoHideTimeout","current","clearTimeout","useEffect","setTimeout","styles","exited","setExited","useState"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { css, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Slide from '../Slide';\nimport SnackbarContent from '../SnackbarContent';\nimport { useTheme } from '../styles';\nimport type SnackbarProps from './SnackbarProps';\n\ntype SnackBarStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<SnackBarStyles> = function (): SnackBarStyles {\n const theme = useTheme();\n const insets = useSafeAreaInsets();\n\n return {\n root: {\n alignSelf: 'center',\n bottom: theme.spacing(2),\n maxWidth: 480,\n paddingBottom: insets.bottom,\n paddingHorizontal: theme.spacing(2),\n position: 'absolute',\n width: '100%',\n // TODO: Need to remove zIndex.\n zIndex: 32,\n },\n };\n};\n\nexport default function Snackbar(props: SnackbarProps) {\n const {\n animatedY,\n autoHideDuration = null,\n children,\n message,\n onClose,\n style,\n visible = false,\n ...otherProps\n } = props;\n\n const autoHideTimer = React.useRef<number | null>(null);\n\n const clearAutoHideTimeout = () => {\n if (autoHideTimer.current !== null) {\n clearTimeout(autoHideTimer.current);\n }\n };\n\n React.useEffect(() => {\n return () => {\n clearAutoHideTimeout();\n };\n }, []);\n\n React.useEffect(() => {\n if (visible && autoHideDuration !== null) {\n clearAutoHideTimeout();\n\n // @ts-ignore\n autoHideTimer.current = setTimeout(() => {\n if (onClose) {\n onClose();\n }\n }, autoHideDuration);\n }\n }, [visible, autoHideDuration, onClose]);\n\n const styles = useStyles();\n\n const [exited, setExited] = React.useState(true);\n\n if (!visible && exited) {\n return null;\n }\n\n return (\n <View\n style={css([\n styles.root,\n style,\n ])}\n {...otherProps}\n >\n <Slide\n animatedY={animatedY}\n appear={visible}\n onEnter={() => setExited(false)}\n onExited={() => setExited(true)}\n >\n {children ? children : (\n <SnackbarContent message={message}/>\n )}\n </Slide>\n </View>\n );\n};\n"]}
1
+ {"version":3,"sources":["Snackbar.tsx"],"names":["React","View","useSafeAreaInsets","css","Slide","SnackbarContent","useTheme","useStyles","theme","insets","root","alignSelf","bottom","spacing","maxWidth","paddingBottom","paddingHorizontal","position","width","zIndex","Snackbar","props","actionLabel","animatedY","autoHideDuration","children","message","onActionPress","onClose","style","visible","otherProps","autoHideTimer","useRef","clearAutoHideTimeout","current","clearTimeout","useEffect","setTimeout","styles","exited","setExited","useState"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { css, NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Slide from '../Slide';\nimport SnackbarContent from '../SnackbarContent';\nimport { useTheme } from '../styles';\nimport type SnackbarProps from './SnackbarProps';\n\ntype SnackBarStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<SnackBarStyles> = function (): SnackBarStyles {\n const theme = useTheme();\n const insets = useSafeAreaInsets();\n\n return {\n root: {\n alignSelf: 'center',\n bottom: theme.spacing(2),\n maxWidth: 480,\n paddingBottom: insets.bottom,\n paddingHorizontal: theme.spacing(2),\n position: 'absolute',\n width: '100%',\n // TODO: Need to remove zIndex.\n zIndex: 32,\n },\n };\n};\n\nexport default function Snackbar(props: SnackbarProps) {\n const {\n actionLabel,\n animatedY,\n autoHideDuration = null,\n children,\n message,\n onActionPress,\n onClose,\n style,\n visible = false,\n ...otherProps\n } = props;\n\n const autoHideTimer = React.useRef<number | null>(null);\n\n const clearAutoHideTimeout = () => {\n if (autoHideTimer.current !== null) {\n clearTimeout(autoHideTimer.current);\n }\n };\n\n React.useEffect(() => {\n return () => {\n clearAutoHideTimeout();\n };\n }, []);\n\n React.useEffect(() => {\n if (visible && autoHideDuration !== null) {\n clearAutoHideTimeout();\n\n // @ts-ignore\n autoHideTimer.current = setTimeout(() => {\n if (onClose) {\n onClose();\n }\n }, autoHideDuration);\n }\n }, [visible, autoHideDuration, onClose]);\n\n const styles = useStyles();\n\n const [exited, setExited] = React.useState(true);\n\n if (!visible && exited) {\n return null;\n }\n\n return (\n <View\n style={css([\n styles.root,\n style,\n ])}\n {...otherProps}\n >\n <Slide\n animatedY={animatedY}\n appear={visible}\n onEnter={() => setExited(false)}\n onExited={() => setExited(true)}\n >\n {children ? children : (\n <SnackbarContent\n actionLabel={actionLabel}\n message={message}\n onActionPress={onActionPress}\n />\n )}\n </Slide>\n </View>\n );\n};\n"]}
@@ -4,7 +4,9 @@ import React from 'react';
4
4
  import { Text } from 'react-native';
5
5
  import { rgb } from '@fountain-ui/utils';
6
6
  import { createFontStyle, css, useTheme } from '../styles';
7
+ import ButtonBase from '../ButtonBase';
7
8
  import Paper from '../Paper';
9
+ import Spacer from '../Spacer';
8
10
 
9
11
  const useStyles = function () {
10
12
  const theme = useTheme();
@@ -16,29 +18,52 @@ const useStyles = function () {
16
18
  borderRadius: theme.shape.roundness,
17
19
  paddingHorizontal: theme.spacing(4),
18
20
  paddingVertical: theme.spacing(3)
21
+ },
22
+ action: {
23
+ alignItems: 'center',
24
+ flexDirection: 'row',
25
+ justifyContent: 'space-between',
26
+ paddingVertical: theme.spacing(2)
19
27
  }
20
28
  };
21
29
  };
22
30
 
23
31
  export default function SnackbarContent(props) {
24
32
  const {
33
+ actionLabel,
25
34
  message,
35
+ onActionPress,
26
36
  style,
27
37
  ...otherProps
28
38
  } = props;
29
39
  const styles = useStyles();
30
40
  const theme = useTheme();
31
- const fontStyle = createFontStyle(theme, {
41
+ const messageFontStyle = createFontStyle(theme, {
32
42
  selector: typo => typo.body2,
33
43
  color: theme.palette.primary.contrastTextColor
34
44
  });
45
+ const labelFontStyle = createFontStyle(theme, {
46
+ selector: typo => typo.button2,
47
+ color: theme.palette.primary.contrastTextColor
48
+ });
49
+ const labelStyle = css([labelFontStyle, {
50
+ padding: theme.spacing(2)
51
+ }]);
35
52
  return /*#__PURE__*/React.createElement(Paper, _extends({
36
53
  elevation: 0,
37
- style: css([styles.root, style])
54
+ style: css([styles.root, actionLabel ? styles.action : undefined, style])
38
55
  }, otherProps), /*#__PURE__*/React.createElement(Text, {
39
56
  children: message,
40
- style: css([fontStyle])
41
- }));
57
+ style: css([messageFontStyle])
58
+ }), actionLabel ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Spacer, {
59
+ size: 1
60
+ }), /*#__PURE__*/React.createElement(ButtonBase, {
61
+ onPress: onActionPress,
62
+ pressEffect: 'none'
63
+ }, /*#__PURE__*/React.createElement(Text, {
64
+ children: actionLabel,
65
+ style: labelStyle
66
+ }))) : null);
42
67
  }
43
68
  ;
44
69
  //# sourceMappingURL=SnackbarContent.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["SnackbarContent.tsx"],"names":["React","Text","rgb","createFontStyle","css","useTheme","Paper","useStyles","theme","backgroundColor","palette","primary","main","r","g","b","useMemo","root","borderRadius","shape","roundness","paddingHorizontal","spacing","paddingVertical","SnackbarContent","props","message","style","otherProps","styles","fontStyle","selector","typo","body2","color","contrastTextColor"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,GAAT,QAAoB,oBAApB;AACA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,QAA/B,QAA+C,WAA/C;AACA,OAAOC,KAAP,MAAkB,UAAlB;;AAKA,MAAMC,SAA2C,GAAG,YAAmC;AACnF,QAAMC,KAAK,GAAGH,QAAQ,EAAtB;AAEA,QAAMI,eAAe,GAAGD,KAAK,CAACE,OAAN,CAAcC,OAAd,CAAsBC,IAA9C;AACA,QAAM,CAACC,CAAD,EAAIC,CAAJ,EAAOC,CAAP,IAAYf,KAAK,CAACgB,OAAN,CAAc,MAAMd,GAAG,CAACO,eAAD,CAAvB,EAA0C,CAACA,eAAD,CAA1C,CAAlB;AAEA,SAAO;AACHQ,IAAAA,IAAI,EAAE;AACFR,MAAAA,eAAe,EAAG,QAAOI,CAAE,KAAIC,CAAE,KAAIC,CAAE,OADrC;AAEFG,MAAAA,YAAY,EAAEV,KAAK,CAACW,KAAN,CAAYC,SAFxB;AAGFC,MAAAA,iBAAiB,EAAEb,KAAK,CAACc,OAAN,CAAc,CAAd,CAHjB;AAIFC,MAAAA,eAAe,EAAEf,KAAK,CAACc,OAAN,CAAc,CAAd;AAJf;AADH,GAAP;AAQH,CAdD;;AAgBA,eAAe,SAASE,eAAT,CAAyBC,KAAzB,EAAsD;AACjE,QAAM;AACFC,IAAAA,OADE;AAEFC,IAAAA,KAFE;AAGF,OAAGC;AAHD,MAIFH,KAJJ;AAMA,QAAMI,MAAM,GAAGtB,SAAS,EAAxB;AAEA,QAAMC,KAAK,GAAGH,QAAQ,EAAtB;AAEA,QAAMyB,SAAS,GAAG3B,eAAe,CAACK,KAAD,EAAQ;AACrCuB,IAAAA,QAAQ,EAAGC,IAAD,IAAUA,IAAI,CAACC,KADY;AAErCC,IAAAA,KAAK,EAAE1B,KAAK,CAACE,OAAN,CAAcC,OAAd,CAAsBwB;AAFQ,GAAR,CAAjC;AAKA,sBACI,oBAAC,KAAD;AACI,IAAA,SAAS,EAAE,CADf;AAEI,IAAA,KAAK,EAAE/B,GAAG,CAAC,CACPyB,MAAM,CAACZ,IADA,EAEPU,KAFO,CAAD;AAFd,KAMQC,UANR,gBAQI,oBAAC,IAAD;AACI,IAAA,QAAQ,EAAEF,OADd;AAEI,IAAA,KAAK,EAAEtB,GAAG,CAAC,CACP0B,SADO,CAAD;AAFd,IARJ,CADJ;AAiBH;AAAA","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { rgb } from '@fountain-ui/utils';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport Paper from '../Paper';\nimport type SnackbarContentProps from './SnackbarContentProps';\n\ntype SnackBarContentStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<SnackBarContentStyles> = function (): SnackBarContentStyles {\n const theme = useTheme();\n\n const backgroundColor = theme.palette.primary.main;\n const [r, g, b] = React.useMemo(() => rgb(backgroundColor), [backgroundColor]);\n\n return {\n root: {\n backgroundColor: `rgba(${r}, ${g}, ${b}, .9)`,\n borderRadius: theme.shape.roundness,\n paddingHorizontal: theme.spacing(4),\n paddingVertical: theme.spacing(3),\n },\n };\n};\n\nexport default function SnackbarContent(props: SnackbarContentProps) {\n const {\n message,\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.body2,\n color: theme.palette.primary.contrastTextColor,\n });\n\n return (\n <Paper\n elevation={0}\n style={css([\n styles.root,\n style,\n ])}\n {...otherProps}\n >\n <Text\n children={message}\n style={css([\n fontStyle,\n ])}\n />\n </Paper>\n );\n};\n"]}
1
+ {"version":3,"sources":["SnackbarContent.tsx"],"names":["React","Text","rgb","createFontStyle","css","useTheme","ButtonBase","Paper","Spacer","useStyles","theme","backgroundColor","palette","primary","main","r","g","b","useMemo","root","borderRadius","shape","roundness","paddingHorizontal","spacing","paddingVertical","action","alignItems","flexDirection","justifyContent","SnackbarContent","props","actionLabel","message","onActionPress","style","otherProps","styles","messageFontStyle","selector","typo","body2","color","contrastTextColor","labelFontStyle","button2","labelStyle","padding","undefined"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { rgb } from '@fountain-ui/utils';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase';\nimport Paper from '../Paper';\nimport Spacer from '../Spacer';\nimport type SnackbarContentProps from './SnackbarContentProps';\n\ntype SnackBarContentStyles = NamedStylesStringUnion<'root' | 'action'>;\n\nconst useStyles: UseStyles<SnackBarContentStyles> = function (): SnackBarContentStyles {\n const theme = useTheme();\n\n const backgroundColor = theme.palette.primary.main;\n const [r, g, b] = React.useMemo(() => rgb(backgroundColor), [backgroundColor]);\n\n return {\n root: {\n backgroundColor: `rgba(${r}, ${g}, ${b}, .9)`,\n borderRadius: theme.shape.roundness,\n paddingHorizontal: theme.spacing(4),\n paddingVertical: theme.spacing(3),\n },\n action: {\n alignItems: 'center',\n flexDirection: 'row',\n justifyContent: 'space-between',\n paddingVertical: theme.spacing(2),\n },\n };\n};\n\nexport default function SnackbarContent(props: SnackbarContentProps) {\n const {\n actionLabel,\n message,\n onActionPress,\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const messageFontStyle = createFontStyle(theme, {\n selector: (typo) => typo.body2,\n color: theme.palette.primary.contrastTextColor,\n });\n\n const labelFontStyle = createFontStyle(theme, {\n selector: (typo) => typo.button2,\n color: theme.palette.primary.contrastTextColor,\n });\n\n const labelStyle = css([\n labelFontStyle,\n { padding: theme.spacing(2) },\n ]);\n\n return (\n <Paper\n elevation={0}\n style={css([\n styles.root,\n actionLabel ? styles.action : undefined,\n style,\n ])}\n {...otherProps}\n >\n <Text\n children={message}\n style={css([\n messageFontStyle,\n ])}\n />\n\n {actionLabel ? (\n <React.Fragment>\n <Spacer size={1}/>\n\n <ButtonBase\n onPress={onActionPress}\n pressEffect={'none'}\n >\n <Text\n children={actionLabel}\n style={labelStyle}\n />\n </ButtonBase>\n </React.Fragment>\n ) : null}\n </Paper>\n );\n};\n"]}
@@ -42,13 +42,15 @@ export default function Tab(props) {
42
42
  selector: typo => variant === 'primary' ? typo.h2 : variant === 'secondary' ? typo.button2 : typo.flag,
43
43
  color
44
44
  });
45
+ const pressEffect = selected ? 'none' : 'opacity';
45
46
  const icon = selected ? selectedIcon || defaultIcon : defaultIcon;
46
47
  const iconElement = icon ? /*#__PURE__*/React.cloneElement(icon, {
47
48
  fill: color
48
49
  }) : null;
49
50
  return /*#__PURE__*/React.createElement(TabBase, _extends({
50
- vertical: vertical,
51
- style: tabBaseStyle
51
+ pressEffect: pressEffect,
52
+ style: tabBaseStyle,
53
+ vertical: vertical
52
54
  }, otherProps), /*#__PURE__*/React.createElement(Badge, {
53
55
  children: iconElement,
54
56
  invisible: !badgeVisible
@@ -1 +1 @@
1
- {"version":3,"sources":["Tab.tsx"],"names":["React","Platform","Text","Badge","TabBase","createFontStyle","css","StyleSheet","useTheme","TabIndicator","styles","create","root","OS","minWidth","primary","minHeight","secondary","bottomNavigation","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","selected","selectedIcon","variant","style","otherProps","theme","vertical","color","palette","text","hint","tabBaseStyle","fontStyle","selector","typo","h2","button2","flag","iconElement","cloneElement","fill"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAT,EAAmBC,IAAnB,QAA+B,cAA/B;AACA,OAAOC,KAAP,MAAkB,UAAlB;AACA,OAAOC,OAAP,MAAoB,YAApB;AAEA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,UAA/B,EAA2CC,QAA3C,QAA2D,WAA3D;AACA,OAAOC,YAAP,MAAyB,gBAAzB;AAEA,MAAMC,MAAM,GAAGH,UAAU,CAACI,MAAX,CAAkB;AAC7BC,EAAAA,IAAI,EAAE,EACF;AACA,QAAIX,QAAQ,CAACY,EAAT,KAAgB,KAAhB,GAAwB;AAAEC,MAAAA,QAAQ,EAAE;AAAZ,KAAxB,GAA+C,EAAnD;AAFE,GADuB;AAK7BC,EAAAA,OAAO,EAAE;AACLC,IAAAA,SAAS,EAAE;AADN,GALoB;AAQ7BC,EAAAA,SAAS,EAAE;AACPD,IAAAA,SAAS,EAAE;AADJ,GARkB;AAW7BE,EAAAA,gBAAgB,EAAE;AACdF,IAAAA,SAAS,EAAE;AADG;AAXW,CAAlB,CAAf;AAgBA,eAAe,SAASG,GAAT,CAAaC,KAAb,EAA8B;AACzC,QAAM;AACFC,IAAAA,YAAY,GAAG,KADb;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,eAHE;AAIFC,IAAAA,IAAI,EAAEC,WAJJ;AAKFC,IAAAA,QALE;AAMFC,IAAAA,YANE;AAOFC,IAAAA,OAAO,GAAG,SAPR;AAQFC,IAAAA,KARE;AASF,OAAGC;AATD,MAUFV,KAVJ;AAYA,QAAMW,KAAK,GAAGvB,QAAQ,EAAtB;AAEA,QAAMwB,QAAQ,GAAGJ,OAAO,KAAK,mBAA7B;AAEA,QAAMK,KAAK,GAAGP,QAAQ,GAAGK,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBpB,OAAtB,GAAgCgB,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmBC,IAAzE;AAEA,QAAMC,YAAY,GAAG/B,GAAG,CAAC,CACrBI,MAAM,CAACE,IADc,EAErBgB,OAAO,KAAK,SAAZ,GACMlB,MAAM,CAACK,OADb,GAEOa,OAAO,KAAK,WAAZ,GAA0BlB,MAAM,CAACO,SAAjC,GAA6CP,MAAM,CAACQ,gBAJtC,EAKrBW,KALqB,CAAD,CAAxB;AAQA,QAAMS,SAAS,GAAGjC,eAAe,CAAC0B,KAAD,EAAQ;AACrCQ,IAAAA,QAAQ,EAAGC,IAAD,IAAUZ,OAAO,KAAK,SAAZ,GACdY,IAAI,CAACC,EADS,GAEbb,OAAO,KAAK,WAAZ,GAA0BY,IAAI,CAACE,OAA/B,GAAyCF,IAAI,CAACG,IAHhB;AAIrCV,IAAAA;AAJqC,GAAR,CAAjC;AAOA,QAAMT,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;AACA,QAAMmB,WAAW,GAAGpB,IAAI,gBAAGxB,KAAK,CAAC6C,YAAN,CAAmBrB,IAAnB,EAAyB;AAAEsB,IAAAA,IAAI,EAAEb;AAAR,GAAzB,CAAH,GAA+C,IAAvE;AAEA,sBACI,oBAAC,OAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,KAAK,EAAEK;AAFX,KAGQP,UAHR,gBAKI,oBAAC,KAAD;AACI,IAAA,QAAQ,EAAEc,WADd;AAEI,IAAA,SAAS,EAAE,CAACvB;AAFhB,IALJ,eAUI,oBAAC,IAAD;AACI,IAAA,QAAQ,EAAEC,QADd;AAEI,IAAA,KAAK,EAAEhB,GAAG,CAACgC,SAAD;AAFd,IAVJ,EAeKf,eAAe,gBAAG,oBAAC,YAAD,OAAH,GAAqB,IAfzC,CADJ;AAmBH;AAAA","sourcesContent":["import React from 'react';\nimport { Platform, Text } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport type TabProps from './TabProps';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport TabIndicator from './TabIndicator';\n\nconst styles = StyleSheet.create({\n root: {\n // TODO: Remove redundant platform checking\n ...(Platform.OS === 'web' ? { minWidth: 'auto' } : {}),\n },\n primary: {\n minHeight: 48,\n },\n secondary: {\n minHeight: 48,\n },\n bottomNavigation: {\n minHeight: 56,\n },\n});\n\nexport default function Tab(props: TabProps) {\n const {\n badgeVisible = false,\n children,\n enableIndicator,\n icon: defaultIcon,\n selected,\n selectedIcon,\n variant = 'primary',\n style,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const vertical = variant === 'bottom-navigation';\n\n const color = selected ? theme.palette.text.primary : theme.palette.text.hint;\n\n const tabBaseStyle = css([\n styles.root,\n variant === 'primary'\n ? styles.primary\n : (variant === 'secondary' ? styles.secondary : styles.bottomNavigation),\n style,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => variant === 'primary'\n ? typo.h2\n : (variant === 'secondary' ? typo.button2 : typo.flag),\n color,\n });\n\n const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n const iconElement = icon ? React.cloneElement(icon, { fill: color }) : null;\n\n return (\n <TabBase\n vertical={vertical}\n style={tabBaseStyle}\n {...otherProps}\n >\n <Badge\n children={iconElement}\n invisible={!badgeVisible}\n />\n\n <Text\n children={children}\n style={css(fontStyle)}\n />\n\n {enableIndicator ? <TabIndicator/> : null}\n </TabBase>\n );\n};\n"]}
1
+ {"version":3,"sources":["Tab.tsx"],"names":["React","Platform","Text","Badge","TabBase","createFontStyle","css","StyleSheet","useTheme","TabIndicator","styles","create","root","OS","minWidth","primary","minHeight","secondary","bottomNavigation","Tab","props","badgeVisible","children","enableIndicator","icon","defaultIcon","selected","selectedIcon","variant","style","otherProps","theme","vertical","color","palette","text","hint","tabBaseStyle","fontStyle","selector","typo","h2","button2","flag","pressEffect","iconElement","cloneElement","fill"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Platform, Text } from 'react-native';\nimport Badge from '../Badge';\nimport TabBase from '../TabBase';\nimport type TabProps from './TabProps';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport TabIndicator from './TabIndicator';\n\nconst styles = StyleSheet.create({\n root: {\n // TODO: Remove redundant platform checking\n ...(Platform.OS === 'web' ? { minWidth: 'auto' } : {}),\n },\n primary: {\n minHeight: 48,\n },\n secondary: {\n minHeight: 48,\n },\n bottomNavigation: {\n minHeight: 56,\n },\n});\n\nexport default function Tab(props: TabProps) {\n const {\n badgeVisible = false,\n children,\n enableIndicator,\n icon: defaultIcon,\n selected,\n selectedIcon,\n variant = 'primary',\n style,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const vertical = variant === 'bottom-navigation';\n\n const color = selected ? theme.palette.text.primary : theme.palette.text.hint;\n\n const tabBaseStyle = css([\n styles.root,\n variant === 'primary'\n ? styles.primary\n : (variant === 'secondary' ? styles.secondary : styles.bottomNavigation),\n style,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => variant === 'primary'\n ? typo.h2\n : (variant === 'secondary' ? typo.button2 : typo.flag),\n color,\n });\n\n const pressEffect = selected ? 'none' : 'opacity';\n\n const icon = selected ? (selectedIcon || defaultIcon) : defaultIcon;\n const iconElement = icon ? React.cloneElement(icon, { fill: color }) : null;\n\n return (\n <TabBase\n pressEffect={pressEffect}\n style={tabBaseStyle}\n vertical={vertical}\n {...otherProps}\n >\n <Badge\n children={iconElement}\n invisible={!badgeVisible}\n />\n\n <Text\n children={children}\n style={css(fontStyle)}\n />\n\n {enableIndicator ? <TabIndicator/> : null}\n </TabBase>\n );\n};\n"]}
@@ -37,7 +37,7 @@ export default function Tooltip(props) {
37
37
  scale: scale.value
38
38
  }]
39
39
  }));
40
- const [r, g, b] = rgb(theme.palette.tertiary.main);
40
+ const [r, g, b] = rgb(theme.palette.primary.main);
41
41
  const totalVerticalOffset = -(layout.height + verticalOffset);
42
42
  const tooltipLayoutStyle = {
43
43
  alignItems: 'center',
@@ -63,12 +63,13 @@ export default function Tooltip(props) {
63
63
  };
64
64
  const fontStyle = createFontStyle(theme, {
65
65
  selector: typo => typo.caption2,
66
- color: theme.palette.tertiary.contrastTextColor
66
+ color: theme.palette.primary.contrastTextColor
67
67
  });
68
68
  const textStyle = css([fontStyle, {
69
69
  marginRight: theme.spacing(2)
70
70
  }]);
71
71
  const buttonElem = /*#__PURE__*/React.createElement(TouchableWithoutFeedback, {
72
+ disallowInterruption: true,
72
73
  onPress: onClose
73
74
  }, /*#__PURE__*/React.createElement(View, {
74
75
  style: css(touchableStyle)
@@ -78,13 +79,13 @@ export default function Tooltip(props) {
78
79
  numberOfLines: 1,
79
80
  style: textStyle
80
81
  }), /*#__PURE__*/React.createElement(CloseIcon, {
81
- fill: theme.palette.tertiary.contrastTextColor,
82
+ fill: theme.palette.primary.contrastTextColor,
82
83
  width: 20,
83
84
  height: 20
84
85
  })));
85
86
  const arrowElem = /*#__PURE__*/React.createElement(UpArrow, {
86
87
  upsideDown: placement === 'top',
87
- fill: theme.palette.tertiary.main,
88
+ fill: theme.palette.primary.main,
88
89
  opacity: defaultOpacity
89
90
  });
90
91
  return /*#__PURE__*/React.createElement(View, {