npm - @fountain-ui/core - Versions diffs - 3.0.0-alpha.41 → 3.0.0-alpha.42 - Mend

@fountain-ui/core 3.0.0-alpha.41 → 3.0.0-alpha.42

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 (82) hide show

package/build/commonjs/Tabs/Tabs.js CHANGED Viewed

@@ -42,14 +42,16 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 const useStyles = function () {
   const theme = (0, _styles.useTheme)();
   return {
-    root: {},
+    root: {
+      position: 'relative'
+    },
     fixedRoot: {
       flexDirection: 'row'
     },
     fixedTab: {
       flex: 1
     },
-    bottomDivider: {
+    borderContainer: { ..._reactNative.StyleSheet.absoluteFillObject,
       borderBottomColor: theme.palette.border.base,
       borderBottomWidth: 0.5
     }
@@ -213,7 +215,7 @@ const Tabs = /*#__PURE__*/(0, _react.forwardRef)(function Tabs(props, ref) {
   }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: (0, _styles.css)([styles.root, containerStyle, {
       backgroundColor: backgroundColorMap[color]
-    }, showDivider ? styles.bottomDivider : undefined, scrollable ? undefined : styles.fixedRoot, style])
+    }, scrollable ? undefined : styles.fixedRoot, style])
   }, scrollable ? /*#__PURE__*/_react.default.createElement(_ScrollableTabsView.default, {
     automaticallyAdjustContentInsets: false,
     bounces: false,
@@ -227,7 +229,10 @@ const Tabs = /*#__PURE__*/(0, _react.forwardRef)(function Tabs(props, ref) {
     showsVerticalScrollIndicator: false,
     keyboardDismissMode: keyboardDismissMode,
     keyboardShouldPersistTaps: keyboardShouldPersistTaps
-  }, tabElements, tabIndicator) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, tabElements, tabIndicator)));
+  }, tabElements, tabIndicator) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, tabElements, tabIndicator), showDivider ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    pointerEvents: 'none',
+    style: styles.borderContainer
+  }) : null));
 });
 var _default = Tabs;
 exports.default = _default;

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

	@@ -1 +1 @@
