@fountain-ui/core 1.11.9 → 1.11.10

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.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [1.11.10](https://github.com/tappytoon/tappytoon/compare/@fountain-ui/core@1.11.0...@fountain-ui/core@1.11.10) (2021-10-13)
7
+
8
+ **Note:** Version bump only for package @fountain-ui/core
9
+
10
+
11
+
12
+
13
+
6
14
  ## [1.11.9](https://github.com/tappytoon/tappytoon/compare/@fountain-ui/core@1.11.0...@fountain-ui/core@1.11.9) (2021-10-13)
7
15
 
8
16
  **Note:** Version bump only for package @fountain-ui/core
@@ -34,7 +34,9 @@ const useStyles = function () {
34
34
  paddingBottom: insets.bottom,
35
35
  paddingHorizontal: theme.spacing(2),
36
36
  position: 'absolute',
37
- width: '100%'
37
+ width: '100%',
38
+ // TODO: Need to remove zIndex.
39
+ zIndex: 32
38
40
  }
39
41
  };
40
42
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["Snackbar.tsx"],"names":["useStyles","theme","insets","root","alignSelf","bottom","spacing","maxWidth","paddingBottom","paddingHorizontal","position","width","Snackbar","props","animatedY","autoHideDuration","children","message","onClose","style","visible","otherProps","autoHideTimer","React","useRef","clearAutoHideTimeout","current","clearTimeout","useEffect","setTimeout","styles","exited","setExited","useState"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAAoC,GAAG,YAA4B;AACrE,QAAMC,KAAK,GAAG,wBAAd;AACA,QAAMC,MAAM,GAAG,oDAAf;AAEA,SAAO;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,SAAS,EAAE,QADT;AAEFC,MAAAA,MAAM,EAAEJ,KAAK,CAACK,OAAN,CAAc,CAAd,CAFN;AAGFC,MAAAA,QAAQ,EAAE,GAHR;AAIFC,MAAAA,aAAa,EAAEN,MAAM,CAACG,MAJpB;AAKFI,MAAAA,iBAAiB,EAAER,KAAK,CAACK,OAAN,CAAc,CAAd,CALjB;AAMFI,MAAAA,QAAQ,EAAE,UANR;AAOFC,MAAAA,KAAK,EAAE;AAPL;AADH,GAAP;AAWH,CAfD;;AAiBe,SAASC,QAAT,CAAkBC,KAAlB,EAAwC;AACnD,QAAM;AACFC,IAAAA,SADE;AAEFC,IAAAA,gBAAgB,GAAG,IAFjB;AAGFC,IAAAA,QAHE;AAIFC,IAAAA,OAJE;AAKFC,IAAAA,OALE;AAMFC,IAAAA,KANE;AAOFC,IAAAA,OAAO,GAAG,KAPR;AAQF,OAAGC;AARD,MASFR,KATJ;;AAWA,QAAMS,aAAa,GAAGC,eAAMC,MAAN,CAA4B,IAA5B,CAAtB;;AAEA,QAAMC,oBAAoB,GAAG,MAAM;AAC/B,QAAIH,aAAa,CAACI,OAAd,KAA0B,IAA9B,EAAoC;AAChCC,MAAAA,YAAY,CAACL,aAAa,CAACI,OAAf,CAAZ;AACH;AACJ,GAJD;;AAMAH,iBAAMK,SAAN,CAAgB,MAAM;AAClB,WAAO,MAAM;AACTH,MAAAA,oBAAoB;AACvB,KAFD;AAGH,GAJD,EAIG,EAJH;;AAMAF,iBAAMK,SAAN,CAAgB,MAAM;AAClB,QAAIR,OAAO,IAAIL,gBAAgB,KAAK,IAApC,EAA0C;AACtCU,MAAAA,oBAAoB,GADkB,CAGtC;;AACAH,MAAAA,aAAa,CAACI,OAAd,GAAwBG,UAAU,CAAC,MAAM;AACrC,YAAIX,OAAJ,EAAa;AACTA,UAAAA,OAAO;AACV;AACJ,OAJiC,EAI/BH,gBAJ+B,CAAlC;AAKH;AACJ,GAXD,EAWG,CAACK,OAAD,EAAUL,gBAAV,EAA4BG,OAA5B,CAXH;;AAaA,QAAMY,MAAM,GAAG9B,SAAS,EAAxB;;AAEA,QAAM,CAAC+B,MAAD,EAASC,SAAT,IAAsBT,eAAMU,QAAN,CAAe,IAAf,CAA5B;;AAEA,MAAI,CAACb,OAAD,IAAYW,MAAhB,EAAwB;AACpB,WAAO,IAAP;AACH;;AAED,sBACI,6BAAC,iBAAD;AACI,IAAA,KAAK,EAAE,iBAAI,CACPD,MAAM,CAAC3B,IADA,EAEPgB,KAFO,CAAJ;AADX,KAKQE,UALR,gBAOI,6BAAC,cAAD;AACI,IAAA,SAAS,EAAEP,SADf;AAEI,IAAA,MAAM,EAAEM,OAFZ;AAGI,IAAA,OAAO,EAAE,MAAMY,SAAS,CAAC,KAAD,CAH5B;AAII,IAAA,QAAQ,EAAE,MAAMA,SAAS,CAAC,IAAD;AAJ7B,KAMKhB,QAAQ,GAAGA,QAAH,gBACL,6BAAC,wBAAD;AAAiB,IAAA,OAAO,EAAEC;AAA1B,IAPR,CAPJ,CADJ;AAoBH;;AAAA","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 },\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":["useStyles","theme","insets","root","alignSelf","bottom","spacing","maxWidth","paddingBottom","paddingHorizontal","position","width","zIndex","Snackbar","props","animatedY","autoHideDuration","children","message","onClose","style","visible","otherProps","autoHideTimer","React","useRef","clearAutoHideTimeout","current","clearTimeout","useEffect","setTimeout","styles","exited","setExited","useState"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAAoC,GAAG,YAA4B;AACrE,QAAMC,KAAK,GAAG,wBAAd;AACA,QAAMC,MAAM,GAAG,oDAAf;AAEA,SAAO;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,SAAS,EAAE,QADT;AAEFC,MAAAA,MAAM,EAAEJ,KAAK,CAACK,OAAN,CAAc,CAAd,CAFN;AAGFC,MAAAA,QAAQ,EAAE,GAHR;AAIFC,MAAAA,aAAa,EAAEN,MAAM,CAACG,MAJpB;AAKFI,MAAAA,iBAAiB,EAAER,KAAK,CAACK,OAAN,CAAc,CAAd,CALjB;AAMFI,MAAAA,QAAQ,EAAE,UANR;AAOFC,MAAAA,KAAK,EAAE,MAPL;AAQF;AACAC,MAAAA,MAAM,EAAE;AATN;AADH,GAAP;AAaH,CAjBD;;AAmBe,SAASC,QAAT,CAAkBC,KAAlB,EAAwC;AACnD,QAAM;AACFC,IAAAA,SADE;AAEFC,IAAAA,gBAAgB,GAAG,IAFjB;AAGFC,IAAAA,QAHE;AAIFC,IAAAA,OAJE;AAKFC,IAAAA,OALE;AAMFC,IAAAA,KANE;AAOFC,IAAAA,OAAO,GAAG,KAPR;AAQF,OAAGC;AARD,MASFR,KATJ;;AAWA,QAAMS,aAAa,GAAGC,eAAMC,MAAN,CAA4B,IAA5B,CAAtB;;AAEA,QAAMC,oBAAoB,GAAG,MAAM;AAC/B,QAAIH,aAAa,CAACI,OAAd,KAA0B,IAA9B,EAAoC;AAChCC,MAAAA,YAAY,CAACL,aAAa,CAACI,OAAf,CAAZ;AACH;AACJ,GAJD;;AAMAH,iBAAMK,SAAN,CAAgB,MAAM;AAClB,WAAO,MAAM;AACTH,MAAAA,oBAAoB;AACvB,KAFD;AAGH,GAJD,EAIG,EAJH;;AAMAF,iBAAMK,SAAN,CAAgB,MAAM;AAClB,QAAIR,OAAO,IAAIL,gBAAgB,KAAK,IAApC,EAA0C;AACtCU,MAAAA,oBAAoB,GADkB,CAGtC;;AACAH,MAAAA,aAAa,CAACI,OAAd,GAAwBG,UAAU,CAAC,MAAM;AACrC,YAAIX,OAAJ,EAAa;AACTA,UAAAA,OAAO;AACV;AACJ,OAJiC,EAI/BH,gBAJ+B,CAAlC;AAKH;AACJ,GAXD,EAWG,CAACK,OAAD,EAAUL,gBAAV,EAA4BG,OAA5B,CAXH;;AAaA,QAAMY,MAAM,GAAG/B,SAAS,EAAxB;;AAEA,QAAM,CAACgC,MAAD,EAASC,SAAT,IAAsBT,eAAMU,QAAN,CAAe,IAAf,CAA5B;;AAEA,MAAI,CAACb,OAAD,IAAYW,MAAhB,EAAwB;AACpB,WAAO,IAAP;AACH;;AAED,sBACI,6BAAC,iBAAD;AACI,IAAA,KAAK,EAAE,iBAAI,CACPD,MAAM,CAAC5B,IADA,EAEPiB,KAFO,CAAJ;AADX,KAKQE,UALR,gBAOI,6BAAC,cAAD;AACI,IAAA,SAAS,EAAEP,SADf;AAEI,IAAA,MAAM,EAAEM,OAFZ;AAGI,IAAA,OAAO,EAAE,MAAMY,SAAS,CAAC,KAAD,CAH5B;AAII,IAAA,QAAQ,EAAE,MAAMA,SAAS,CAAC,IAAD;AAJ7B,KAMKhB,QAAQ,GAAGA,QAAH,gBACL,6BAAC,wBAAD;AAAiB,IAAA,OAAO,EAAEC;AAA1B,IAPR,CAPJ,CADJ;AAoBH;;AAAA","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"]}
@@ -22,6 +22,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
22
22
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
23
23
 