1	- {"version":3,"names":["useStyles","theme","useTheme","root","fixedRoot","flexDirection","fixedTab","flex","bottomDivider","borderBottomColor","palette","border","base","borderBottomWidth","Tabs","forwardRef","props","ref","children","color","initialIndex","disableIndicator","indicatorSize","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","scrollViewContentContainerStyle","showDivider","size","style","variant","UNSTABLE_sharedIndex","onTabSelected","fallbackSharedIndex","useSyncAnimatedValue","initialValue","sharedIndex","realInitialIndex","currentIndexRef","useRef","container","containerStyle","contentContainer","contentContainerStyle","useTabsStyle","setTab","newIndex","currentIndex","current","animatedValue","setValue","useImperativeHandle","styles","outerCoordinates","updateCoordinate","useTabCoordinates","innerContentsWidthList","updateInnerContentsWidth","useTabInnerContentsWidth","canRenderIndicator","isEveryTabCoordinatesDefined","indexStore","useIndexStore","coordinates","useMemo","length","map","innerContentWidth","idx","outerCoordinate","defaultCoordinate","x1","outerX1","x2","outerX2","tabWidth","distanceFromParent","indicatorStartCoordinate","useEffect","subscribe","tabElements","React","Children","child","index","onTabInnerLayout","event","width","nativeEvent","layout","onLayout","x","onMouseDown","e","preventDefault","onPress","tabStyle","tabElement","cloneElement","enableIndicator","parentColor","css","undefined","filter","Boolean","tabIndicator","backgroundColorMap","default","background","alt","backgroundColor"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type { TabSize, TabVariant } from '../Tab';\nimport type TabsProps from './TabsProps';\nimport type { TabsColor } from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useTabInnerContentsWidth from './useTabInnerContentsWidth';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\nimport { defaultCoordinate } from './TabCoordinate';\nimport useTabsStyle from './useTabsStyle';\n\ntype TabsStyleKeys =\n \| 'root'\n \| 'fixedRoot'\n \| 'fixedTab'\n \| 'bottomDivider';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {},\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n bottomDivider: {\n borderBottomColor: theme.palette.border.base,\n borderBottomWidth: 0.5,\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n color = 'default',\n initialIndex = 0,\n disableIndicator = false,\n indicatorSize = 'fit-content',\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n scrollViewContentContainerStyle,\n showDivider = false,\n size = 'medium' as TabSize,\n style,\n variant = 'default' as TabVariant,\n UNSTABLE_sharedIndex,\n onTabSelected,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const currentIndexRef = useRef(initialIndex);\n\n const {\n container: containerStyle,\n contentContainer: contentContainerStyle,\n } = useTabsStyle(variant, size, scrollable);\n\n const setTab = (newIndex: number) => {\n const currentIndex = currentIndexRef.current;\n onTabSelected?.(newIndex, currentIndex);\n\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const [outerCoordinates, updateCoordinate] = useTabCoordinates(children);\n const [innerContentsWidthList, updateInnerContentsWidth] = useTabInnerContentsWidth(children);\n\n const canRenderIndicator = indicatorSize === 'fit-content'\n ? isEveryTabCoordinatesDefined(innerContentsWidthList, children)\n : isEveryTabCoordinatesDefined(outerCoordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n const coordinates = useMemo(() => {\n if (outerCoordinates.length === 0) {\n return [];\n }\n\n if (indicatorSize !== 'fit-content') {\n return outerCoordinates;\n }\n\n return innerContentsWidthList.map((innerContentWidth, idx) => {\n const outerCoordinate = outerCoordinates[idx];\n if (!outerCoordinate) {\n return defaultCoordinate;\n }\n\n const { x1: outerX1, x2: outerX2 } = outerCoordinate;\n\n const tabWidth = outerX2 - outerX1;\n const distanceFromParent = (tabWidth - innerContentWidth) / 2;\n const indicatorStartCoordinate = outerX1 + distanceFromParent;\n\n return {\n x1: indicatorStartCoordinate,\n x2: indicatorStartCoordinate + innerContentWidth,\n };\n });\n }, [outerCoordinates, innerContentsWidthList]);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n currentIndexRef.current = newIndex;\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n if (!child) {\n return null;\n }\n\n const onTabInnerLayout = (event: LayoutChangeEvent) => {\n const { width } = event.nativeEvent.layout;\n\n updateInnerContentsWidth(index, width);\n };\n\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n\n // @ts-ignore\n child.props.onLayout?.(event);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabStyle = child.props.style;\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onTabInnerLayout,\n onLayout,\n onPress,\n onMouseDown,\n parentColor: color,\n size,\n variant,\n indicatorSize,\n style: css([\n scrollable ? undefined : styles.fixedTab,\n tabStyle,\n ]),\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n })?.filter(Boolean);\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n />\n ) : null;\n\n const backgroundColorMap: Record<TabsColor, string> = {\n default: theme.palette.background.base,\n alt: theme.palette.background.alt,\n };\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n containerStyle,\n { backgroundColor: backgroundColorMap[color] },\n showDivider ? styles.bottomDivider : undefined,\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={css([\n contentContainerStyle,\n scrollViewContentContainerStyle,\n ])}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n initialIndex={realInitialIndex}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n showsVerticalScrollIndicator={false}\n keyboardDismissMode={keyboardDismissMode}\n keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n >\n {tabElements}\n {tabIndicator}\n </ScrollableTabsView>\n ) : (\n <React.Fragment>\n {tabElements}\n {tabIndicator}\n </React.Fragment>\n )}\n </View>\n </InternalContext.Provider>\n );\n});\n\nexport default Tabs;\n"],"mappings":"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"}
1	+ {"version":3,"names":["useStyles","theme","useTheme","root","position","fixedRoot","flexDirection","fixedTab","flex","borderContainer","StyleSheet","absoluteFillObject","borderBottomColor","palette","border","base","borderBottomWidth","Tabs","forwardRef","props","ref","children","color","initialIndex","disableIndicator","indicatorSize","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","scrollViewContentContainerStyle","showDivider","size","style","variant","UNSTABLE_sharedIndex","onTabSelected","fallbackSharedIndex","useSyncAnimatedValue","initialValue","sharedIndex","realInitialIndex","currentIndexRef","useRef","container","containerStyle","contentContainer","contentContainerStyle","useTabsStyle","setTab","newIndex","currentIndex","current","animatedValue","setValue","useImperativeHandle","styles","outerCoordinates","updateCoordinate","useTabCoordinates","innerContentsWidthList","updateInnerContentsWidth","useTabInnerContentsWidth","canRenderIndicator","isEveryTabCoordinatesDefined","indexStore","useIndexStore","coordinates","useMemo","length","map","innerContentWidth","idx","outerCoordinate","defaultCoordinate","x1","outerX1","x2","outerX2","tabWidth","distanceFromParent","indicatorStartCoordinate","useEffect","subscribe","tabElements","React","Children","child","index","onTabInnerLayout","event","width","nativeEvent","layout","onLayout","x","onMouseDown","e","preventDefault","onPress","tabStyle","tabElement","cloneElement","enableIndicator","parentColor","css","undefined","filter","Boolean","tabIndicator","backgroundColorMap","default","background","alt","backgroundColor"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { StyleSheet, View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type { TabSize, TabVariant } from '../Tab';\nimport type TabsProps from './TabsProps';\nimport type { TabsColor } from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useTabInnerContentsWidth from './useTabInnerContentsWidth';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\nimport { defaultCoordinate } from './TabCoordinate';\nimport useTabsStyle from './useTabsStyle';\n\ntype TabsStyleKeys =\n \| 'root'\n \| 'fixedRoot'\n \| 'fixedTab'\n \| 'borderContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {\n position: 'relative',\n },\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n borderContainer: {\n ...StyleSheet.absoluteFillObject,\n borderBottomColor: theme.palette.border.base,\n borderBottomWidth: 0.5,\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n color = 'default',\n initialIndex = 0,\n disableIndicator = false,\n indicatorSize = 'fit-content',\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n scrollViewContentContainerStyle,\n showDivider = false,\n size = 'medium' as TabSize,\n style,\n variant = 'default' as TabVariant,\n UNSTABLE_sharedIndex,\n onTabSelected,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const currentIndexRef = useRef(initialIndex);\n\n const {\n container: containerStyle,\n contentContainer: contentContainerStyle,\n } = useTabsStyle(variant, size, scrollable);\n\n const setTab = (newIndex: number) => {\n const currentIndex = currentIndexRef.current;\n onTabSelected?.(newIndex, currentIndex);\n\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const [outerCoordinates, updateCoordinate] = useTabCoordinates(children);\n const [innerContentsWidthList, updateInnerContentsWidth] = useTabInnerContentsWidth(children);\n\n const canRenderIndicator = indicatorSize === 'fit-content'\n ? isEveryTabCoordinatesDefined(innerContentsWidthList, children)\n : isEveryTabCoordinatesDefined(outerCoordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n const coordinates = useMemo(() => {\n if (outerCoordinates.length === 0) {\n return [];\n }\n\n if (indicatorSize !== 'fit-content') {\n return outerCoordinates;\n }\n\n return innerContentsWidthList.map((innerContentWidth, idx) => {\n const outerCoordinate = outerCoordinates[idx];\n if (!outerCoordinate) {\n return defaultCoordinate;\n }\n\n const { x1: outerX1, x2: outerX2 } = outerCoordinate;\n\n const tabWidth = outerX2 - outerX1;\n const distanceFromParent = (tabWidth - innerContentWidth) / 2;\n const indicatorStartCoordinate = outerX1 + distanceFromParent;\n\n return {\n x1: indicatorStartCoordinate,\n x2: indicatorStartCoordinate + innerContentWidth,\n };\n });\n }, [outerCoordinates, innerContentsWidthList]);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n currentIndexRef.current = newIndex;\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n if (!child) {\n return null;\n }\n\n const onTabInnerLayout = (event: LayoutChangeEvent) => {\n const { width } = event.nativeEvent.layout;\n\n updateInnerContentsWidth(index, width);\n };\n\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n\n // @ts-ignore\n child.props.onLayout?.(event);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabStyle = child.props.style;\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onTabInnerLayout,\n onLayout,\n onPress,\n onMouseDown,\n parentColor: color,\n size,\n variant,\n indicatorSize,\n style: css([\n scrollable ? undefined : styles.fixedTab,\n tabStyle,\n ]),\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n })?.filter(Boolean);\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n />\n ) : null;\n\n const backgroundColorMap: Record<TabsColor, string> = {\n default: theme.palette.background.base,\n alt: theme.palette.background.alt,\n };\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n containerStyle,\n { backgroundColor: backgroundColorMap[color] },\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={css([\n contentContainerStyle,\n scrollViewContentContainerStyle,\n ])}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n initialIndex={realInitialIndex}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n showsVerticalScrollIndicator={false}\n keyboardDismissMode={keyboardDismissMode}\n keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n >\n {tabElements}\n {tabIndicator}\n </ScrollableTabsView>\n ) : (\n <React.Fragment>\n {tabElements}\n {tabIndicator}\n </React.Fragment>\n )}\n\n {showDivider ? (\n <View\n pointerEvents={'none'}\n style={styles.borderContainer}\n />\n ) : null}\n </View>\n </InternalContext.Provider>\n );\n});\n\nexport default Tabs;\n"],"mappings":"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"}

package/build/module/Tabs/Tabs.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import React, { cloneElement, forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
-import { View } from 'react-native';
+import { StyleSheet, View } from 'react-native';
 import { css, useTheme } from '../styles';
 import { useSyncAnimatedValue } from '../hooks';
 import TabIndicator from './TabIndicator';
@@ -16,14 +16,16 @@ import useTabsStyle from './useTabsStyle';
 const useStyles = function () {
   const theme = useTheme();
   return {
-    root: {},
+    root: {
+      position: 'relative'
+    },
     fixedRoot: {
       flexDirection: 'row'
     },
     fixedTab: {
       flex: 1
     },
-    bottomDivider: {
+    borderContainer: { ...StyleSheet.absoluteFillObject,
       borderBottomColor: theme.palette.border.base,
       borderBottomWidth: 0.5
     }
@@ -187,7 +189,7 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
   }, /*#__PURE__*/React.createElement(View, {
     style: css([styles.root, containerStyle, {
       backgroundColor: backgroundColorMap[color]
-    }, showDivider ? styles.bottomDivider : undefined, scrollable ? undefined : styles.fixedRoot, style])
+    }, scrollable ? undefined : styles.fixedRoot, style])
   }, scrollable ? /*#__PURE__*/React.createElement(ScrollableTabsView, {
     automaticallyAdjustContentInsets: false,
     bounces: false,
@@ -201,7 +203,10 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
     showsVerticalScrollIndicator: false,
     keyboardDismissMode: keyboardDismissMode,
     keyboardShouldPersistTaps: keyboardShouldPersistTaps
-  }, tabElements, tabIndicator) : /*#__PURE__*/React.createElement(React.Fragment, null, tabElements, tabIndicator)));
+  }, tabElements, tabIndicator) : /*#__PURE__*/React.createElement(React.Fragment, null, tabElements, tabIndicator), showDivider ? /*#__PURE__*/React.createElement(View, {
+    pointerEvents: 'none',
+    style: styles.borderContainer
+  }) : null));
 });
 export default Tabs;
 //# sourceMappingURL=Tabs.js.map

package/build/module/Tabs/Tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","cloneElement","forwardRef","useEffect","useImperativeHandle","useMemo","useRef","View","css","useTheme","useSyncAnimatedValue","TabIndicator","ScrollableTabsView","IndexAwareTab","useTabCoordinates","useTabInnerContentsWidth","useIndexStore","InternalContext","isEveryTabCoordinatesDefined","defaultCoordinate","useTabsStyle","useStyles","theme","root","fixedRoot","flexDirection","fixedTab","flex","bottomDivider","borderBottomColor","palette","border","base","borderBottomWidth","Tabs","props","ref","children","color","initialIndex","disableIndicator","indicatorSize","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","scrollViewContentContainerStyle","showDivider","size","style","variant","UNSTABLE_sharedIndex","onTabSelected","fallbackSharedIndex","initialValue","sharedIndex","realInitialIndex","currentIndexRef","container","containerStyle","contentContainer","contentContainerStyle","setTab","newIndex","currentIndex","current","animatedValue","setValue","styles","outerCoordinates","updateCoordinate","innerContentsWidthList","updateInnerContentsWidth","canRenderIndicator","indexStore","coordinates","length","map","innerContentWidth","idx","outerCoordinate","x1","outerX1","x2","outerX2","tabWidth","distanceFromParent","indicatorStartCoordinate","subscribe","tabElements","Children","child","index","onTabInnerLayout","event","width","nativeEvent","layout","onLayout","x","onMouseDown","e","preventDefault","onPress","tabStyle","tabElement","enableIndicator","parentColor","undefined","filter","Boolean","tabIndicator","backgroundColorMap","default","background","alt","backgroundColor"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type { TabSize, TabVariant } from '../Tab';\nimport type TabsProps from './TabsProps';\nimport type { TabsColor } from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useTabInnerContentsWidth from './useTabInnerContentsWidth';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\nimport { defaultCoordinate } from './TabCoordinate';\nimport useTabsStyle from './useTabsStyle';\n\ntype TabsStyleKeys =\n \| 'root'\n \| 'fixedRoot'\n \| 'fixedTab'\n \| 'bottomDivider';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {},\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n bottomDivider: {\n borderBottomColor: theme.palette.border.base,\n borderBottomWidth: 0.5,\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n color = 'default',\n initialIndex = 0,\n disableIndicator = false,\n indicatorSize = 'fit-content',\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n scrollViewContentContainerStyle,\n showDivider = false,\n size = 'medium' as TabSize,\n style,\n variant = 'default' as TabVariant,\n UNSTABLE_sharedIndex,\n onTabSelected,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const currentIndexRef = useRef(initialIndex);\n\n const {\n container: containerStyle,\n contentContainer: contentContainerStyle,\n } = useTabsStyle(variant, size, scrollable);\n\n const setTab = (newIndex: number) => {\n const currentIndex = currentIndexRef.current;\n onTabSelected?.(newIndex, currentIndex);\n\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const [outerCoordinates, updateCoordinate] = useTabCoordinates(children);\n const [innerContentsWidthList, updateInnerContentsWidth] = useTabInnerContentsWidth(children);\n\n const canRenderIndicator = indicatorSize === 'fit-content'\n ? isEveryTabCoordinatesDefined(innerContentsWidthList, children)\n : isEveryTabCoordinatesDefined(outerCoordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n const coordinates = useMemo(() => {\n if (outerCoordinates.length === 0) {\n return [];\n }\n\n if (indicatorSize !== 'fit-content') {\n return outerCoordinates;\n }\n\n return innerContentsWidthList.map((innerContentWidth, idx) => {\n const outerCoordinate = outerCoordinates[idx];\n if (!outerCoordinate) {\n return defaultCoordinate;\n }\n\n const { x1: outerX1, x2: outerX2 } = outerCoordinate;\n\n const tabWidth = outerX2 - outerX1;\n const distanceFromParent = (tabWidth - innerContentWidth) / 2;\n const indicatorStartCoordinate = outerX1 + distanceFromParent;\n\n return {\n x1: indicatorStartCoordinate,\n x2: indicatorStartCoordinate + innerContentWidth,\n };\n });\n }, [outerCoordinates, innerContentsWidthList]);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n currentIndexRef.current = newIndex;\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n if (!child) {\n return null;\n }\n\n const onTabInnerLayout = (event: LayoutChangeEvent) => {\n const { width } = event.nativeEvent.layout;\n\n updateInnerContentsWidth(index, width);\n };\n\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n\n // @ts-ignore\n child.props.onLayout?.(event);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabStyle = child.props.style;\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onTabInnerLayout,\n onLayout,\n onPress,\n onMouseDown,\n parentColor: color,\n size,\n variant,\n indicatorSize,\n style: css([\n scrollable ? undefined : styles.fixedTab,\n tabStyle,\n ]),\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n })?.filter(Boolean);\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n />\n ) : null;\n\n const backgroundColorMap: Record<TabsColor, string> = {\n default: theme.palette.background.base,\n alt: theme.palette.background.alt,\n };\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n containerStyle,\n { backgroundColor: backgroundColorMap[color] },\n showDivider ? styles.bottomDivider : undefined,\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={css([\n contentContainerStyle,\n scrollViewContentContainerStyle,\n ])}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n initialIndex={realInitialIndex}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n showsVerticalScrollIndicator={false}\n keyboardDismissMode={keyboardDismissMode}\n keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n >\n {tabElements}\n {tabIndicator}\n </ScrollableTabsView>\n ) : (\n <React.Fragment>\n {tabElements}\n {tabIndicator}\n </React.Fragment>\n )}\n </View>\n </InternalContext.Provider>\n );\n});\n\nexport default Tabs;\n"],"mappings":"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"}
1	+ {"version":3,"names":["React","cloneElement","forwardRef","useEffect","useImperativeHandle","useMemo","useRef","StyleSheet","View","css","useTheme","useSyncAnimatedValue","TabIndicator","ScrollableTabsView","IndexAwareTab","useTabCoordinates","useTabInnerContentsWidth","useIndexStore","InternalContext","isEveryTabCoordinatesDefined","defaultCoordinate","useTabsStyle","useStyles","theme","root","position","fixedRoot","flexDirection","fixedTab","flex","borderContainer","absoluteFillObject","borderBottomColor","palette","border","base","borderBottomWidth","Tabs","props","ref","children","color","initialIndex","disableIndicator","indicatorSize","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","scrollViewContentContainerStyle","showDivider","size","style","variant","UNSTABLE_sharedIndex","onTabSelected","fallbackSharedIndex","initialValue","sharedIndex","realInitialIndex","currentIndexRef","container","containerStyle","contentContainer","contentContainerStyle","setTab","newIndex","currentIndex","current","animatedValue","setValue","styles","outerCoordinates","updateCoordinate","innerContentsWidthList","updateInnerContentsWidth","canRenderIndicator","indexStore","coordinates","length","map","innerContentWidth","idx","outerCoordinate","x1","outerX1","x2","outerX2","tabWidth","distanceFromParent","indicatorStartCoordinate","subscribe","tabElements","Children","child","index","onTabInnerLayout","event","width","nativeEvent","layout","onLayout","x","onMouseDown","e","preventDefault","onPress","tabStyle","tabElement","enableIndicator","parentColor","undefined","filter","Boolean","tabIndicator","backgroundColorMap","default","background","alt","backgroundColor"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { StyleSheet, View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type { TabSize, TabVariant } from '../Tab';\nimport type TabsProps from './TabsProps';\nimport type { TabsColor } from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useTabInnerContentsWidth from './useTabInnerContentsWidth';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\nimport { defaultCoordinate } from './TabCoordinate';\nimport useTabsStyle from './useTabsStyle';\n\ntype TabsStyleKeys =\n \| 'root'\n \| 'fixedRoot'\n \| 'fixedTab'\n \| 'borderContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {\n position: 'relative',\n },\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n borderContainer: {\n ...StyleSheet.absoluteFillObject,\n borderBottomColor: theme.palette.border.base,\n borderBottomWidth: 0.5,\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n color = 'default',\n initialIndex = 0,\n disableIndicator = false,\n indicatorSize = 'fit-content',\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n scrollViewContentContainerStyle,\n showDivider = false,\n size = 'medium' as TabSize,\n style,\n variant = 'default' as TabVariant,\n UNSTABLE_sharedIndex,\n onTabSelected,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const currentIndexRef = useRef(initialIndex);\n\n const {\n container: containerStyle,\n contentContainer: contentContainerStyle,\n } = useTabsStyle(variant, size, scrollable);\n\n const setTab = (newIndex: number) => {\n const currentIndex = currentIndexRef.current;\n onTabSelected?.(newIndex, currentIndex);\n\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const [outerCoordinates, updateCoordinate] = useTabCoordinates(children);\n const [innerContentsWidthList, updateInnerContentsWidth] = useTabInnerContentsWidth(children);\n\n const canRenderIndicator = indicatorSize === 'fit-content'\n ? isEveryTabCoordinatesDefined(innerContentsWidthList, children)\n : isEveryTabCoordinatesDefined(outerCoordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n const coordinates = useMemo(() => {\n if (outerCoordinates.length === 0) {\n return [];\n }\n\n if (indicatorSize !== 'fit-content') {\n return outerCoordinates;\n }\n\n return innerContentsWidthList.map((innerContentWidth, idx) => {\n const outerCoordinate = outerCoordinates[idx];\n if (!outerCoordinate) {\n return defaultCoordinate;\n }\n\n const { x1: outerX1, x2: outerX2 } = outerCoordinate;\n\n const tabWidth = outerX2 - outerX1;\n const distanceFromParent = (tabWidth - innerContentWidth) / 2;\n const indicatorStartCoordinate = outerX1 + distanceFromParent;\n\n return {\n x1: indicatorStartCoordinate,\n x2: indicatorStartCoordinate + innerContentWidth,\n };\n });\n }, [outerCoordinates, innerContentsWidthList]);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n currentIndexRef.current = newIndex;\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n if (!child) {\n return null;\n }\n\n const onTabInnerLayout = (event: LayoutChangeEvent) => {\n const { width } = event.nativeEvent.layout;\n\n updateInnerContentsWidth(index, width);\n };\n\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n\n // @ts-ignore\n child.props.onLayout?.(event);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabStyle = child.props.style;\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onTabInnerLayout,\n onLayout,\n onPress,\n onMouseDown,\n parentColor: color,\n size,\n variant,\n indicatorSize,\n style: css([\n scrollable ? undefined : styles.fixedTab,\n tabStyle,\n ]),\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n })?.filter(Boolean);\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n />\n ) : null;\n\n const backgroundColorMap: Record<TabsColor, string> = {\n default: theme.palette.background.base,\n alt: theme.palette.background.alt,\n };\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n containerStyle,\n { backgroundColor: backgroundColorMap[color] },\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={css([\n contentContainerStyle,\n scrollViewContentContainerStyle,\n ])}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n initialIndex={realInitialIndex}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n showsVerticalScrollIndicator={false}\n keyboardDismissMode={keyboardDismissMode}\n keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n >\n {tabElements}\n {tabIndicator}\n </ScrollableTabsView>\n ) : (\n <React.Fragment>\n {tabElements}\n {tabIndicator}\n </React.Fragment>\n )}\n\n {showDivider ? (\n <View\n pointerEvents={'none'}\n style={styles.borderContainer}\n />\n ) : null}\n </View>\n </InternalContext.Provider>\n );\n});\n\nexport default Tabs;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,YAAhB,EAA8BC,UAA9B,EAA0CC,SAA1C,EAAqDC,mBAArD,EAA0EC,OAA1E,EAAmFC,MAAnF,QAAiG,OAAjG;AAEA,SAASC,UAAT,EAAqBC,IAArB,QAAiC,cAAjC;AAEA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AACA,SAASC,oBAAT,QAAqC,UAArC;AAKA,OAAOC,YAAP,MAAyB,gBAAzB;AACA,OAAOC,kBAAP,MAA+B,sBAA/B;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,iBAAP,MAA8B,qBAA9B;AACA,OAAOC,wBAAP,MAAqC,4BAArC;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AACA,SAASC,4BAAT,QAA6C,SAA7C;AACA,SAASC,iBAAT,QAAkC,iBAAlC;AACA,OAAOC,YAAP,MAAyB,gBAAzB;;AAUA,MAAMC,SAAgC,GAAG,YAAwB;EAC7D,MAAMC,KAAK,GAAGb,QAAQ,EAAtB;EAEA,OAAO;IACHc,IAAI,EAAE;MACFC,QAAQ,EAAE;IADR,CADH;IAIHC,SAAS,EAAE;MACPC,aAAa,EAAE;IADR,CAJR;IAOHC,QAAQ,EAAE;MACNC,IAAI,EAAE;IADA,CAPP;IAUHC,eAAe,EAAE,EACb,GAAGvB,UAAU,CAACwB,kBADD;MAEbC,iBAAiB,EAAET,KAAK,CAACU,OAAN,CAAcC,MAAd,CAAqBC,IAF3B;MAGbC,iBAAiB,EAAE;IAHN;EAVd,CAAP;AAgBH,CAnBD;;AAqBA,MAAMC,IAAI,gBAAGnC,UAAU,CAA0B,SAASmC,IAAT,CAAcC,KAAd,EAAqBC,GAArB,EAA0B;EAAA;;EACvE,MAAM;IACFC,QADE;IAEFC,KAAK,GAAG,SAFN;IAGFC,YAAY,GAAG,CAHb;IAIFC,gBAAgB,GAAG,KAJjB;IAKFC,aAAa,GAAG,aALd;IAMFC,mBAAmB,GAAG,MANpB;IAOFC,yBAAyB,GAAG,OAP1B;IAQFC,QARE;IASFC,UAAU,GAAG,KATX;IAUFC,+BAVE;IAWFC,WAAW,GAAG,KAXZ;IAYFC,IAAI,GAAG,QAZL;IAaFC,KAbE;IAcFC,OAAO,GAAG,SAdR;IAeFC,oBAfE;IAgBFC;EAhBE,IAiBFjB,KAjBJ;EAmBA,MAAMkB,mBAAmB,GAAG7C,oBAAoB,CAAC;IAAE8C,YAAY,EAAEf;EAAhB,CAAD,CAAhD;EACA,MAAMgB,WAAW,GAAGJ,oBAAoB,IAAIE,mBAA5C;EACA,MAAMG,gBAAgB,GAAGD,WAAW,CAACD,YAArC;EAEA,MAAMG,eAAe,GAAGtD,MAAM,CAACoC,YAAD,CAA9B;EAEA,MAAM;IACFmB,SAAS,EAAEC,cADT;IAEFC,gBAAgB,EAAEC;EAFhB,IAGF3C,YAAY,CAACgC,OAAD,EAAUF,IAAV,EAAgBH,UAAhB,CAHhB;;EAKA,MAAMiB,MAAM,GAAIC,QAAD,IAAsB;IACjC,MAAMC,YAAY,GAAGP,eAAe,CAACQ,OAArC;IACAb,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAGW,QAAH,EAAaC,YAAb,CAAb;IAEAT,WAAW,CAACW,aAAZ,CAA0BC,QAA1B,CAAmCJ,QAAnC;EACH,CALD;;EAOA9D,mBAAmB,CACfmC,GADe,EAEf,OAAO;IACH0B;EADG,CAAP,CAFe,EAKf,CAACP,WAAD,CALe,CAAnB;EAQA,MAAMa,MAAM,GAAGjD,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAGb,QAAQ,EAAtB;EAEA,MAAM,CAAC8D,gBAAD,EAAmBC,gBAAnB,IAAuC1D,iBAAiB,CAACyB,QAAD,CAA9D;EACA,MAAM,CAACkC,sBAAD,EAAyBC,wBAAzB,IAAqD3D,wBAAwB,CAACwB,QAAD,CAAnF;EAEA,MAAMoC,kBAAkB,GAAGhC,aAAa,KAAK,aAAlB,GACrBzB,4BAA4B,CAACuD,sBAAD,EAAyBlC,QAAzB,CADP,GAErBrB,4BAA4B,CAACqD,gBAAD,EAAmBhC,QAAnB,CAFlC;EAIA,MAAMqC,UAAU,GAAG5D,aAAa,CAACyC,WAAD,CAAhC;EAEA,MAAMoB,WAAW,GAAGzE,OAAO,CAAC,MAAM;IAC9B,IAAImE,gBAAgB,CAACO,MAAjB,KAA4B,CAAhC,EAAmC;MAC/B,OAAO,EAAP;IACH;;IAED,IAAInC,aAAa,KAAK,aAAtB,EAAqC;MACjC,OAAO4B,gBAAP;IACH;;IAED,OAAOE,sBAAsB,CAACM,GAAvB,CAA2B,CAACC,iBAAD,EAAoBC,GAApB,KAA4B;MAC1D,MAAMC,eAAe,GAAGX,gBAAgB,CAACU,GAAD,CAAxC;;MACA,IAAI,CAACC,eAAL,EAAsB;QAClB,OAAO/D,iBAAP;MACH;;MAED,MAAM;QAAEgE,EAAE,EAAEC,OAAN;QAAeC,EAAE,EAAEC;MAAnB,IAA+BJ,eAArC;MAEA,MAAMK,QAAQ,GAAGD,OAAO,GAAGF,OAA3B;MACA,MAAMI,kBAAkB,GAAG,CAACD,QAAQ,GAAGP,iBAAZ,IAAiC,CAA5D;MACA,MAAMS,wBAAwB,GAAGL,OAAO,GAAGI,kBAA3C;MAEA,OAAO;QACHL,EAAE,EAAEM,wBADD;QAEHJ,EAAE,EAAEI,wBAAwB,GAAGT;MAF5B,CAAP;IAIH,CAhBM,CAAP;EAiBH,CA1B0B,EA0BxB,CAACT,gBAAD,EAAmBE,sBAAnB,CA1BwB,CAA3B;EA4BAvE,SAAS,CAAC,MAAM;IACZ,OAAO0E,UAAU,CAACc,SAAX,CAAqBzB,QAAQ,IAAI;MACpCnB,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGmB,QAAH,CAAR;MACAN,eAAe,CAACQ,OAAhB,GAA0BF,QAA1B;IACH,CAHM,CAAP;EAIH,CALQ,EAKN,CAACW,UAAD,EAAa9B,QAAb,CALM,CAAT;EAOA,MAAM6C,WAAW,0BAAG5F,KAAK,CAAC6F,QAAN,CAAeb,GAAf,CAAmBxC,QAAnB,EAA6B,CAACsD,KAAD,EAAQC,KAAR,KAAkB;IAC/D,IAAI,CAACD,KAAL,EAAY;MACR,OAAO,IAAP;IACH;;IAED,MAAME,gBAAgB,GAAIC,KAAD,IAA8B;MACnD,MAAM;QAAEC;MAAF,IAAYD,KAAK,CAACE,WAAN,CAAkBC,MAApC;MAEAzB,wBAAwB,CAACoB,KAAD,EAAQG,KAAR,CAAxB;IACH,CAJD;;IAMA,MAAMG,QAAQ,GAAIJ,KAAD,IAA8B;MAAA;;MAC3C,MAAM;QAAEK,CAAF;QAAKJ;MAAL,IAAeD,KAAK,CAACE,WAAN,CAAkBC,MAAvC;MAEA3B,gBAAgB,CAACsB,KAAD,EAAQO,CAAR,EAAWJ,KAAX,CAAhB,CAH2C,CAK3C;;MACA,yCAAAJ,KAAK,CAACxD,KAAN,EAAY+D,QAAZ,mGAAuBJ,KAAvB;IACH,CAPD;;IASA,MAAMM,WAAW,GAAIC,CAAD,IAA8B;MAC9C,IAAI1D,yBAAyB,KAAK,QAAlC,EAA4C;QACxC0D,CAAC,CAACC,cAAF;MACH;IACJ,CAJD;;IAMA,MAAMC,OAAO,GAAG,MAAM;MAAA;;MAClBzC,MAAM,CAAC8B,KAAD,CAAN,CADkB,CAGlB;;MACA,yCAAAD,KAAK,CAACxD,KAAN,EAAYoE,OAAZ;IACH,CALD,CA1B+D,CAiC/D;;;IACA,MAAMC,QAAQ,GAAGb,KAAK,CAACxD,KAAN,CAAYc,KAA7B,CAlC+D,CAoC/D;;IACA,MAAMwD,UAAU,gBAAG3G,YAAY,CAAC6F,KAAD,EAAQ;MACnCe,eAAe,EAAE,CAAClE,gBAAD,IAAqB,CAACiC,kBADJ;MAEnCoB,gBAFmC;MAGnCK,QAHmC;MAInCK,OAJmC;MAKnCH,WALmC;MAMnCO,WAAW,EAAErE,KANsB;MAOnCU,IAPmC;MAQnCE,OARmC;MASnCT,aATmC;MAUnCQ,KAAK,EAAE3C,GAAG,CAAC,CACPuC,UAAU,GAAG+D,SAAH,GAAexC,MAAM,CAAC3C,QADzB,EAEP+E,QAFO,CAAD;IAVyB,CAAR,CAA/B;IAgBA,oBACI,oBAAC,aAAD;MACI,QAAQ,EAAEC,UADd;MAEI,KAAK,EAAEb,KAFX;MAGI,YAAY,EAAEpC;IAHlB,EADJ;EAOH,CA5DmB,CAAH,wDAAG,oBA4DhBqD,MA5DgB,CA4DTC,OA5DS,CAApB;EA8DA,MAAMC,YAAY,GAAGtC,kBAAkB,gBACnC,oBAAC,YAAD;IACI,WAAW,EAAEE,WADjB;IAEI,QAAQ,EAAEnC,gBAFd;IAGI,YAAY,EAAEgB;EAHlB,EADmC,GAMnC,IANJ;EAQA,MAAMwD,kBAA6C,GAAG;IAClDC,OAAO,EAAE7F,KAAK,CAACU,OAAN,CAAcoF,UAAd,CAAyBlF,IADgB;IAElDmF,GAAG,EAAE/F,KAAK,CAACU,OAAN,CAAcoF,UAAd,CAAyBC;EAFoB,CAAtD;EAKA,oBACI,oBAAC,eAAD,CAAiB,QAAjB;IAA0B,KAAK,EAAE;MAAEzC;IAAF;EAAjC,gBACI,oBAAC,IAAD;IACI,KAAK,EAAEpE,GAAG,CAAC,CACP8D,MAAM,CAAC/C,IADA,EAEPsC,cAFO,EAGP;MAAEyD,eAAe,EAAEJ,kBAAkB,CAAC1E,KAAD;IAArC,CAHO,EAIPO,UAAU,GAAG+D,SAAH,GAAexC,MAAM,CAAC7C,SAJzB,EAKP0B,KALO,CAAD;EADd,GASKJ,UAAU,gBACP,oBAAC,kBAAD;IACI,gCAAgC,EAAE,KADtC;IAEI,OAAO,EAAE,KAFb;IAGI,qBAAqB,EAAEvC,GAAG,CAAC,CACvBuD,qBADuB,EAEvBf,+BAFuB,CAAD,CAH9B;IAOI,WAAW,EAAE6B,WAPjB;IAQI,sBAAsB,EAAE,IAR5B;IASI,UAAU,EAAE,IAThB;IAUI,YAAY,EAAEnB,gBAVlB;IAWI,YAAY,EAAE,KAXlB;IAYI,8BAA8B,EAAE,KAZpC;IAaI,4BAA4B,EAAE,KAblC;IAcI,mBAAmB,EAAEd,mBAdzB;IAeI,yBAAyB,EAAEC;EAf/B,GAiBK8C,WAjBL,EAkBKsB,YAlBL,CADO,gBAsBP,oBAAC,KAAD,CAAO,QAAP,QACKtB,WADL,EAEKsB,YAFL,CA/BR,EAqCKhE,WAAW,gBACR,oBAAC,IAAD;IACI,aAAa,EAAE,MADnB;IAEI,KAAK,EAAEqB,MAAM,CAACzC;EAFlB,EADQ,GAKR,IA1CR,CADJ,CADJ;AAgDH,CAzNsB,CAAvB;AA2NA,eAAeO,IAAf"}

package/build/typescript/Accordion/Accordion.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type AccordionProps from './AccordionProps';
 export default function Accordion(props: AccordionProps): JSX.Element;

package/build/typescript/AspectRatio/AspectRatioNative.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type AspectRatioProps from './AspectRatioProps';
 export default function AspectRatio(props: AspectRatioProps): JSX.Element | null;

package/build/typescript/AspectRatio/AspectRatioWeb.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type AspectRatioProps from './AspectRatioProps';
 export default function AspectRatio(props: AspectRatioProps): JSX.Element | null;

package/build/typescript/Avatar/Avatar.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type AvatarProps from './AvatarProps';
 export default function Avatar(props: AvatarProps): JSX.Element;

package/build/typescript/Badge/Badge.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type BadgeProps from './BadgeProps';
 export default function Badge(props: BadgeProps): JSX.Element;

package/build/typescript/BottomSheetActions/BottomSheetActions.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type BottomSheetActionsProps from './BottomSheetActionsProps';
 export default function BottomSheetActions(props: BottomSheetActionsProps): JSX.Element;

package/build/typescript/BottomSheetContent/BottomSheetContent.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type BottomSheetContentProps from './BottomSheetContentProps';
 export default function BottomSheetContent(props: BottomSheetContentProps): JSX.Element;

package/build/typescript/BottomSheetTitle/BottomSheetTitle.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type BottomSheetTitleProps from './BottomSheetTitleProps';
 export default function BottomSheetTitle(props: BottomSheetTitleProps): JSX.Element;

package/build/typescript/Button/Button.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ButtonProps from './ButtonProps';
 export default function Button(props: ButtonProps): JSX.Element;

package/build/typescript/ButtonBase/ButtonBase.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type ButtonBaseProps from './ButtonBaseProps';
 export declare const ORIGINAL_OPACITY = 1;
 export default function ButtonBase(props: ButtonBaseProps): JSX.Element;

package/build/typescript/ButtonSet/ButtonSet.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ButtonSetProps from './ButtonSetProps';
 export default function ButtonSet(props: ButtonSetProps): JSX.Element;

package/build/typescript/Card/Card.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type CardProps from './CardProps';
 export default function Card(props: CardProps): JSX.Element;

package/build/typescript/CardActions/CardActions.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type CardActionsProps from './CardActionsProps';
 export default function CardActions(props: CardActionsProps): JSX.Element;

package/build/typescript/CardContent/CardContent.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type CardContentProps from './CardContentProps';
 export default function CardContent(props: CardContentProps): JSX.Element;

package/build/typescript/CardMedia/CardMedia.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type CardMediaProps from './CardMediaProps';
 export default function CardMedia(props: CardMediaProps): JSX.Element;

package/build/typescript/Checkbox/Checkbox.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type CheckboxProps from './CheckboxProps';
 export default function Checkbox(props: CheckboxProps): JSX.Element;

package/build/typescript/Chip/Chip.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ChipProps from './ChipProps';
 export default function Chip(props: ChipProps): JSX.Element;

package/build/typescript/CircularProgress/CircularProgress.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { ViewProps } from 'react-native';
 import type { OverridableComponentProps } from '../types';
 export default function CircularProgress(props: OverridableComponentProps<ViewProps>): JSX.Element;

package/build/typescript/Column/Column.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     (props: import("../Flexbox").FlexboxProps): JSX.Element;
     displayName: string;

package/build/typescript/Dialog/Dialog.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type DialogProps from './DialogProps';
 export default function Dialog(props: DialogProps): JSX.Element;

package/build/typescript/DialogActions/DialogActions.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type DialogActionsProps from './DialogActionsProps';
 export default function DialogActions(props: DialogActionsProps): JSX.Element;

package/build/typescript/DialogContent/DialogContent.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type DialogContentProps from './DialogContentProps';
 export default function DialogContent(props: DialogContentProps): JSX.Element;

package/build/typescript/DialogMedia/DialogMedia.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type DialogMediaProps from './DialogMediaProps';
 export default function DialogMedia(props: DialogMediaProps): JSX.Element;

package/build/typescript/DialogTitle/DialogLargeTitle.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { DialogProps } from '../Dialog';
 import type DialogTitleProps from './DialogTitleProps';
 interface DialogLargeTitleProps extends DialogTitleProps {

package/build/typescript/DialogTitle/DialogTitle.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import DialogLargeTitle from './DialogLargeTitle';
 import type DialogTitleProps from './DialogTitleProps';
 declare const DialogTitle: {

package/build/typescript/Divider/Divider.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type DividerProps from './DividerProps';
 export default function Divider(props: DividerProps): JSX.Element;

package/build/typescript/Empty/Empty.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type EmptyProps from './EmptyProps';
 export default function Empty(props: EmptyProps): JSX.Element;

package/build/typescript/Fab/Fab.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type FabProps from './FabProps';
 export default function Fab(props: FabProps): JSX.Element;

package/build/typescript/Flexbox/Flexbox.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type FlexboxProps from './FlexboxProps';
 export default function createFlexbox(direction: 'row' | 'column'): {
     (props: FlexboxProps): JSX.Element;

package/build/typescript/IconButton/IconButton.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type IconButtonProps from './IconButtonProps';
 export default function IconButton(props: IconButtonProps): JSX.Element;

package/build/typescript/Image/Image.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ImageProps from './ImageProps';
 export default function Image(props: ImageProps): JSX.Element;

package/build/typescript/ImageCore/ImageCoreNative.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ImageCoreProps from './ImageCoreProps';
 export default function ImageCore(props: ImageCoreProps): JSX.Element;

package/build/typescript/ImageCore/ImageCoreWeb.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ImageCoreProps from './ImageCoreProps';
 export default function ImageCore(props: ImageCoreProps): JSX.Element;

package/build/typescript/Link/Link.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type LinkProps from './LinkProps';
 export default function Link(props: LinkProps): JSX.Element;

package/build/typescript/List/List.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ListProps from './ListProps';
 export default function List(props: ListProps): JSX.Element;

package/build/typescript/ListItem/ListItem.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ListItemProps from './ListItemProps';
 export default function ListItem(props: ListItemProps): JSX.Element;

package/build/typescript/ListItemIcon/ListItemIcon.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ListItemIconProps from './ListItemIconProps';
 export default function ListItemIcon(props: ListItemIconProps): JSX.Element;

package/build/typescript/ListItemSecondaryAction/ListItemSecondaryAction.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import ListItemSecondaryActionProps from './ListItemSecondaryActionProps';
 export default function ListItemSecondaryAction(props: ListItemSecondaryActionProps): JSX.Element;

package/build/typescript/ListItemText/ListItemText.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ListItemTextProps from './ListItemTextProps';
 export default function ListItemText(props: ListItemTextProps): JSX.Element;

package/build/typescript/ListSubheader/ListSubheader.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ListSubheaderProps from './ListSubheaderProps';
 export default function ListSubheader(props: ListSubheaderProps): JSX.Element;

package/build/typescript/Menu/Menu.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type MenuProps from './MenuProps';
 export default function Menu(props: MenuProps): JSX.Element;

package/build/typescript/MenuItem/MenuItem.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type MenuItemProps from './MenuItemProps';
 export default function MenuItem(props: MenuItemProps): JSX.Element;

package/build/typescript/Modal/AnimatedContainer/index.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type ModalProps from '../ModalProps';
 declare type AnimatedContainerProps = Pick<ModalProps, 'children' | 'closeAnimation' | 'initialOpacity' | 'initialTranslateY' | 'onEnter' | 'onEntered' | 'onExit' | 'onExited' | 'openAnimation' | 'offsetAnimation' | 'style' | 'visible'>;
 export default function AnimatedContainer(props: AnimatedContainerProps): JSX.Element;

package/build/typescript/Modal/Modal.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type ModalProps from './ModalProps';
 export declare type ModalCloseReasonType = 'OUTSIDE_PRESS' | 'HARDWARE_BACK_PRESS' | 'CLOSE_BUTTON_PRESS' | 'UNKNOWN';
 export interface ModalCloseEvent {

package/build/typescript/Pagination/NumberPagination.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type PaginationProps from './PaginationProps';
 interface NumberPaginationProps {
     currentPage: PaginationProps['page'];

package/build/typescript/Pagination/Pagination.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type PaginationProps from './PaginationProps';
 export default function Pagination(props: PaginationProps): JSX.Element;

package/build/typescript/Portal/Portal.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import PortalHost from './PortalHost';
 import type PortalProps from './PortalProps';
 declare function Portal(props: PortalProps): JSX.Element;

package/build/typescript/Radio/Radio.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type RadioProps from './RadioProps';
 export default function Radio(props: RadioProps): JSX.Element;

package/build/typescript/RadioGroup/RadioGroup.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type RadioGroupProps from './RadioGroupProps';
 export default function RadioGroup(props: RadioGroupProps): JSX.Element;

package/build/typescript/Row/Row.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     (props: import("../Flexbox").FlexboxProps): JSX.Element;
     displayName: string;

package/build/typescript/Section/Section.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type SectionProps from './SectionProps';
 export default function Section(props: SectionProps): JSX.Element;

package/build/typescript/ShadowView/ShadowView.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ShadowViewProps from './ShadowViewProps';
 export default function ShadowView(props: ShadowViewProps): JSX.Element;

package/build/typescript/ShadowView/ShadowView.native.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ShadowViewProps from './ShadowViewProps';
 export default function ShadowView(props: ShadowViewProps): JSX.Element;

package/build/typescript/Slide/Slide.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type SlideProps from './SlideProps';
 export default function Slide(props: SlideProps): JSX.Element;

package/build/typescript/Snackbar/Snackbar.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type SnackbarProps from './SnackbarProps';
 export default function Snackbar(props: SnackbarProps): JSX.Element | null;

package/build/typescript/SnackbarContent/SnackbarContent.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type SnackbarContentProps from './SnackbarContentProps';
 export default function SnackbarContent(props: SnackbarContentProps): JSX.Element;

package/build/typescript/SnackbarContent/StatusIcon.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type SnackbarContentProps from './SnackbarContentProps';
 interface StatusIconProps {
     status: SnackbarContentProps['status'];

package/build/typescript/Spacer/Spacer.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type SpacerProps from './SpacerProps';
 export default function Spacer(props: SpacerProps): JSX.Element;

package/build/typescript/SvgIcon/SvgIcon.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type SvgIconProps from './SvgIconProps';
 export default function SvgIcon(props: SvgIconProps): JSX.Element;

package/build/typescript/Switch/Switch.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type SwitchProps from './SwitchProps';
 export default function Switch(props: SwitchProps): JSX.Element;

package/build/typescript/Tab/Tab.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type TabProps from './TabProps';
 export default function Tab(props: TabProps): JSX.Element;

package/build/typescript/TabBase/TabBase.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type TabBaseProps from './TabBaseProps';
 export default function TabBase(props: TabBaseProps): JSX.Element;

package/build/typescript/Tabs/ScrollableTabsView.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { ScrollViewProps } from 'react-native';
 import TabCoordinate from './TabCoordinate';
 export interface ScrollableTabsViewProps extends ScrollViewProps {

package/build/typescript/Tabs/TabIndicator.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type TabIndicatorProps from './TabIndicatorProps';
 export default function TabIndicator(props: TabIndicatorProps): JSX.Element;

package/build/typescript/Toggle/Toggle.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type ToggleProps from './ToggleProps';
 export default function Toggle(props: ToggleProps): JSX.Element;

package/build/typescript/Toolbar/BackButton/BackButton.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type BackButtonProps from './BackButtonProps';
 export default function BackButton(props: BackButtonProps): JSX.Element;

package/build/typescript/Toolbar/Toolbar.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import BackButton from './BackButton';
 import type ToolbarProps from './ToolbarProps';
 declare const Toolbar: {

package/build/typescript/Tooltip/Beaks/Beak.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type BeakProps from './BeakProps';
 export default function Beak(props: BeakProps): JSX.Element;

package/build/typescript/Tooltip/Beaks/HorizontalLargeBeak.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SvgProps } from 'react-native-svg';
 export default function HorizontalLargeBeak(props: SvgProps): JSX.Element;

package/build/typescript/Tooltip/Beaks/HorizontalSmallBeak.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SvgProps } from 'react-native-svg';
 export default function HorizontalSmallBeak(props: SvgProps): JSX.Element;

package/build/typescript/Tooltip/Beaks/VerticalLargeBeak.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SvgProps } from 'react-native-svg';
 export default function VerticalLargeBeak(props: SvgProps): JSX.Element;

package/build/typescript/Tooltip/Beaks/VerticalSmallBeak.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SvgProps } from 'react-native-svg';
 export default function VerticalSmallBeak(props: SvgProps): JSX.Element;

package/build/typescript/Tooltip/Tooltip.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type TooltipProps from './TooltipProps';
 export default function Tooltip(props: TooltipProps): JSX.Element;

package/build/typescript/internal/icons/CircularProgress.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 declare const _default: () => JSX.Element;
 export default _default;

package/build/typescript/internal/icons/LoadingSpinner/index.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type LoadingSpinnerProps from './LoadingSpinnerProps';
 export default function LoadingSpinner(props: LoadingSpinnerProps): JSX.Element;

package/build/typescript/internal/icons/LoadingSpinner/index.native.d.ts CHANGED Viewed

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type LoadingSpinnerProps from './LoadingSpinnerProps';
 export default function LoadingSpinner(props: LoadingSpinnerProps): JSX.Element;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@fountain-ui/core",
-  "version": "3.0.0-alpha.41",
+  "version": "3.0.0-alpha.42",
   "author": "Fountain-UI Team",
   "description": "React components that implement Tappytoon's Fountain Design.",
   "license": "MIT",
@@ -67,5 +67,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "9e2a6b64b8a06914bf89b689a3376da01a8d9ee3"
+  "gitHead": "4a7de3f29299eb5f7ea9b6b874f232263756f854"
 }

package/src/Tabs/Tabs.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import React, { cloneElement, forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
 import type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';
-import { View } from 'react-native';
+import { StyleSheet, View } from 'react-native';
 import { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';
 import { css, useTheme } from '../styles';
 import { useSyncAnimatedValue } from '../hooks';
@@ -23,7 +23,7 @@ type TabsStyleKeys =
     | 'root'
     | 'fixedRoot'
     | 'fixedTab'
-    | 'bottomDivider';
+    | 'borderContainer';
 type TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;
@@ -31,14 +31,17 @@ const useStyles: UseStyles<TabsStyles> = function (): TabsStyles {
     const theme = useTheme();
     return {
-        root: {},
+        root: {
+            position: 'relative',
+        },
         fixedRoot: {
             flexDirection: 'row',
         },
         fixedTab: {
             flex: 1,
         },
-        bottomDivider: {
+        borderContainer: {
+            ...StyleSheet.absoluteFillObject,
             borderBottomColor: theme.palette.border.base,
             borderBottomWidth: 0.5,
         },
@@ -221,7 +224,6 @@ const Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {
                     styles.root,
                     containerStyle,
                     { backgroundColor: backgroundColorMap[color] },
-                    showDivider ? styles.bottomDivider : undefined,
                     scrollable ? undefined : styles.fixedRoot,
                     style,
                 ])}
@@ -253,6 +255,13 @@ const Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {
                         {tabIndicator}
                     </React.Fragment>
                 )}
+                {showDivider ? (
+                    <View
+                        pointerEvents={'none'}
+                        style={styles.borderContainer}
+                    />
+                ) : null}
             </View>
         </InternalContext.Provider>
     );