24
24
  const styles = _styles.StyleSheet.create({
25
+ root: { // TODO: Remove redundant platform checking
26
+ ...(_reactNative.Platform.OS === 'web' ? {
27
+ minWidth: 'auto'
28
+ } : {})
29
+ },
25
30
  primary: {
26
31
  minHeight: 48
27
32
  },
@@ -48,7 +53,7 @@ function Tab(props) {
48
53
  const theme = (0, _styles.useTheme)();
49
54
  const vertical = variant === 'bottom-navigation';
50
55
  const color = selected ? theme.palette.text.primary : theme.palette.text.hint;
51
- const tabBaseStyle = (0, _styles.css)([variant === 'primary' ? styles.primary : variant === 'secondary' ? styles.secondary : styles.bottomNavigation, style]);
56
+ const tabBaseStyle = (0, _styles.css)([styles.root, variant === 'primary' ? styles.primary : variant === 'secondary' ? styles.secondary : styles.bottomNavigation, style]);
52
57
  const fontStyle = (0, _styles.createFontStyle)(theme, {
53
58
  selector: typo => variant === 'primary' ? typo.h2 : variant === 'secondary' ? typo.button2 : typo.flag,
54
59
  color
@@ -1 +1 @@
1
- {"version":3,"sources":["Tab.tsx"],"names":["styles","StyleSheet","create","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","React","cloneElement","fill"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;AAEA,MAAMA,MAAM,GAAGC,mBAAWC,MAAX,CAAkB;AAC7BC,EAAAA,OAAO,EAAE;AACLC,IAAAA,SAAS,EAAE;AADN,GADoB;AAI7BC,EAAAA,SAAS,EAAE;AACPD,IAAAA,SAAS,EAAE;AADJ,GAJkB;AAO7BE,EAAAA,gBAAgB,EAAE;AACdF,IAAAA,SAAS,EAAE;AADG;AAPW,CAAlB,CAAf;;AAYe,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,GAAG,uBAAd;AAEA,QAAMC,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,iBAAI,CACrBT,OAAO,KAAK,SAAZ,GACMhB,MAAM,CAACG,OADb,GAEOa,OAAO,KAAK,WAAZ,GAA0BhB,MAAM,CAACK,SAAjC,GAA6CL,MAAM,CAACM,gBAHtC,EAIrBW,KAJqB,CAAJ,CAArB;AAOA,QAAMS,SAAS,GAAG,6BAAgBP,KAAhB,EAAuB;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,GAAvB,CAAlB;AAOA,QAAMT,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;AACA,QAAMmB,WAAW,GAAGpB,IAAI,gBAAGqB,eAAMC,YAAN,CAAmBtB,IAAnB,EAAyB;AAAEuB,IAAAA,IAAI,EAAEd;AAAR,GAAzB,CAAH,GAA+C,IAAvE;AAEA,sBACI,6BAAC,gBAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,KAAK,EAAEK;AAFX,KAGQP,UAHR,gBAKI,6BAAC,cAAD;AACI,IAAA,QAAQ,EAAEc,WADd;AAEI,IAAA,SAAS,EAAE,CAACvB;AAFhB,IALJ,eAUI,6BAAC,iBAAD;AACI,IAAA,QAAQ,EAAEC,QADd;AAEI,IAAA,KAAK,EAAE,iBAAIgB,SAAJ;AAFX,IAVJ,EAeKf,eAAe,gBAAG,6BAAC,qBAAD,OAAH,GAAqB,IAfzC,CADJ;AAmBH;;AAAA","sourcesContent":["import React from 'react';\nimport { 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 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 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":["styles","StyleSheet","create","root","Platform","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","React","cloneElement","fill"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;AAEA,MAAMA,MAAM,GAAGC,mBAAWC,MAAX,CAAkB;AAC7BC,EAAAA,IAAI,EAAE,EACF;AACA,QAAIC,sBAASC,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;;AAgBe,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,GAAG,uBAAd;AAEA,QAAMC,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,iBAAI,CACrB7B,MAAM,CAACG,IADc,EAErBiB,OAAO,KAAK,SAAZ,GACMpB,MAAM,CAACO,OADb,GAEOa,OAAO,KAAK,WAAZ,GAA0BpB,MAAM,CAACS,SAAjC,GAA6CT,MAAM,CAACU,gBAJtC,EAKrBW,KALqB,CAAJ,CAArB;AAQA,QAAMS,SAAS,GAAG,6BAAgBP,KAAhB,EAAuB;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,GAAvB,CAAlB;AAOA,QAAMT,IAAI,GAAGE,QAAQ,GAAIC,YAAY,IAAIF,WAApB,GAAmCA,WAAxD;AACA,QAAMmB,WAAW,GAAGpB,IAAI,gBAAGqB,eAAMC,YAAN,CAAmBtB,IAAnB,EAAyB;AAAEuB,IAAAA,IAAI,EAAEd;AAAR,GAAzB,CAAH,GAA+C,IAAvE;AAEA,sBACI,6BAAC,gBAAD;AACI,IAAA,QAAQ,EAAED,QADd;AAEI,IAAA,KAAK,EAAEK;AAFX,KAGQP,UAHR,gBAKI,6BAAC,cAAD;AACI,IAAA,QAAQ,EAAEc,WADd;AAEI,IAAA,SAAS,EAAE,CAACvB;AAFhB,IALJ,eAUI,6BAAC,iBAAD;AACI,IAAA,QAAQ,EAAEC,QADd;AAEI,IAAA,KAAK,EAAE,iBAAIgB,SAAJ;AAFX,IAVJ,EAeKf,eAAe,gBAAG,6BAAC,qBAAD,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"]}
@@ -19,7 +19,9 @@ const useStyles = function () {
19
19
  paddingBottom: insets.bottom,
20
20
  paddingHorizontal: theme.spacing(2),
21
21
  position: 'absolute',
22
- width: '100%'
22
+ width: '100%',
23
+ // TODO: Need to remove zIndex.
24
+ zIndex: 32
23
25
  }
24
26
  };
25
27
  };
@@ -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","Snackbar","props","animatedY","autoHideDuration","children","message","onClose","style","visible","otherProps","autoHideTimer","useRef","clearAutoHideTimeout","current","clearTimeout","useEffect","setTimeout","styles","exited","setExited","useState"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AACA,SAASC,iBAAT,QAAkC,gCAAlC;AACA,SAASC,GAAT,QAAuD,qBAAvD;AACA,OAAOC,KAAP,MAAkB,UAAlB;AACA,OAAOC,eAAP,MAA4B,oBAA5B;AACA,SAASC,QAAT,QAAyB,WAAzB;;AAKA,MAAMC,SAAoC,GAAG,YAA4B;AACrE,QAAMC,KAAK,GAAGF,QAAQ,EAAtB;AACA,QAAMG,MAAM,GAAGP,iBAAiB,EAAhC;AAEA,SAAO;AACHQ,IAAAA,IAAI,EAAE;AACFC,MAAAA,SAAS,EAAE,QADT;AAEFC,MAAAA,MAAM,EAAEJ,KAAK,CAACK,OAAN,CAAc,CAAd,CAFN;AAGFC,MAAAA,QAAQ,EAAE,GAHR;AAIFC,MAAAA,aAAa,EAAEN,MAAM,CAACG,MAJpB;AAKFI,MAAAA,iBAAiB,EAAER,KAAK,CAACK,OAAN,CAAc,CAAd,CALjB;AAMFI,MAAAA,QAAQ,EAAE,UANR;AAOFC,MAAAA,KAAK,EAAE;AAPL;AADH,GAAP;AAWH,CAfD;;AAiBA,eAAe,SAASC,QAAT,CAAkBC,KAAlB,EAAwC;AACnD,QAAM;AACFC,IAAAA,SADE;AAEFC,IAAAA,gBAAgB,GAAG,IAFjB;AAGFC,IAAAA,QAHE;AAIFC,IAAAA,OAJE;AAKFC,IAAAA,OALE;AAMFC,IAAAA,KANE;AAOFC,IAAAA,OAAO,GAAG,KAPR;AAQF,OAAGC;AARD,MASFR,KATJ;AAWA,QAAMS,aAAa,GAAG7B,KAAK,CAAC8B,MAAN,CAA4B,IAA5B,CAAtB;;AAEA,QAAMC,oBAAoB,GAAG,MAAM;AAC/B,QAAIF,aAAa,CAACG,OAAd,KAA0B,IAA9B,EAAoC;AAChCC,MAAAA,YAAY,CAACJ,aAAa,CAACG,OAAf,CAAZ;AACH;AACJ,GAJD;;AAMAhC,EAAAA,KAAK,CAACkC,SAAN,CAAgB,MAAM;AAClB,WAAO,MAAM;AACTH,MAAAA,oBAAoB;AACvB,KAFD;AAGH,GAJD,EAIG,EAJH;AAMA/B,EAAAA,KAAK,CAACkC,SAAN,CAAgB,MAAM;AAClB,QAAIP,OAAO,IAAIL,gBAAgB,KAAK,IAApC,EAA0C;AACtCS,MAAAA,oBAAoB,GADkB,CAGtC;;AACAF,MAAAA,aAAa,CAACG,OAAd,GAAwBG,UAAU,CAAC,MAAM;AACrC,YAAIV,OAAJ,EAAa;AACTA,UAAAA,OAAO;AACV;AACJ,OAJiC,EAI/BH,gBAJ+B,CAAlC;AAKH;AACJ,GAXD,EAWG,CAACK,OAAD,EAAUL,gBAAV,EAA4BG,OAA5B,CAXH;AAaA,QAAMW,MAAM,GAAG7B,SAAS,EAAxB;AAEA,QAAM,CAAC8B,MAAD,EAASC,SAAT,IAAsBtC,KAAK,CAACuC,QAAN,CAAe,IAAf,CAA5B;;AAEA,MAAI,CAACZ,OAAD,IAAYU,MAAhB,EAAwB;AACpB,WAAO,IAAP;AACH;;AAED,sBACI,oBAAC,IAAD;AACI,IAAA,KAAK,EAAElC,GAAG,CAAC,CACPiC,MAAM,CAAC1B,IADA,EAEPgB,KAFO,CAAD;AADd,KAKQE,UALR,gBAOI,oBAAC,KAAD;AACI,IAAA,SAAS,EAAEP,SADf;AAEI,IAAA,MAAM,EAAEM,OAFZ;AAGI,IAAA,OAAO,EAAE,MAAMW,SAAS,CAAC,KAAD,CAH5B;AAII,IAAA,QAAQ,EAAE,MAAMA,SAAS,CAAC,IAAD;AAJ7B,KAMKf,QAAQ,GAAGA,QAAH,gBACL,oBAAC,eAAD;AAAiB,IAAA,OAAO,EAAEC;AAA1B,IAPR,CAPJ,CADJ;AAoBH;AAAA","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 },\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","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,12 +1,17 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
3
  import React from 'react';
4
- import { Text } from 'react-native';
4
+ import { Platform, Text } from 'react-native';
5
5
  import Badge from '../Badge';
6
6
  import TabBase from '../TabBase';
7
7
  import { createFontStyle, css, StyleSheet, useTheme } from '../styles';
8
8
  import TabIndicator from './TabIndicator';
9
9
  const styles = StyleSheet.create({
10
+ root: { // TODO: Remove redundant platform checking
11
+ ...(Platform.OS === 'web' ? {
12
+ minWidth: 'auto'
13
+ } : {})
14
+ },
10
15
  primary: {
11
16
  minHeight: 48
12
17
  },
@@ -32,7 +37,7 @@ export default function Tab(props) {
32
37
  const theme = useTheme();
33
38
  const vertical = variant === 'bottom-navigation';
34
39
  const color = selected ? theme.palette.text.primary : theme.palette.text.hint;
35
- const tabBaseStyle = css([variant === 'primary' ? styles.primary : variant === 'secondary' ? styles.secondary : styles.bottomNavigation, style]);
40
+ const tabBaseStyle = css([styles.root, variant === 'primary' ? styles.primary : variant === 'secondary' ? styles.secondary : styles.bottomNavigation, style]);
36
41
  const fontStyle = createFontStyle(theme, {
37
42
  selector: typo => variant === 'primary' ? typo.h2 : variant === 'secondary' ? typo.button2 : typo.flag,
38
43
  color
@@ -1 +1 @@
1
- {"version":3,"sources":["Tab.tsx"],"names":["React","Text","Badge","TabBase","createFontStyle","css","StyleSheet","useTheme","TabIndicator","styles","create","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,IAAT,QAAqB,cAArB;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,OAAO,EAAE;AACLC,IAAAA,SAAS,EAAE;AADN,GADoB;AAI7BC,EAAAA,SAAS,EAAE;AACPD,IAAAA,SAAS,EAAE;AADJ,GAJkB;AAO7BE,EAAAA,gBAAgB,EAAE;AACdF,IAAAA,SAAS,EAAE;AADG;AAPW,CAAlB,CAAf;AAYA,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,GAAGpB,QAAQ,EAAtB;AAEA,QAAMqB,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,GAAG5B,GAAG,CAAC,CACrBmB,OAAO,KAAK,SAAZ,GACMf,MAAM,CAACE,OADb,GAEOa,OAAO,KAAK,WAAZ,GAA0Bf,MAAM,CAACI,SAAjC,GAA6CJ,MAAM,CAACK,gBAHtC,EAIrBW,KAJqB,CAAD,CAAxB;AAOA,QAAMS,SAAS,GAAG9B,eAAe,CAACuB,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,gBAAGpB,KAAK,CAACyC,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,EAAEb,GAAG,CAAC6B,SAAD;AAFd,IAVJ,EAeKf,eAAe,gBAAG,oBAAC,YAAD,OAAH,GAAqB,IAfzC,CADJ;AAmBH;AAAA","sourcesContent":["import React from 'react';\nimport { 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 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 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","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"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fountain-ui/core",
3
- "version": "1.11.9",
3
+ "version": "1.11.10",
4
4
  "author": "Fountain-UI Team",
5
5
  "description": "React components that implement Tappytoon's Fountain Design.",
6
6
  "license": "MIT",
@@ -67,5 +67,5 @@
67
67
  "publishConfig": {
68
68
  "access": "public"
69
69
  },
70
- "gitHead": "48359139c7098b37f6670145473459c4f61edb04"
70
+ "gitHead": "85c458eb73df73c22a531c6b6d71bda8ca06e28f"
71
71
  }
@@ -22,6 +22,8 @@ const useStyles: UseStyles<SnackBarStyles> = function (): SnackBarStyles {
22
22
  paddingHorizontal: theme.spacing(2),
23
23
  position: 'absolute',
24
24
  width: '100%',
25
+ // TODO: Need to remove zIndex.
26
+ zIndex: 32,
25
27
  },
26
28
  };
27
29
  };
package/src/Tab/Tab.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { Text } from 'react-native';
2
+ import { Platform, Text } from 'react-native';
3
3
  import Badge from '../Badge';
4
4
  import TabBase from '../TabBase';
5
5
  import type TabProps from './TabProps';
@@ -7,6 +7,10 @@ import { createFontStyle, css, StyleSheet, useTheme } from '../styles';
7
7
  import TabIndicator from './TabIndicator';
8
8
 
9
9
  const styles = StyleSheet.create({
10
+ root: {
11
+ // TODO: Remove redundant platform checking
12
+ ...(Platform.OS === 'web' ? { minWidth: 'auto' } : {}),
13
+ },
10
14
  primary: {
11
15
  minHeight: 48,
12
16
  },
@@ -38,6 +42,7 @@ export default function Tab(props: TabProps) {
38
42
  const color = selected ? theme.palette.text.primary : theme.palette.text.hint;
39
43
 
40
44
  const tabBaseStyle = css([
45
+ styles.root,
41
46
  variant === 'primary'
42
47
  ? styles.primary
43
48
  : (variant === 'secondary' ? styles.secondary : styles.bottomNavigation),