@fountain-ui/core 2.0.0-beta.21 → 2.0.0-beta.24

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 (48) hide show
  1. package/build/commonjs/Tabs/ScrollableTabsView.js +2 -1
  2. package/build/commonjs/Tabs/ScrollableTabsView.js.map +1 -1
  3. package/build/commonjs/Tabs/Tabs.js +1 -0
  4. package/build/commonjs/Tabs/Tabs.js.map +1 -1
  5. package/build/commonjs/Tabs/useScrollViewReaction.js +20 -12
  6. package/build/commonjs/Tabs/useScrollViewReaction.js.map +1 -1
  7. package/build/commonjs/hooks/useCollapsibleAppBar.js +2 -4
  8. package/build/commonjs/hooks/useCollapsibleAppBar.js.map +1 -1
  9. package/build/commonjs/hooks/useSyncAnimatedValue.js +2 -1
  10. package/build/commonjs/hooks/useSyncAnimatedValue.js.map +1 -1
  11. package/build/commonjs/store/MockStore.js +5 -1
  12. package/build/commonjs/store/MockStore.js.map +1 -1
  13. package/build/commonjs/store/SimpleStore.js +21 -15
  14. package/build/commonjs/store/SimpleStore.js.map +1 -1
  15. package/build/commonjs/store/index.js.map +1 -1
  16. package/build/commonjs/store/types.js.map +1 -1
  17. package/build/module/Tabs/ScrollableTabsView.js +2 -1
  18. package/build/module/Tabs/ScrollableTabsView.js.map +1 -1
  19. package/build/module/Tabs/Tabs.js +1 -0
  20. package/build/module/Tabs/Tabs.js.map +1 -1
  21. package/build/module/Tabs/useScrollViewReaction.js +20 -12
  22. package/build/module/Tabs/useScrollViewReaction.js.map +1 -1
  23. package/build/module/hooks/useCollapsibleAppBar.js +3 -5
  24. package/build/module/hooks/useCollapsibleAppBar.js.map +1 -1
  25. package/build/module/hooks/useSyncAnimatedValue.js +2 -1
  26. package/build/module/hooks/useSyncAnimatedValue.js.map +1 -1
  27. package/build/module/store/MockStore.js +5 -1
  28. package/build/module/store/MockStore.js.map +1 -1
  29. package/build/module/store/SimpleStore.js +21 -15
  30. package/build/module/store/SimpleStore.js.map +1 -1
  31. package/build/module/store/index.js.map +1 -1
  32. package/build/module/store/types.js.map +1 -1
  33. package/build/typescript/Tabs/ScrollableTabsView.d.ts +1 -0
  34. package/build/typescript/Tabs/useScrollViewReaction.d.ts +1 -1
  35. package/build/typescript/store/MockStore.d.ts +5 -4
  36. package/build/typescript/store/SimpleStore.d.ts +7 -6
  37. package/build/typescript/store/index.d.ts +1 -1
  38. package/build/typescript/store/types.d.ts +5 -3
  39. package/package.json +2 -2
  40. package/src/Tabs/ScrollableTabsView.tsx +3 -1
  41. package/src/Tabs/Tabs.tsx +1 -0
  42. package/src/Tabs/useScrollViewReaction.ts +21 -11
  43. package/src/hooks/useCollapsibleAppBar.ts +3 -3
  44. package/src/hooks/useSyncAnimatedValue.ts +2 -1
  45. package/src/store/MockStore.ts +8 -4
  46. package/src/store/SimpleStore.ts +26 -19
  47. package/src/store/index.ts +1 -1
  48. package/src/store/types.ts +6 -3
@@ -18,12 +18,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
18
18
  function ScrollableTabsView(props) {
19
19
  const {
20
20
  coordinates,
21
+ initialIndex,
21
22
  ...scrollViewProps
22
23
  } = props;
23
24
  const {
24
25
  scrollViewRef,
25
26
  onLayout
26
- } = (0, _useScrollViewReaction.default)(coordinates);
27
+ } = (0, _useScrollViewReaction.default)(initialIndex, coordinates);
27
28
  return /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, _extends({
28
29
  ref: scrollViewRef,
29
30
  onLayout: onLayout
@@ -1 +1 @@
1
- {"version":3,"names":["ScrollableTabsView","props","coordinates","scrollViewProps","scrollViewRef","onLayout","useScrollViewReaction"],"sources":["ScrollableTabsView.tsx"],"sourcesContent":["import React from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport { ScrollView } from 'react-native';\nimport TabCoordinate from './TabCoordinate';\nimport useScrollViewReaction from './useScrollViewReaction';\n\nexport interface ScrollableTabsViewProps extends ScrollViewProps {\n coordinates: TabCoordinate[];\n}\n\nexport default function ScrollableTabsView(props: ScrollableTabsViewProps) {\n const {\n coordinates,\n ...scrollViewProps\n } = props;\n\n const { scrollViewRef, onLayout } = useScrollViewReaction(coordinates);\n\n return (\n <ScrollView\n ref={scrollViewRef}\n onLayout={onLayout}\n {...scrollViewProps}\n />\n );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA;;;;;;AAMe,SAASA,kBAAT,CAA4BC,KAA5B,EAA4D;EACvE,MAAM;IACFC,WADE;IAEF,GAAGC;EAFD,IAGFF,KAHJ;EAKA,MAAM;IAAEG,aAAF;IAAiBC;EAAjB,IAA8B,IAAAC,8BAAA,EAAsBJ,WAAtB,CAApC;EAEA,oBACI,6BAAC,uBAAD;IACI,GAAG,EAAEE,aADT;IAEI,QAAQ,EAAEC;EAFd,GAGQF,eAHR,EADJ;AAOH;;AAAA"}
1
+ {"version":3,"names":["ScrollableTabsView","props","coordinates","initialIndex","scrollViewProps","scrollViewRef","onLayout","useScrollViewReaction"],"sources":["ScrollableTabsView.tsx"],"sourcesContent":["import React from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport { ScrollView } from 'react-native';\nimport TabCoordinate from './TabCoordinate';\nimport useScrollViewReaction from './useScrollViewReaction';\n\nexport interface ScrollableTabsViewProps extends ScrollViewProps {\n initialIndex: number;\n coordinates: TabCoordinate[];\n}\n\nexport default function ScrollableTabsView(props: ScrollableTabsViewProps) {\n const {\n coordinates,\n initialIndex,\n ...scrollViewProps\n } = props;\n\n const { scrollViewRef, onLayout } = useScrollViewReaction(initialIndex, coordinates);\n\n return (\n <ScrollView\n ref={scrollViewRef}\n onLayout={onLayout}\n {...scrollViewProps}\n />\n );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA;;;;;;AAOe,SAASA,kBAAT,CAA4BC,KAA5B,EAA4D;EACvE,MAAM;IACFC,WADE;IAEFC,YAFE;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAM;IAAEI,aAAF;IAAiBC;EAAjB,IAA8B,IAAAC,8BAAA,EAAsBJ,YAAtB,EAAoCD,WAApC,CAApC;EAEA,oBACI,6BAAC,uBAAD;IACI,GAAG,EAAEG,aADT;IAEI,QAAQ,EAAEC;EAFd,GAGQF,eAHR,EADJ;AAOH;;AAAA"}
@@ -143,6 +143,7 @@ const Tabs = /*#__PURE__*/(0, _react.forwardRef)(function Tabs(props, ref) {
143
143
  coordinates: coordinates,
144
144
  directionalLockEnabled: true,
145
145
  horizontal: true,
146
+ initialIndex: realInitialIndex,
146
147
  scrollsToTop: false,
147
148
  showsHorizontalScrollIndicator: false,
148
149
  showsVerticalScrollIndicator: false,
@@ -1 +1 @@
1
- {"version":3,"names":["useStyles","theme","useTheme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","forwardRef","props","ref","children","initialIndex","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","style","variant","UNSTABLE_sharedIndex","fallbackSharedIndex","useSyncAnimatedValue","initialValue","sharedIndex","realInitialIndex","setTab","newIndex","animatedValue","setValue","useImperativeHandle","styles","coordinates","updateCoordinate","useTabCoordinates","canRenderIndicator","isEveryTabCoordinatesDefined","indexStore","useIndexStore","useEffect","subscribe","tabElements","React","Children","map","child","index","onLayout","event","x","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","tabElement","cloneElement","enableIndicator","undefined","tabIndicator","css"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type TabsProps from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n | 'root'\n | 'fixedRoot'\n | 'fixedTab'\n | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {},\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n scrollableContainer: {\n paddingHorizontal: theme.spacing(1),\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n initialIndex = 0,\n disableIndicator = false,\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n style,\n variant = 'primary',\n UNSTABLE_sharedIndex,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const setTab = (newIndex: number) => {\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const [coordinates, updateCoordinate] = useTabCoordinates(children);\n\n const canRenderIndicator = isEveryTabCoordinatesDefined(coordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onLayout,\n onPress,\n onMouseDown,\n variant,\n style: scrollable ? undefined : styles.fixedTab,\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n });\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n scrollable={scrollable}\n />\n ) : null;\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={styles.scrollableContainer}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n 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","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","forwardRef","props","ref","children","initialIndex","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","style","variant","UNSTABLE_sharedIndex","fallbackSharedIndex","useSyncAnimatedValue","initialValue","sharedIndex","realInitialIndex","setTab","newIndex","animatedValue","setValue","useImperativeHandle","styles","coordinates","updateCoordinate","useTabCoordinates","canRenderIndicator","isEveryTabCoordinatesDefined","indexStore","useIndexStore","useEffect","subscribe","tabElements","React","Children","map","child","index","onLayout","event","x","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","tabElement","cloneElement","enableIndicator","undefined","tabIndicator","css"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type TabsProps from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n | 'root'\n | 'fixedRoot'\n | 'fixedTab'\n | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {},\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n scrollableContainer: {\n paddingHorizontal: theme.spacing(1),\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n initialIndex = 0,\n disableIndicator = false,\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n style,\n variant = 'primary',\n UNSTABLE_sharedIndex,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const setTab = (newIndex: number) => {\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const [coordinates, updateCoordinate] = useTabCoordinates(children);\n\n const canRenderIndicator = isEveryTabCoordinatesDefined(coordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onLayout,\n onPress,\n onMouseDown,\n variant,\n style: scrollable ? undefined : styles.fixedTab,\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n });\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n scrollable={scrollable}\n />\n ) : null;\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={styles.scrollableContainer}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n initialIndex={realInitialIndex}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n showsVerticalScrollIndicator={false}\n keyboardDismissMode={keyboardDismissMode}\n keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n >\n {tabElements}\n {tabIndicator}\n </ScrollableTabsView>\n ) : (\n <React.Fragment>\n {tabElements}\n {tabIndicator}\n </React.Fragment>\n )}\n </View>\n </InternalContext.Provider>\n );\n});\n\nexport default Tabs;\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAUA,MAAMA,SAAgC,GAAG,YAAwB;EAC7D,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE,EADH;IAEHC,SAAS,EAAE;MACPC,aAAa,EAAE;IADR,CAFR;IAKHC,QAAQ,EAAE;MACNC,IAAI,EAAE;IADA,CALP;IAQHC,mBAAmB,EAAE;MACjBC,iBAAiB,EAAER,KAAK,CAACS,OAAN,CAAc,CAAd;IADF;EARlB,CAAP;AAYH,CAfD;;AAiBA,MAAMC,IAAI,gBAAG,IAAAC,iBAAA,EAAoC,SAASD,IAAT,CAAcE,KAAd,EAAqBC,GAArB,EAA0B;EACvE,MAAM;IACFC,QADE;IAEFC,YAAY,GAAG,CAFb;IAGFC,gBAAgB,GAAG,KAHjB;IAIFC,mBAAmB,GAAG,MAJpB;IAKFC,yBAAyB,GAAG,OAL1B;IAMFC,QANE;IAOFC,UAAU,GAAG,KAPX;IAQFC,KARE;IASFC,OAAO,GAAG,SATR;IAUFC;EAVE,IAWFX,KAXJ;EAaA,MAAMY,mBAAmB,GAAG,IAAAC,2BAAA,EAAqB;IAAEC,YAAY,EAAEX;EAAhB,CAArB,CAA5B;EACA,MAAMY,WAAW,GAAGJ,oBAAoB,IAAIC,mBAA5C;EACA,MAAMI,gBAAgB,GAAGD,WAAW,CAACD,YAArC;;EAEA,MAAMG,MAAM,GAAIC,QAAD,IAAsB;IACjCH,WAAW,CAACI,aAAZ,CAA0BC,QAA1B,CAAmCF,QAAnC;EACH,CAFD;;EAIA,IAAAG,0BAAA,EACIpB,GADJ,EAEI,OAAO;IACHgB;EADG,CAAP,CAFJ,EAKI,CAACF,WAAD,CALJ;EAQA,MAAMO,MAAM,GAAGnC,SAAS,EAAxB;EAEA,MAAM,CAACoC,WAAD,EAAcC,gBAAd,IAAkC,IAAAC,0BAAA,EAAkBvB,QAAlB,CAAxC;EAEA,MAAMwB,kBAAkB,GAAG,IAAAC,mCAAA,EAA6BJ,WAA7B,EAA0CrB,QAA1C,CAA3B;EAEA,MAAM0B,UAAU,GAAG,IAAAC,sBAAA,EAAcd,WAAd,CAAnB;EAEA,IAAAe,gBAAA,EAAU,MAAM;IACZ,OAAOF,UAAU,CAACG,SAAX,CAAqBb,QAAQ,IAAI;MACpCX,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGW,QAAH,CAAR;IACH,CAFM,CAAP;EAGH,CAJD,EAIG,CAACU,UAAD,EAAarB,QAAb,CAJH;;EAMA,MAAMyB,WAAW,GAAGC,cAAA,CAAMC,QAAN,CAAeC,GAAf,CAAmBjC,QAAnB,EAA6B,CAACkC,KAAD,EAAQC,KAAR,KAAkB;IAC/D,MAAMC,QAAQ,GAAIC,KAAD,IAA8B;MAC3C,MAAM;QAAEC,CAAF;QAAKC;MAAL,IAAeF,KAAK,CAACG,WAAN,CAAkBC,MAAvC;MAEAnB,gBAAgB,CAACa,KAAD,EAAQG,CAAR,EAAWC,KAAX,CAAhB;IACH,CAJD;;IAMA,MAAMG,WAAW,GAAIC,CAAD,IAA8B;MAC9C,IAAIvC,yBAAyB,KAAK,QAAlC,EAA4C;QACxCuC,CAAC,CAACC,cAAF;MACH;IACJ,CAJD;;IAMA,MAAMC,OAAO,GAAG,MAAM;MAAA;;MAClB9B,MAAM,CAACoB,KAAD,CAAN,CADkB,CAGlB;;MACA,wCAAAD,KAAK,CAACpC,KAAN,EAAY+C,OAAZ;IACH,CALD,CAb+D,CAoB/D;;;IACA,MAAMC,UAAU,gBAAG,IAAAC,mBAAA,EAAab,KAAb,EAAoB;MACnCc,eAAe,EAAE,CAAC9C,gBAAD,IAAqB,CAACsB,kBADJ;MAEnCY,QAFmC;MAGnCS,OAHmC;MAInCH,WAJmC;MAKnClC,OALmC;MAMnCD,KAAK,EAAED,UAAU,GAAG2C,SAAH,GAAe7B,MAAM,CAAC7B;IANJ,CAApB,CAAnB;IASA,oBACI,6BAAC,sBAAD;MACI,QAAQ,EAAEuD,UADd;MAEI,KAAK,EAAEX,KAFX;MAGI,YAAY,EAAErB;IAHlB,EADJ;EAOH,CArCmB,CAApB;;EAuCA,MAAMoC,YAAY,GAAG1B,kBAAkB,gBACnC,6BAAC,qBAAD;IACI,WAAW,EAAEH,WADjB;IAEI,QAAQ,EAAEnB,gBAFd;IAGI,YAAY,EAAEY,gBAHlB;IAII,UAAU,EAAER;EAJhB,EADmC,GAOnC,IAPJ;EASA,oBACI,6BAAC,wBAAD,CAAiB,QAAjB;IAA0B,KAAK,EAAE;MAAEoB;IAAF;EAAjC,gBACI,6BAAC,iBAAD;IACI,KAAK,EAAE,IAAAyB,WAAA,EAAI,CACP/B,MAAM,CAAChC,IADA,EAEPkB,UAAU,GAAG2C,SAAH,GAAe7B,MAAM,CAAC/B,SAFzB,EAGPkB,KAHO,CAAJ;EADX,GAOKD,UAAU,gBACP,6BAAC,2BAAD;IACI,gCAAgC,EAAE,KADtC;IAEI,OAAO,EAAE,KAFb;IAGI,qBAAqB,EAAEc,MAAM,CAAC3B,mBAHlC;IAII,WAAW,EAAE4B,WAJjB;IAKI,sBAAsB,EAAE,IAL5B;IAMI,UAAU,EAAE,IANhB;IAOI,YAAY,EAAEP,gBAPlB;IAQI,YAAY,EAAE,KARlB;IASI,8BAA8B,EAAE,KATpC;IAUI,4BAA4B,EAAE,KAVlC;IAWI,mBAAmB,EAAEX,mBAXzB;IAYI,yBAAyB,EAAEC;EAZ/B,GAcK0B,WAdL,EAeKoB,YAfL,CADO,gBAmBP,6BAAC,cAAD,CAAO,QAAP,QACKpB,WADL,EAEKoB,YAFL,CA1BR,CADJ,CADJ;AAoCH,CAhIY,CAAb;eAkIetD,I"}
@@ -11,7 +11,7 @@ var _InternalContext = _interopRequireDefault(require("./InternalContext"));
11
11
 
12
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
13
 
14
- function useScrollViewReaction(coordinates) {
14
+ function useScrollViewReaction(initialIndex, coordinates) {
15
15
  const scrollViewRef = (0, _react.useRef)(null);
16
16
  const lastScrolledXRef = (0, _react.useRef)(NaN);
17
17
  const {
@@ -34,23 +34,31 @@ function useScrollViewReaction(coordinates) {
34
34
  const onLayout = (0, _react.useCallback)(() => {
35
35
  scrollToX(lastScrolledXRef.current);
36
36
  }, []);
37
- (0, _react.useEffect)(() => {
38
- const computeNextScrollX = index => {
39
- const prevIndex = index - 1;
40
- const prevCoordinate = coordinates[prevIndex];
37
+ const computeNextScrollX = (0, _react.useCallback)(index => {
38
+ const prevIndex = index - 1;
39
+ const prevCoordinate = coordinates[prevIndex];
41
40
 
42
- if (prevCoordinate) {
43
- const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
44
- return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
45
- }
41
+ if (prevCoordinate) {
42
+ const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
43
+ return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
44
+ }
46
45
 
47
- return 0;
48
- };
46
+ return 0;
47
+ }, [coordinates]);
48
+ (0, _react.useEffect)(() => {
49
+ if (Number.isNaN(lastScrolledXRef.current)) {
50
+ const x = computeNextScrollX(initialIndex);
49
51
 
52
+ if (x > 0) {
53
+ scrollToX(x);
54
+ }
55
+ }
56
+ }, [initialIndex, computeNextScrollX]);
57
+ (0, _react.useEffect)(() => {
50
58
  return indexStore.subscribe(currentIndex => {
51
59
  scrollToX(computeNextScrollX(currentIndex));
52
60
  });
53
- }, [indexStore, coordinates]);
61
+ }, [indexStore, computeNextScrollX]);
54
62
  return {
55
63
  scrollViewRef,
56
64
  onLayout
@@ -1 +1 @@
1
- {"version":3,"names":["useScrollViewReaction","coordinates","scrollViewRef","useRef","lastScrolledXRef","NaN","indexStore","useContext","InternalContext","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","useCallback","useEffect","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n scrollViewRef: MutableRefObject<ScrollView | null>;\n onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n const scrollViewRef = useRef<ScrollView | null>(null);\n\n const lastScrolledXRef = useRef<number>(NaN);\n\n const { indexStore } = useContext(InternalContext);\n\n const scrollToX = (x: number) => {\n if (Number.isFinite(x)) {\n scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n lastScrolledXRef.current = x;\n }\n };\n\n const onLayout = useCallback(() => {\n scrollToX(lastScrolledXRef.current);\n }, []);\n\n useEffect(() => {\n const computeNextScrollX = (index: number) => {\n const prevIndex = index - 1;\n const prevCoordinate = coordinates[prevIndex];\n\n if (prevCoordinate) {\n const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n }\n\n return 0;\n };\n\n return indexStore.subscribe(currentIndex => {\n scrollToX(computeNextScrollX(currentIndex));\n });\n }, [indexStore, coordinates]);\n\n return { scrollViewRef, onLayout };\n};\n"],"mappings":";;;;;;;AACA;;AAGA;;;;AAOe,SAASA,qBAAT,CACXC,WADW,EAEU;EACrB,MAAMC,aAAa,GAAG,IAAAC,aAAA,EAA0B,IAA1B,CAAtB;EAEA,MAAMC,gBAAgB,GAAG,IAAAD,aAAA,EAAeE,GAAf,CAAzB;EAEA,MAAM;IAAEC;EAAF,IAAiB,IAAAC,iBAAA,EAAWC,wBAAX,CAAvB;;EAEA,MAAMC,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAR,aAAa,CAACW,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAZ,gBAAgB,CAACS,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAG,IAAAC,kBAAA,EAAY,MAAM;IAC/BT,SAAS,CAACL,gBAAgB,CAACS,OAAlB,CAAT;EACH,CAFgB,EAEd,EAFc,CAAjB;EAIA,IAAAM,gBAAA,EAAU,MAAM;IACZ,MAAMC,kBAAkB,GAAIC,KAAD,IAAmB;MAC1C,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;MACA,MAAME,cAAc,GAAGtB,WAAW,CAACqB,SAAD,CAAlC;;MAEA,IAAIC,cAAJ,EAAoB;QAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;QACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;MACH;;MAED,OAAO,CAAP;IACH,CAVD;;IAYA,OAAOlB,UAAU,CAACuB,SAAX,CAAqBC,YAAY,IAAI;MACxCrB,SAAS,CAACW,kBAAkB,CAACU,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAhBD,EAgBG,CAACxB,UAAD,EAAaL,WAAb,CAhBH;EAkBA,OAAO;IAAEC,aAAF;IAAiBe;EAAjB,CAAP;AACH;;AAAA"}
1
+ {"version":3,"names":["useScrollViewReaction","initialIndex","coordinates","scrollViewRef","useRef","lastScrolledXRef","NaN","indexStore","useContext","InternalContext","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","useCallback","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","useEffect","isNaN","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n scrollViewRef: MutableRefObject<ScrollView | null>;\n onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n initialIndex: number,\n coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n const scrollViewRef = useRef<ScrollView | null>(null);\n\n const lastScrolledXRef = useRef<number>(NaN);\n\n const { indexStore } = useContext(InternalContext);\n\n const scrollToX = (x: number) => {\n if (Number.isFinite(x)) {\n scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n lastScrolledXRef.current = x;\n }\n };\n\n const onLayout = useCallback(() => {\n scrollToX(lastScrolledXRef.current);\n }, []);\n\n const computeNextScrollX = useCallback((index: number): number => {\n const prevIndex = index - 1;\n const prevCoordinate = coordinates[prevIndex];\n\n if (prevCoordinate) {\n const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n }\n\n return 0;\n }, [coordinates]);\n\n useEffect(() => {\n if (Number.isNaN(lastScrolledXRef.current)) {\n const x = computeNextScrollX(initialIndex);\n if (x > 0) {\n scrollToX(x);\n }\n }\n }, [initialIndex, computeNextScrollX]);\n\n useEffect(() => {\n return indexStore.subscribe(currentIndex => {\n scrollToX(computeNextScrollX(currentIndex));\n });\n }, [indexStore, computeNextScrollX]);\n\n return { scrollViewRef, onLayout };\n};\n"],"mappings":";;;;;;;AACA;;AAGA;;;;AAOe,SAASA,qBAAT,CACXC,YADW,EAEXC,WAFW,EAGU;EACrB,MAAMC,aAAa,GAAG,IAAAC,aAAA,EAA0B,IAA1B,CAAtB;EAEA,MAAMC,gBAAgB,GAAG,IAAAD,aAAA,EAAeE,GAAf,CAAzB;EAEA,MAAM;IAAEC;EAAF,IAAiB,IAAAC,iBAAA,EAAWC,wBAAX,CAAvB;;EAEA,MAAMC,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAR,aAAa,CAACW,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAZ,gBAAgB,CAACS,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAG,IAAAC,kBAAA,EAAY,MAAM;IAC/BT,SAAS,CAACL,gBAAgB,CAACS,OAAlB,CAAT;EACH,CAFgB,EAEd,EAFc,CAAjB;EAIA,MAAMM,kBAAkB,GAAG,IAAAD,kBAAA,EAAaE,KAAD,IAA2B;IAC9D,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;IACA,MAAME,cAAc,GAAGrB,WAAW,CAACoB,SAAD,CAAlC;;IAEA,IAAIC,cAAJ,EAAoB;MAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;MACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;IACH;;IAED,OAAO,CAAP;EACH,CAV0B,EAUxB,CAACtB,WAAD,CAVwB,CAA3B;EAYA,IAAA2B,gBAAA,EAAU,MAAM;IACZ,IAAIjB,MAAM,CAACkB,KAAP,CAAazB,gBAAgB,CAACS,OAA9B,CAAJ,EAA4C;MACxC,MAAMH,CAAC,GAAGS,kBAAkB,CAACnB,YAAD,CAA5B;;MACA,IAAIU,CAAC,GAAG,CAAR,EAAW;QACPD,SAAS,CAACC,CAAD,CAAT;MACH;IACJ;EACJ,CAPD,EAOG,CAACV,YAAD,EAAemB,kBAAf,CAPH;EASA,IAAAS,gBAAA,EAAU,MAAM;IACZ,OAAOtB,UAAU,CAACwB,SAAX,CAAqBC,YAAY,IAAI;MACxCtB,SAAS,CAACU,kBAAkB,CAACY,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAJD,EAIG,CAACzB,UAAD,EAAaa,kBAAb,CAJH;EAMA,OAAO;IAAEjB,aAAF;IAAiBe;EAAjB,CAAP;AACH;;AAAA"}
@@ -83,8 +83,7 @@ function useCollapsibleAppBar() {
83
83
  ]);
84
84
  const indexRef = (0, _react.useRef)(0);
85
85
  const offsetsRef = (0, _react.useRef)([]);
86
-
87
- const onScrollViewChanged = nextIndex => {
86
+ const onScrollViewChanged = (0, _react.useCallback)(nextIndex => {
88
87
  const prevIndex = indexRef.current;
89
88
 
90
89
  if (prevIndex === nextIndex) {
@@ -101,8 +100,7 @@ function useCollapsibleAppBar() {
101
100
  if (translateY.value < 0 && savedOffsetY < appBarHeight) {
102
101
  translateY.value = (0, _reactNativeReanimated.withTiming)(0, ANIMATION_CONFIG);
103
102
  }
104
- };
105
-
103
+ }, [appBarHeight]);
106
104
  const scrollHandler = (0, _reactNativeReanimated.useAnimatedScrollHandler)({
107
105
  onBeginDrag: () => {
108
106
  if (keyboardDismissMode === 'on-drag') {
@@ -1 +1 @@
1
- {"version":3,"names":["defaultOptions","keyboardDismissMode","ANIMATION_CONFIG","duration","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","useElevationStyle","animatedStyle","useAnimatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","useRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","withTiming","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","Keyboard","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n runOnJS,\n useAnimatedScrollHandler,\n useAnimatedStyle,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useElevationStyle from './useElevationStyle';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n top?: number;\n bottom?: number;\n left?: number;\n right?: number;\n}\n\nexport interface Options {\n keyboardDismissMode?: 'none' | 'on-drag';\n}\n\nexport interface CollapsibleAppBar {\n appBarStyle: ViewStyleProp;\n onAppBarLayout: OnLayoutCallback;\n onCollapsibleToolbarLayout: OnLayoutCallback;\n onScroll: OnScroll;\n onScrollViewChanged: (index: number) => void;\n scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n keyboardDismissMode: 'none',\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n const { keyboardDismissMode }: Required<Options> = {\n ...defaultOptions,\n ...userOptions,\n };\n\n const styles = useAppbarStyles();\n\n const safeAreaInsets = useSafeAreaInsets();\n\n const [appBarHeight, onAppBarLayout] = useHeight();\n const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n const maxTranslateY = useDerivedValue(() => -collapsibleToolbarHeight, [collapsibleToolbarHeight]);\n\n const translateY = useSharedValue<number>(0);\n const lastTranslateY = useSharedValue<number>(0);\n const lastOffsetY = useSharedValue<number>(0);\n const overlapped = useSharedValue<boolean>(false);\n\n const elevationStyle = useElevationStyle(4);\n const animatedStyle = useAnimatedStyle(() => {\n const transform = [{ translateY: translateY.value }];\n\n if (Platform.OS === 'web') {\n return {\n transform,\n boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n };\n }\n if (Platform.OS === 'android') {\n return {\n transform,\n elevation: overlapped.value ? elevationStyle?.elevation : 0,\n };\n }\n if (Platform.OS === 'ios') {\n return {\n transform,\n shadowColor: elevationStyle?.shadowColor,\n shadowOffset: elevationStyle?.shadowOffset,\n shadowRadius: elevationStyle?.shadowRadius,\n shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n };\n }\n return {};\n }, [\n /**\n * FIXME: Consider add `elevationStyle` to dependencies.\n */\n ]);\n\n const indexRef = useRef<number>(0);\n const offsetsRef = useRef<Array<number>>([]);\n\n const onScrollViewChanged = (nextIndex: number) => {\n const prevIndex = indexRef.current;\n if (prevIndex === nextIndex) {\n return;\n }\n\n offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n lastOffsetY.value = savedOffsetY;\n\n indexRef.current = nextIndex;\n\n // Determine whether to overlap every time index is changed.\n overlapped.value = savedOffsetY > 0;\n\n // If next ScrollView's offset is too short, expand app bar.\n if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n };\n\n const scrollHandler = useAnimatedScrollHandler({\n onBeginDrag: () => {\n if (keyboardDismissMode === 'on-drag') {\n runOnJS(Keyboard.dismiss)();\n }\n lastTranslateY.value = translateY.value;\n },\n onMomentumBegin: () => {\n lastTranslateY.value = translateY.value;\n },\n onScroll: (event) => {\n const offsetY = event.contentOffset.y;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n if (SUPPORTS_DRAG_DETECTION) {\n const dy = offsetY - lastOffsetY.value;\n\n translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n overlapped.value = offsetY + translateY.value > 0;\n } else {\n if (offsetY > -maxTy) {\n if (ty === 0) {\n translateY.value = withTiming(Math.min(Math.max(-offsetY, maxTy), 0), ANIMATION_CONFIG);\n }\n } else {\n if (ty === maxTy) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n }\n\n overlapped.value = offsetY > 0;\n\n lastOffsetY.value = offsetY;\n }\n },\n onEndDrag: (event) => {\n lastOffsetY.value = event.contentOffset.y;\n },\n onMomentumEnd: (event) => {\n const offsetY = event.contentOffset.y;\n\n lastOffsetY.value = offsetY;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n // If toolbar is already positioned on edge, do nothing.\n if (ty <= maxTy || ty >= 0) {\n return;\n }\n\n const threshold = maxTy * 0.5;\n\n const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n overlapped.value = offsetY + nextTranslateY > 0;\n\n translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n },\n }, [keyboardDismissMode, appBarHeight]);\n\n const hasCollapsible = collapsibleToolbarHeight > 0;\n\n const appBarStyle = [\n animatedStyle,\n { paddingTop: safeAreaInsets.top },\n hasCollapsible ? styles.floating : undefined,\n ];\n\n return {\n appBarStyle,\n onAppBarLayout,\n onCollapsibleToolbarLayout,\n onScroll: scrollHandler,\n onScrollViewChanged,\n scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n };\n};\n"],"mappings":"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"}
1
+ {"version":3,"names":["defaultOptions","keyboardDismissMode","ANIMATION_CONFIG","duration","SUPPORTS_DRAG_DETECTION","Platform","OS","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","elevationStyle","useElevationStyle","animatedStyle","useAnimatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","useRef","offsetsRef","onScrollViewChanged","useCallback","nextIndex","prevIndex","current","savedOffsetY","withTiming","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","Keyboard","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n runOnJS,\n useAnimatedScrollHandler,\n useAnimatedStyle,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useElevationStyle from './useElevationStyle';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n top?: number;\n bottom?: number;\n left?: number;\n right?: number;\n}\n\nexport interface Options {\n keyboardDismissMode?: 'none' | 'on-drag';\n}\n\nexport interface CollapsibleAppBar {\n appBarStyle: ViewStyleProp;\n onAppBarLayout: OnLayoutCallback;\n onCollapsibleToolbarLayout: OnLayoutCallback;\n onScroll: OnScroll;\n onScrollViewChanged: (index: number) => void;\n scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n keyboardDismissMode: 'none',\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n const { keyboardDismissMode }: Required<Options> = {\n ...defaultOptions,\n ...userOptions,\n };\n\n const styles = useAppbarStyles();\n\n const safeAreaInsets = useSafeAreaInsets();\n\n const [appBarHeight, onAppBarLayout] = useHeight();\n const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n const maxTranslateY = useDerivedValue(() => -collapsibleToolbarHeight, [collapsibleToolbarHeight]);\n\n const translateY = useSharedValue<number>(0);\n const lastTranslateY = useSharedValue<number>(0);\n const lastOffsetY = useSharedValue<number>(0);\n const overlapped = useSharedValue<boolean>(false);\n\n const elevationStyle = useElevationStyle(4);\n const animatedStyle = useAnimatedStyle(() => {\n const transform = [{ translateY: translateY.value }];\n\n if (Platform.OS === 'web') {\n return {\n transform,\n boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n };\n }\n if (Platform.OS === 'android') {\n return {\n transform,\n elevation: overlapped.value ? elevationStyle?.elevation : 0,\n };\n }\n if (Platform.OS === 'ios') {\n return {\n transform,\n shadowColor: elevationStyle?.shadowColor,\n shadowOffset: elevationStyle?.shadowOffset,\n shadowRadius: elevationStyle?.shadowRadius,\n shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n };\n }\n return {};\n }, [\n /**\n * FIXME: Consider add `elevationStyle` to dependencies.\n */\n ]);\n\n const indexRef = useRef<number>(0);\n const offsetsRef = useRef<Array<number>>([]);\n\n const onScrollViewChanged = useCallback((nextIndex: number) => {\n const prevIndex = indexRef.current;\n if (prevIndex === nextIndex) {\n return;\n }\n\n offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n lastOffsetY.value = savedOffsetY;\n\n indexRef.current = nextIndex;\n\n // Determine whether to overlap every time index is changed.\n overlapped.value = savedOffsetY > 0;\n\n // If next ScrollView's offset is too short, expand app bar.\n if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n }, [appBarHeight]);\n\n const scrollHandler = useAnimatedScrollHandler({\n onBeginDrag: () => {\n if (keyboardDismissMode === 'on-drag') {\n runOnJS(Keyboard.dismiss)();\n }\n lastTranslateY.value = translateY.value;\n },\n onMomentumBegin: () => {\n lastTranslateY.value = translateY.value;\n },\n onScroll: (event) => {\n const offsetY = event.contentOffset.y;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n if (SUPPORTS_DRAG_DETECTION) {\n const dy = offsetY - lastOffsetY.value;\n\n translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n overlapped.value = offsetY + translateY.value > 0;\n } else {\n if (offsetY > -maxTy) {\n if (ty === 0) {\n translateY.value = withTiming(Math.min(Math.max(-offsetY, maxTy), 0), ANIMATION_CONFIG);\n }\n } else {\n if (ty === maxTy) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n }\n\n overlapped.value = offsetY > 0;\n\n lastOffsetY.value = offsetY;\n }\n },\n onEndDrag: (event) => {\n lastOffsetY.value = event.contentOffset.y;\n },\n onMomentumEnd: (event) => {\n const offsetY = event.contentOffset.y;\n\n lastOffsetY.value = offsetY;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n // If toolbar is already positioned on edge, do nothing.\n if (ty <= maxTy || ty >= 0) {\n return;\n }\n\n const threshold = maxTy * 0.5;\n\n const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n overlapped.value = offsetY + nextTranslateY > 0;\n\n translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n },\n }, [keyboardDismissMode, appBarHeight]);\n\n const hasCollapsible = collapsibleToolbarHeight > 0;\n\n const appBarStyle = [\n animatedStyle,\n { paddingTop: safeAreaInsets.top },\n hasCollapsible ? styles.floating : undefined,\n ];\n\n return {\n appBarStyle,\n onAppBarLayout,\n onCollapsibleToolbarLayout,\n onScroll: scrollHandler,\n onScrollViewChanged,\n scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n };\n};\n"],"mappings":"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"}
@@ -11,9 +11,10 @@ var _reactNative = require("react-native");
11
11
 
12
12
  function useSyncAnimatedValue(config) {
13
13
  const {
14
- initialValue,
14
+ initialValue: maybeInitialValue,
15
15
  shouldSyncAlways = false
16
16
  } = config;
17
+ const initialValue = maybeInitialValue ?? 0;
17
18
  const animatedValue = (0, _react.useRef)(new _reactNative.Animated.Value(initialValue)).current;
18
19
  const indexRef = (0, _react.useRef)(initialValue);
19
20
  (0, _react.useEffect)(() => {
@@ -1 +1 @@
1
- {"version":3,"names":["useSyncAnimatedValue","config","initialValue","shouldSyncAlways","animatedValue","useRef","Animated","Value","current","indexRef","useEffect","maybeId","addListener","newValue","value","undefined","removeListener","getCurrentValue"],"sources":["useSyncAnimatedValue.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport type { SyncAnimatedValue } from '../types';\n\nexport interface SyncAnimatedValueConfig {\n initialValue: number;\n shouldSyncAlways?: boolean;\n}\n\nexport default function useSyncAnimatedValue(config: SyncAnimatedValueConfig): SyncAnimatedValue {\n const {\n initialValue,\n shouldSyncAlways = false,\n } = config;\n\n const animatedValue = useRef(new Animated.Value(initialValue)).current;\n\n const indexRef = useRef<number>(initialValue);\n\n useEffect(() => {\n const maybeId = shouldSyncAlways ? animatedValue.addListener((newValue) => {\n indexRef.current = newValue.value;\n }) : undefined;\n\n return () => {\n if (maybeId != null) {\n animatedValue.removeListener(maybeId);\n }\n };\n }, [shouldSyncAlways]);\n\n return {\n animatedValue,\n initialValue,\n getCurrentValue: () => indexRef.current,\n };\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAQe,SAASA,oBAAT,CAA8BC,MAA9B,EAAkF;EAC7F,MAAM;IACFC,YADE;IAEFC,gBAAgB,GAAG;EAFjB,IAGFF,MAHJ;EAKA,MAAMG,aAAa,GAAG,IAAAC,aAAA,EAAO,IAAIC,qBAAA,CAASC,KAAb,CAAmBL,YAAnB,CAAP,EAAyCM,OAA/D;EAEA,MAAMC,QAAQ,GAAG,IAAAJ,aAAA,EAAeH,YAAf,CAAjB;EAEA,IAAAQ,gBAAA,EAAU,MAAM;IACZ,MAAMC,OAAO,GAAGR,gBAAgB,GAAGC,aAAa,CAACQ,WAAd,CAA2BC,QAAD,IAAc;MACvEJ,QAAQ,CAACD,OAAT,GAAmBK,QAAQ,CAACC,KAA5B;IACH,CAFkC,CAAH,GAE3BC,SAFL;IAIA,OAAO,MAAM;MACT,IAAIJ,OAAO,IAAI,IAAf,EAAqB;QACjBP,aAAa,CAACY,cAAd,CAA6BL,OAA7B;MACH;IACJ,CAJD;EAKH,CAVD,EAUG,CAACR,gBAAD,CAVH;EAYA,OAAO;IACHC,aADG;IAEHF,YAFG;IAGHe,eAAe,EAAE,MAAMR,QAAQ,CAACD;EAH7B,CAAP;AAKH;;AAAA"}
1
+ {"version":3,"names":["useSyncAnimatedValue","config","initialValue","maybeInitialValue","shouldSyncAlways","animatedValue","useRef","Animated","Value","current","indexRef","useEffect","maybeId","addListener","newValue","value","undefined","removeListener","getCurrentValue"],"sources":["useSyncAnimatedValue.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport type { SyncAnimatedValue } from '../types';\n\nexport interface SyncAnimatedValueConfig {\n initialValue: number;\n shouldSyncAlways?: boolean;\n}\n\nexport default function useSyncAnimatedValue(config: SyncAnimatedValueConfig): SyncAnimatedValue {\n const {\n initialValue: maybeInitialValue,\n shouldSyncAlways = false,\n } = config;\n\n const initialValue = maybeInitialValue ?? 0;\n const animatedValue = useRef(new Animated.Value(initialValue)).current;\n\n const indexRef = useRef<number>(initialValue);\n\n useEffect(() => {\n const maybeId = shouldSyncAlways ? animatedValue.addListener((newValue) => {\n indexRef.current = newValue.value;\n }) : undefined;\n\n return () => {\n if (maybeId != null) {\n animatedValue.removeListener(maybeId);\n }\n };\n }, [shouldSyncAlways]);\n\n return {\n animatedValue,\n initialValue,\n getCurrentValue: () => indexRef.current,\n };\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAQe,SAASA,oBAAT,CAA8BC,MAA9B,EAAkF;EAC7F,MAAM;IACFC,YAAY,EAAEC,iBADZ;IAEFC,gBAAgB,GAAG;EAFjB,IAGFH,MAHJ;EAKA,MAAMC,YAAY,GAAGC,iBAAiB,IAAI,CAA1C;EACA,MAAME,aAAa,GAAG,IAAAC,aAAA,EAAO,IAAIC,qBAAA,CAASC,KAAb,CAAmBN,YAAnB,CAAP,EAAyCO,OAA/D;EAEA,MAAMC,QAAQ,GAAG,IAAAJ,aAAA,EAAeJ,YAAf,CAAjB;EAEA,IAAAS,gBAAA,EAAU,MAAM;IACZ,MAAMC,OAAO,GAAGR,gBAAgB,GAAGC,aAAa,CAACQ,WAAd,CAA2BC,QAAD,IAAc;MACvEJ,QAAQ,CAACD,OAAT,GAAmBK,QAAQ,CAACC,KAA5B;IACH,CAFkC,CAAH,GAE3BC,SAFL;IAIA,OAAO,MAAM;MACT,IAAIJ,OAAO,IAAI,IAAf,EAAqB;QACjBP,aAAa,CAACY,cAAd,CAA6BL,OAA7B;MACH;IACJ,CAJD;EAKH,CAVD,EAUG,CAACR,gBAAD,CAVH;EAYA,OAAO;IACHC,aADG;IAEHH,YAFG;IAGHgB,eAAe,EAAE,MAAMR,QAAQ,CAACD;EAH7B,CAAP;AAKH;;AAAA"}
@@ -6,7 +6,11 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.default = void 0;
7
7
 
8
8
  class MockStore {
9
- dispatch(data) {// do nothing
9
+ dispatch(action) {// do nothing
10
+ }
11
+
12
+ getState() {
13
+ throw new Error('stub!');
10
14
  }
11
15
 
12
16
  removeAllListeners() {// do nothing
@@ -1 +1 @@
1
- {"version":3,"names":["MockStore","dispatch","data","removeAllListeners","subscribe","listener"],"sources":["MockStore.ts"],"sourcesContent":["import { MonoStore, StoreSubscription } from './types';\n\nexport default class MockStore<T> implements MonoStore<T> {\n\n dispatch(data: T): void {\n // do nothing\n }\n\n removeAllListeners(): void {\n // do nothing\n }\n\n subscribe(listener: (data: T) => void): StoreSubscription {\n return () => void 0;\n }\n\n};\n"],"mappings":";;;;;;;AAEe,MAAMA,SAAN,CAA2C;EAEtDC,QAAQ,CAACC,IAAD,EAAgB,CACpB;EACH;;EAEDC,kBAAkB,GAAS,CACvB;EACH;;EAEDC,SAAS,CAACC,QAAD,EAAiD;IACtD,OAAO,MAAM,KAAK,CAAlB;EACH;;AAZqD;;;AAczD"}
1
+ {"version":3,"names":["MockStore","dispatch","action","getState","Error","removeAllListeners","subscribe","listener"],"sources":["MockStore.ts"],"sourcesContent":["import { MonoStore, StoreSubscription, DispatchAction } from './types';\n\nexport default class MockStore<S> implements MonoStore<S> {\n\n dispatch(action: DispatchAction<S>): void {\n // do nothing\n }\n\n getState(): S {\n throw new Error('stub!');\n }\n\n removeAllListeners(): void {\n // do nothing\n }\n\n subscribe(listener: (state: S) => void): StoreSubscription {\n return () => void 0;\n }\n\n};\n"],"mappings":";;;;;;;AAEe,MAAMA,SAAN,CAA2C;EAEtDC,QAAQ,CAACC,MAAD,EAAkC,CACtC;EACH;;EAEDC,QAAQ,GAAM;IACV,MAAM,IAAIC,KAAJ,CAAU,OAAV,CAAN;EACH;;EAEDC,kBAAkB,GAAS,CACvB;EACH;;EAEDC,SAAS,CAACC,QAAD,EAAkD;IACvD,OAAO,MAAM,KAAK,CAAlB;EACH;;AAhBqD;;;AAkBzD"}
@@ -12,36 +12,42 @@ function refEqual(a, b) {
12
12
  }
13
13
 
14
14
  class SimpleStore {
15
- constructor(initialData) {
16
- _defineProperty(this, "data", void 0);
15
+ constructor(initialState) {
16
+ _defineProperty(this, "state", void 0);
17
17
 
18
18
  _defineProperty(this, "listeners", []);
19
19
 
20
- this.data = initialData;
20
+ this.state = initialState;
21
21
  }
22
22
 
23
- subscribe(listener) {
24
- this.listeners.push(listener);
25
- return () => {
26
- const index = this.listeners.indexOf(listener);
27
- this.listeners.splice(index, 1);
28
- };
29
- }
23
+ dispatch(action) {
24
+ // @ts-ignore
25
+ const nextState = typeof action === 'function' ? action(this.state) : action; // Do not dispatch if state ref is equal
30
26
 
31
- dispatch(data) {
32
- // Do not dispatch if data ref is equal
33
- if (refEqual(this.data, data)) {
27
+ if (refEqual(this.state, nextState)) {
34
28
  return;
35
29
  }
36
30
 
37
- this.data = data;
31
+ this.state = nextState;
38
32
 
39
33
  for (const id in this.listeners) {
40
34
  const listener = this.listeners[id];
41
- listener === null || listener === void 0 ? void 0 : listener(data);
35
+ listener === null || listener === void 0 ? void 0 : listener(nextState);
42
36
  }
43
37
  }
44
38
 
39
+ getState() {
40
+ return this.state;
41
+ }
42
+
43
+ subscribe(listener) {
44
+ this.listeners.push(listener);
45
+ return () => {
46
+ const index = this.listeners.indexOf(listener);
47
+ this.listeners.splice(index, 1);
48
+ };
49
+ }
50
+
45
51
  removeAllListeners() {
46
52
  this.listeners.splice(0, this.listeners.length);
47
53
  }
@@ -1 +1 @@
1
- {"version":3,"names":["refEqual","a","b","SimpleStore","constructor","initialData","data","subscribe","listener","listeners","push","index","indexOf","splice","dispatch","id","removeAllListeners","length"],"sources":["SimpleStore.ts"],"sourcesContent":["import { MonoStore, StoreSubscription } from './types';\n\nfunction refEqual(a: any, b: any): boolean {\n return a === b;\n}\n\nexport default class SimpleStore<T> implements MonoStore<T> {\n\n private data: T;\n\n private listeners: Array<(data: T) => void> = [];\n\n constructor(initialData: T) {\n this.data = initialData;\n }\n\n subscribe(listener: (data: T) => void): StoreSubscription {\n this.listeners.push(listener);\n\n return () => {\n const index = this.listeners.indexOf(listener);\n this.listeners.splice(index, 1);\n };\n }\n\n dispatch(data: T): void {\n // Do not dispatch if data ref is equal\n if (refEqual(this.data, data)) {\n return;\n }\n\n this.data = data;\n for (const id in this.listeners) {\n const listener = this.listeners[id];\n listener?.(data);\n }\n }\n\n removeAllListeners(): void {\n this.listeners.splice(0, this.listeners.length);\n }\n\n};\n"],"mappings":";;;;;;;;;AAEA,SAASA,QAAT,CAAkBC,CAAlB,EAA0BC,CAA1B,EAA2C;EACvC,OAAOD,CAAC,KAAKC,CAAb;AACH;;AAEc,MAAMC,WAAN,CAA6C;EAMxDC,WAAW,CAACC,WAAD,EAAiB;IAAA;;IAAA,mCAFkB,EAElB;;IACxB,KAAKC,IAAL,GAAYD,WAAZ;EACH;;EAEDE,SAAS,CAACC,QAAD,EAAiD;IACtD,KAAKC,SAAL,CAAeC,IAAf,CAAoBF,QAApB;IAEA,OAAO,MAAM;MACT,MAAMG,KAAK,GAAG,KAAKF,SAAL,CAAeG,OAAf,CAAuBJ,QAAvB,CAAd;MACA,KAAKC,SAAL,CAAeI,MAAf,CAAsBF,KAAtB,EAA6B,CAA7B;IACH,CAHD;EAIH;;EAEDG,QAAQ,CAACR,IAAD,EAAgB;IACpB;IACA,IAAIN,QAAQ,CAAC,KAAKM,IAAN,EAAYA,IAAZ,CAAZ,EAA+B;MAC3B;IACH;;IAED,KAAKA,IAAL,GAAYA,IAAZ;;IACA,KAAK,MAAMS,EAAX,IAAiB,KAAKN,SAAtB,EAAiC;MAC7B,MAAMD,QAAQ,GAAG,KAAKC,SAAL,CAAeM,EAAf,CAAjB;MACAP,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGF,IAAH,CAAR;IACH;EACJ;;EAEDU,kBAAkB,GAAS;IACvB,KAAKP,SAAL,CAAeI,MAAf,CAAsB,CAAtB,EAAyB,KAAKJ,SAAL,CAAeQ,MAAxC;EACH;;AAlCuD;;;AAoC3D"}
1
+ {"version":3,"names":["refEqual","a","b","SimpleStore","constructor","initialState","state","dispatch","action","nextState","id","listeners","listener","getState","subscribe","push","index","indexOf","splice","removeAllListeners","length"],"sources":["SimpleStore.ts"],"sourcesContent":["import type { DispatchAction, MonoStore, StoreSubscription } from './types';\n\nfunction refEqual(a: any, b: any): boolean {\n return a === b;\n}\n\nexport default class SimpleStore<S> implements MonoStore<S> {\n\n private state: S;\n\n private listeners: Array<(state: S) => void> = [];\n\n constructor(initialState: S) {\n this.state = initialState;\n }\n\n dispatch(action: DispatchAction<S>): void {\n // @ts-ignore\n const nextState = typeof action === 'function' ? action(this.state) : action;\n\n // Do not dispatch if state ref is equal\n if (refEqual(this.state, nextState)) {\n return;\n }\n\n this.state = nextState;\n for (const id in this.listeners) {\n const listener = this.listeners[id];\n listener?.(nextState);\n }\n }\n\n getState(): S {\n return this.state;\n }\n\n subscribe(listener: (state: S) => void): StoreSubscription {\n this.listeners.push(listener);\n\n return () => {\n const index = this.listeners.indexOf(listener);\n this.listeners.splice(index, 1);\n };\n }\n\n removeAllListeners(): void {\n this.listeners.splice(0, this.listeners.length);\n }\n\n};\n"],"mappings":";;;;;;;;;AAEA,SAASA,QAAT,CAAkBC,CAAlB,EAA0BC,CAA1B,EAA2C;EACvC,OAAOD,CAAC,KAAKC,CAAb;AACH;;AAEc,MAAMC,WAAN,CAA6C;EAMxDC,WAAW,CAACC,YAAD,EAAkB;IAAA;;IAAA,mCAFkB,EAElB;;IACzB,KAAKC,KAAL,GAAaD,YAAb;EACH;;EAEDE,QAAQ,CAACC,MAAD,EAAkC;IACtC;IACA,MAAMC,SAAS,GAAG,OAAOD,MAAP,KAAkB,UAAlB,GAA+BA,MAAM,CAAC,KAAKF,KAAN,CAArC,GAAoDE,MAAtE,CAFsC,CAItC;;IACA,IAAIR,QAAQ,CAAC,KAAKM,KAAN,EAAaG,SAAb,CAAZ,EAAqC;MACjC;IACH;;IAED,KAAKH,KAAL,GAAaG,SAAb;;IACA,KAAK,MAAMC,EAAX,IAAiB,KAAKC,SAAtB,EAAiC;MAC7B,MAAMC,QAAQ,GAAG,KAAKD,SAAL,CAAeD,EAAf,CAAjB;MACAE,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGH,SAAH,CAAR;IACH;EACJ;;EAEDI,QAAQ,GAAM;IACV,OAAO,KAAKP,KAAZ;EACH;;EAEDQ,SAAS,CAACF,QAAD,EAAkD;IACvD,KAAKD,SAAL,CAAeI,IAAf,CAAoBH,QAApB;IAEA,OAAO,MAAM;MACT,MAAMI,KAAK,GAAG,KAAKL,SAAL,CAAeM,OAAf,CAAuBL,QAAvB,CAAd;MACA,KAAKD,SAAL,CAAeO,MAAf,CAAsBF,KAAtB,EAA6B,CAA7B;IACH,CAHD;EAIH;;EAEDG,kBAAkB,GAAS;IACvB,KAAKR,SAAL,CAAeO,MAAf,CAAsB,CAAtB,EAAyB,KAAKP,SAAL,CAAeS,MAAxC;EACH;;AAzCuD;;;AA2C3D"}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as SimpleStore } from './SimpleStore';\nexport { default as MockStore } from './MockStore';\nexport type { MonoStore } from './types';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;AACA"}
1
+ {"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as SimpleStore } from './SimpleStore';\nexport { default as MockStore } from './MockStore';\nexport type { MonoStore, DispatchAction } from './types';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;AACA"}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["export interface StoreSubscription {\n (): void;\n}\n\nexport interface MonoStore<T> {\n dispatch: (data: T) => void;\n subscribe: (listener: (data: T) => void) => StoreSubscription;\n removeAllListeners: () => void;\n}\n"],"mappings":""}
1
+ {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["export interface StoreSubscription {\n (): void;\n}\n\nexport type DispatchAction<State> = State | ((prevState: State) => State);\n\nexport interface MonoStore<S> {\n dispatch: (action: DispatchAction<S>) => void;\n getState: () => S;\n subscribe: (listener: (state: S) => void) => StoreSubscription;\n removeAllListeners: () => void;\n}\n"],"mappings":""}
@@ -6,12 +6,13 @@ import useScrollViewReaction from './useScrollViewReaction';
6
6
  export default function ScrollableTabsView(props) {
7
7
  const {
8
8
  coordinates,
9
+ initialIndex,
9
10
  ...scrollViewProps
10
11
  } = props;
11
12
  const {
12
13
  scrollViewRef,
13
14
  onLayout
14
- } = useScrollViewReaction(coordinates);
15
+ } = useScrollViewReaction(initialIndex, coordinates);
15
16
  return /*#__PURE__*/React.createElement(ScrollView, _extends({
16
17
  ref: scrollViewRef,
17
18
  onLayout: onLayout
@@ -1 +1 @@
1
- {"version":3,"names":["React","ScrollView","useScrollViewReaction","ScrollableTabsView","props","coordinates","scrollViewProps","scrollViewRef","onLayout"],"sources":["ScrollableTabsView.tsx"],"sourcesContent":["import React from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport { ScrollView } from 'react-native';\nimport TabCoordinate from './TabCoordinate';\nimport useScrollViewReaction from './useScrollViewReaction';\n\nexport interface ScrollableTabsViewProps extends ScrollViewProps {\n coordinates: TabCoordinate[];\n}\n\nexport default function ScrollableTabsView(props: ScrollableTabsViewProps) {\n const {\n coordinates,\n ...scrollViewProps\n } = props;\n\n const { scrollViewRef, onLayout } = useScrollViewReaction(coordinates);\n\n return (\n <ScrollView\n ref={scrollViewRef}\n onLayout={onLayout}\n {...scrollViewProps}\n />\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,UAAT,QAA2B,cAA3B;AAEA,OAAOC,qBAAP,MAAkC,yBAAlC;AAMA,eAAe,SAASC,kBAAT,CAA4BC,KAA5B,EAA4D;EACvE,MAAM;IACFC,WADE;IAEF,GAAGC;EAFD,IAGFF,KAHJ;EAKA,MAAM;IAAEG,aAAF;IAAiBC;EAAjB,IAA8BN,qBAAqB,CAACG,WAAD,CAAzD;EAEA,oBACI,oBAAC,UAAD;IACI,GAAG,EAAEE,aADT;IAEI,QAAQ,EAAEC;EAFd,GAGQF,eAHR,EADJ;AAOH;AAAA"}
1
+ {"version":3,"names":["React","ScrollView","useScrollViewReaction","ScrollableTabsView","props","coordinates","initialIndex","scrollViewProps","scrollViewRef","onLayout"],"sources":["ScrollableTabsView.tsx"],"sourcesContent":["import React from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport { ScrollView } from 'react-native';\nimport TabCoordinate from './TabCoordinate';\nimport useScrollViewReaction from './useScrollViewReaction';\n\nexport interface ScrollableTabsViewProps extends ScrollViewProps {\n initialIndex: number;\n coordinates: TabCoordinate[];\n}\n\nexport default function ScrollableTabsView(props: ScrollableTabsViewProps) {\n const {\n coordinates,\n initialIndex,\n ...scrollViewProps\n } = props;\n\n const { scrollViewRef, onLayout } = useScrollViewReaction(initialIndex, coordinates);\n\n return (\n <ScrollView\n ref={scrollViewRef}\n onLayout={onLayout}\n {...scrollViewProps}\n />\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,UAAT,QAA2B,cAA3B;AAEA,OAAOC,qBAAP,MAAkC,yBAAlC;AAOA,eAAe,SAASC,kBAAT,CAA4BC,KAA5B,EAA4D;EACvE,MAAM;IACFC,WADE;IAEFC,YAFE;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAM;IAAEI,aAAF;IAAiBC;EAAjB,IAA8BP,qBAAqB,CAACI,YAAD,EAAeD,WAAf,CAAzD;EAEA,oBACI,oBAAC,UAAD;IACI,GAAG,EAAEG,aADT;IAEI,QAAQ,EAAEC;EAFd,GAGQF,eAHR,EADJ;AAOH;AAAA"}
@@ -118,6 +118,7 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
118
118
  coordinates: coordinates,
119
119
  directionalLockEnabled: true,
120
120
  horizontal: true,
121
+ initialIndex: realInitialIndex,
121
122
  scrollsToTop: false,
122
123
  showsHorizontalScrollIndicator: false,
123
124
  showsVerticalScrollIndicator: false,
@@ -1 +1 @@
1
- {"version":3,"names":["React","cloneElement","forwardRef","useEffect","useImperativeHandle","View","css","useTheme","useSyncAnimatedValue","TabIndicator","ScrollableTabsView","IndexAwareTab","useTabCoordinates","useIndexStore","InternalContext","isEveryTabCoordinatesDefined","useStyles","theme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","props","ref","children","initialIndex","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","style","variant","UNSTABLE_sharedIndex","fallbackSharedIndex","initialValue","sharedIndex","realInitialIndex","setTab","newIndex","animatedValue","setValue","styles","coordinates","updateCoordinate","canRenderIndicator","indexStore","subscribe","tabElements","Children","map","child","index","onLayout","event","x","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","tabElement","enableIndicator","undefined","tabIndicator"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type TabsProps from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n | 'root'\n | 'fixedRoot'\n | 'fixedTab'\n | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {},\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n scrollableContainer: {\n paddingHorizontal: theme.spacing(1),\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n initialIndex = 0,\n disableIndicator = false,\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n style,\n variant = 'primary',\n UNSTABLE_sharedIndex,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const setTab = (newIndex: number) => {\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const [coordinates, updateCoordinate] = useTabCoordinates(children);\n\n const canRenderIndicator = isEveryTabCoordinatesDefined(coordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onLayout,\n onPress,\n onMouseDown,\n variant,\n style: scrollable ? undefined : styles.fixedTab,\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n });\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n scrollable={scrollable}\n />\n ) : null;\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={styles.scrollableContainer}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n 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","View","css","useTheme","useSyncAnimatedValue","TabIndicator","ScrollableTabsView","IndexAwareTab","useTabCoordinates","useIndexStore","InternalContext","isEveryTabCoordinatesDefined","useStyles","theme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","props","ref","children","initialIndex","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","style","variant","UNSTABLE_sharedIndex","fallbackSharedIndex","initialValue","sharedIndex","realInitialIndex","setTab","newIndex","animatedValue","setValue","styles","coordinates","updateCoordinate","canRenderIndicator","indexStore","subscribe","tabElements","Children","map","child","index","onLayout","event","x","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","tabElement","enableIndicator","undefined","tabIndicator"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type TabsProps from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n | 'root'\n | 'fixedRoot'\n | 'fixedTab'\n | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {},\n fixedRoot: {\n flexDirection: 'row',\n },\n fixedTab: {\n flex: 1,\n },\n scrollableContainer: {\n paddingHorizontal: theme.spacing(1),\n },\n };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n const {\n children,\n initialIndex = 0,\n disableIndicator = false,\n keyboardDismissMode = 'none',\n keyboardShouldPersistTaps = 'never',\n onChange,\n scrollable = false,\n style,\n variant = 'primary',\n UNSTABLE_sharedIndex,\n } = props;\n\n const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n const realInitialIndex = sharedIndex.initialValue;\n\n const setTab = (newIndex: number) => {\n sharedIndex.animatedValue.setValue(newIndex);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n setTab,\n }),\n [sharedIndex],\n );\n\n const styles = useStyles();\n\n const [coordinates, updateCoordinate] = useTabCoordinates(children);\n\n const canRenderIndicator = isEveryTabCoordinatesDefined(coordinates, children);\n\n const indexStore = useIndexStore(sharedIndex);\n\n useEffect(() => {\n return indexStore.subscribe(newIndex => {\n onChange?.(newIndex);\n });\n }, [indexStore, onChange]);\n\n const tabElements = React.Children.map(children, (child, index) => {\n const onLayout = (event: LayoutChangeEvent) => {\n const { x, width } = event.nativeEvent.layout;\n\n updateCoordinate(index, x, width);\n };\n\n const onMouseDown = (e: GestureResponderEvent) => {\n if (keyboardShouldPersistTaps === 'always') {\n e.preventDefault();\n }\n };\n\n const onPress = () => {\n setTab(index);\n\n // @ts-ignore\n child.props.onPress?.();\n };\n\n // @ts-ignore\n const tabElement = cloneElement(child, {\n enableIndicator: !disableIndicator && !canRenderIndicator,\n onLayout,\n onPress,\n onMouseDown,\n variant,\n style: scrollable ? undefined : styles.fixedTab,\n });\n\n return (\n <IndexAwareTab\n children={tabElement}\n index={index}\n initialIndex={realInitialIndex}\n />\n );\n });\n\n const tabIndicator = canRenderIndicator ? (\n <TabIndicator\n coordinates={coordinates}\n disabled={disableIndicator}\n initialIndex={realInitialIndex}\n scrollable={scrollable}\n />\n ) : null;\n\n return (\n <InternalContext.Provider value={{ indexStore }}>\n <View\n style={css([\n styles.root,\n scrollable ? undefined : styles.fixedRoot,\n style,\n ])}\n >\n {scrollable ? (\n <ScrollableTabsView\n automaticallyAdjustContentInsets={false}\n bounces={false}\n contentContainerStyle={styles.scrollableContainer}\n coordinates={coordinates}\n directionalLockEnabled={true}\n horizontal={true}\n initialIndex={realInitialIndex}\n scrollsToTop={false}\n showsHorizontalScrollIndicator={false}\n showsVerticalScrollIndicator={false}\n keyboardDismissMode={keyboardDismissMode}\n keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n >\n {tabElements}\n {tabIndicator}\n </ScrollableTabsView>\n ) : (\n <React.Fragment>\n {tabElements}\n {tabIndicator}\n </React.Fragment>\n )}\n </View>\n </InternalContext.Provider>\n );\n});\n\nexport default Tabs;\n"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  import { useCallback, useContext, useEffect, useRef } from 'react';
2
2
  import InternalContext from './InternalContext';
3
- export default function useScrollViewReaction(coordinates) {
3
+ export default function useScrollViewReaction(initialIndex, coordinates) {
4
4
  const scrollViewRef = useRef(null);
5
5
  const lastScrolledXRef = useRef(NaN);
6
6
  const {
@@ -23,23 +23,31 @@ export default function useScrollViewReaction(coordinates) {
23
23
  const onLayout = useCallback(() => {
24
24
  scrollToX(lastScrolledXRef.current);
25
25
  }, []);
26
- useEffect(() => {
27
- const computeNextScrollX = index => {
28
- const prevIndex = index - 1;
29
- const prevCoordinate = coordinates[prevIndex];
26
+ const computeNextScrollX = useCallback(index => {
27
+ const prevIndex = index - 1;
28
+ const prevCoordinate = coordinates[prevIndex];
30
29
 
31
- if (prevCoordinate) {
32
- const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
33
- return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
34
- }
30
+ if (prevCoordinate) {
31
+ const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
32
+ return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
33
+ }
35
34
 
36
- return 0;
37
- };
35
+ return 0;
36
+ }, [coordinates]);
37
+ useEffect(() => {
38
+ if (Number.isNaN(lastScrolledXRef.current)) {
39
+ const x = computeNextScrollX(initialIndex);
38
40
 
41
+ if (x > 0) {
42
+ scrollToX(x);
43
+ }
44
+ }
45
+ }, [initialIndex, computeNextScrollX]);
46
+ useEffect(() => {
39
47
  return indexStore.subscribe(currentIndex => {
40
48
  scrollToX(computeNextScrollX(currentIndex));
41
49
  });
42
- }, [indexStore, coordinates]);
50
+ }, [indexStore, computeNextScrollX]);
43
51
  return {
44
52
  scrollViewRef,
45
53
  onLayout
@@ -1 +1 @@
1
- {"version":3,"names":["useCallback","useContext","useEffect","useRef","InternalContext","useScrollViewReaction","coordinates","scrollViewRef","lastScrolledXRef","NaN","indexStore","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n scrollViewRef: MutableRefObject<ScrollView | null>;\n onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n const scrollViewRef = useRef<ScrollView | null>(null);\n\n const lastScrolledXRef = useRef<number>(NaN);\n\n const { indexStore } = useContext(InternalContext);\n\n const scrollToX = (x: number) => {\n if (Number.isFinite(x)) {\n scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n lastScrolledXRef.current = x;\n }\n };\n\n const onLayout = useCallback(() => {\n scrollToX(lastScrolledXRef.current);\n }, []);\n\n useEffect(() => {\n const computeNextScrollX = (index: number) => {\n const prevIndex = index - 1;\n const prevCoordinate = coordinates[prevIndex];\n\n if (prevCoordinate) {\n const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n }\n\n return 0;\n };\n\n return indexStore.subscribe(currentIndex => {\n scrollToX(computeNextScrollX(currentIndex));\n });\n }, [indexStore, coordinates]);\n\n return { scrollViewRef, onLayout };\n};\n"],"mappings":"AACA,SAASA,WAAT,EAAsBC,UAAtB,EAAkCC,SAAlC,EAA6CC,MAA7C,QAA2D,OAA3D;AAGA,OAAOC,eAAP,MAA4B,mBAA5B;AAOA,eAAe,SAASC,qBAAT,CACXC,WADW,EAEU;EACrB,MAAMC,aAAa,GAAGJ,MAAM,CAAoB,IAApB,CAA5B;EAEA,MAAMK,gBAAgB,GAAGL,MAAM,CAASM,GAAT,CAA/B;EAEA,MAAM;IAAEC;EAAF,IAAiBT,UAAU,CAACG,eAAD,CAAjC;;EAEA,MAAMO,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAL,aAAa,CAACQ,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAV,gBAAgB,CAACO,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAGnB,WAAW,CAAC,MAAM;IAC/BW,SAAS,CAACH,gBAAgB,CAACO,OAAlB,CAAT;EACH,CAF2B,EAEzB,EAFyB,CAA5B;EAIAb,SAAS,CAAC,MAAM;IACZ,MAAMkB,kBAAkB,GAAIC,KAAD,IAAmB;MAC1C,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;MACA,MAAME,cAAc,GAAGjB,WAAW,CAACgB,SAAD,CAAlC;;MAEA,IAAIC,cAAJ,EAAoB;QAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;QACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;MACH;;MAED,OAAO,CAAP;IACH,CAVD;;IAYA,OAAOd,UAAU,CAACmB,SAAX,CAAqBC,YAAY,IAAI;MACxCnB,SAAS,CAACS,kBAAkB,CAACU,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAhBQ,EAgBN,CAACpB,UAAD,EAAaJ,WAAb,CAhBM,CAAT;EAkBA,OAAO;IAAEC,aAAF;IAAiBY;EAAjB,CAAP;AACH;AAAA"}
1
+ {"version":3,"names":["useCallback","useContext","useEffect","useRef","InternalContext","useScrollViewReaction","initialIndex","coordinates","scrollViewRef","lastScrolledXRef","NaN","indexStore","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","isNaN","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n scrollViewRef: MutableRefObject<ScrollView | null>;\n onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n initialIndex: number,\n coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n const scrollViewRef = useRef<ScrollView | null>(null);\n\n const lastScrolledXRef = useRef<number>(NaN);\n\n const { indexStore } = useContext(InternalContext);\n\n const scrollToX = (x: number) => {\n if (Number.isFinite(x)) {\n scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n lastScrolledXRef.current = x;\n }\n };\n\n const onLayout = useCallback(() => {\n scrollToX(lastScrolledXRef.current);\n }, []);\n\n const computeNextScrollX = useCallback((index: number): number => {\n const prevIndex = index - 1;\n const prevCoordinate = coordinates[prevIndex];\n\n if (prevCoordinate) {\n const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n }\n\n return 0;\n }, [coordinates]);\n\n useEffect(() => {\n if (Number.isNaN(lastScrolledXRef.current)) {\n const x = computeNextScrollX(initialIndex);\n if (x > 0) {\n scrollToX(x);\n }\n }\n }, [initialIndex, computeNextScrollX]);\n\n useEffect(() => {\n return indexStore.subscribe(currentIndex => {\n scrollToX(computeNextScrollX(currentIndex));\n });\n }, [indexStore, computeNextScrollX]);\n\n return { scrollViewRef, onLayout };\n};\n"],"mappings":"AACA,SAASA,WAAT,EAAsBC,UAAtB,EAAkCC,SAAlC,EAA6CC,MAA7C,QAA2D,OAA3D;AAGA,OAAOC,eAAP,MAA4B,mBAA5B;AAOA,eAAe,SAASC,qBAAT,CACXC,YADW,EAEXC,WAFW,EAGU;EACrB,MAAMC,aAAa,GAAGL,MAAM,CAAoB,IAApB,CAA5B;EAEA,MAAMM,gBAAgB,GAAGN,MAAM,CAASO,GAAT,CAA/B;EAEA,MAAM;IAAEC;EAAF,IAAiBV,UAAU,CAACG,eAAD,CAAjC;;EAEA,MAAMQ,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAL,aAAa,CAACQ,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAV,gBAAgB,CAACO,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAGpB,WAAW,CAAC,MAAM;IAC/BY,SAAS,CAACH,gBAAgB,CAACO,OAAlB,CAAT;EACH,CAF2B,EAEzB,EAFyB,CAA5B;EAIA,MAAMK,kBAAkB,GAAGrB,WAAW,CAAEsB,KAAD,IAA2B;IAC9D,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;IACA,MAAME,cAAc,GAAGjB,WAAW,CAACgB,SAAD,CAAlC;;IAEA,IAAIC,cAAJ,EAAoB;MAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;MACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;IACH;;IAED,OAAO,CAAP;EACH,CAVqC,EAUnC,CAAClB,WAAD,CAVmC,CAAtC;EAYAL,SAAS,CAAC,MAAM;IACZ,IAAIY,MAAM,CAACgB,KAAP,CAAarB,gBAAgB,CAACO,OAA9B,CAAJ,EAA4C;MACxC,MAAMH,CAAC,GAAGQ,kBAAkB,CAACf,YAAD,CAA5B;;MACA,IAAIO,CAAC,GAAG,CAAR,EAAW;QACPD,SAAS,CAACC,CAAD,CAAT;MACH;IACJ;EACJ,CAPQ,EAON,CAACP,YAAD,EAAee,kBAAf,CAPM,CAAT;EASAnB,SAAS,CAAC,MAAM;IACZ,OAAOS,UAAU,CAACoB,SAAX,CAAqBC,YAAY,IAAI;MACxCpB,SAAS,CAACS,kBAAkB,CAACW,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAJQ,EAIN,CAACrB,UAAD,EAAaU,kBAAb,CAJM,CAAT;EAMA,OAAO;IAAEb,aAAF;IAAiBY;EAAjB,CAAP;AACH;AAAA"}
@@ -1,4 +1,4 @@
1
- import { useRef } from 'react';
1
+ import { useCallback, useRef } from 'react';
2
2
  import { Keyboard, Platform } from 'react-native';
3
3
  import { runOnJS, useAnimatedScrollHandler, useAnimatedStyle, useDerivedValue, useSharedValue, withTiming } from 'react-native-reanimated';
4
4
  import { useSafeAreaInsets } from 'react-native-safe-area-context';
@@ -66,8 +66,7 @@ export default function useCollapsibleAppBar() {
66
66
  ]);
67
67
  const indexRef = useRef(0);
68
68
  const offsetsRef = useRef([]);
69
-
70
- const onScrollViewChanged = nextIndex => {
69
+ const onScrollViewChanged = useCallback(nextIndex => {
71
70
  const prevIndex = indexRef.current;
72
71
 
73
72
  if (prevIndex === nextIndex) {
@@ -84,8 +83,7 @@ export default function useCollapsibleAppBar() {
84
83
  if (translateY.value < 0 && savedOffsetY < appBarHeight) {
85
84
  translateY.value = withTiming(0, ANIMATION_CONFIG);
86
85
  }
87
- };
88
-
86
+ }, [appBarHeight]);
89
87
  const scrollHandler = useAnimatedScrollHandler({
90
88
  onBeginDrag: () => {
91
89
  if (keyboardDismissMode === 'on-drag') {
@@ -1 +1 @@
1
- {"version":3,"names":["useRef","Keyboard","Platform","runOnJS","useAnimatedScrollHandler","useAnimatedStyle","useDerivedValue","useSharedValue","withTiming","useSafeAreaInsets","useHeight","useElevationStyle","useAppbarStyles","defaultOptions","keyboardDismissMode","ANIMATION_CONFIG","duration","SUPPORTS_DRAG_DETECTION","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","translateY","lastTranslateY","lastOffsetY","overlapped","elevationStyle","animatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","scrollHandler","onBeginDrag","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n runOnJS,\n useAnimatedScrollHandler,\n useAnimatedStyle,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useElevationStyle from './useElevationStyle';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n top?: number;\n bottom?: number;\n left?: number;\n right?: number;\n}\n\nexport interface Options {\n keyboardDismissMode?: 'none' | 'on-drag';\n}\n\nexport interface CollapsibleAppBar {\n appBarStyle: ViewStyleProp;\n onAppBarLayout: OnLayoutCallback;\n onCollapsibleToolbarLayout: OnLayoutCallback;\n onScroll: OnScroll;\n onScrollViewChanged: (index: number) => void;\n scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n keyboardDismissMode: 'none',\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n const { keyboardDismissMode }: Required<Options> = {\n ...defaultOptions,\n ...userOptions,\n };\n\n const styles = useAppbarStyles();\n\n const safeAreaInsets = useSafeAreaInsets();\n\n const [appBarHeight, onAppBarLayout] = useHeight();\n const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n const maxTranslateY = useDerivedValue(() => -collapsibleToolbarHeight, [collapsibleToolbarHeight]);\n\n const translateY = useSharedValue<number>(0);\n const lastTranslateY = useSharedValue<number>(0);\n const lastOffsetY = useSharedValue<number>(0);\n const overlapped = useSharedValue<boolean>(false);\n\n const elevationStyle = useElevationStyle(4);\n const animatedStyle = useAnimatedStyle(() => {\n const transform = [{ translateY: translateY.value }];\n\n if (Platform.OS === 'web') {\n return {\n transform,\n boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n };\n }\n if (Platform.OS === 'android') {\n return {\n transform,\n elevation: overlapped.value ? elevationStyle?.elevation : 0,\n };\n }\n if (Platform.OS === 'ios') {\n return {\n transform,\n shadowColor: elevationStyle?.shadowColor,\n shadowOffset: elevationStyle?.shadowOffset,\n shadowRadius: elevationStyle?.shadowRadius,\n shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n };\n }\n return {};\n }, [\n /**\n * FIXME: Consider add `elevationStyle` to dependencies.\n */\n ]);\n\n const indexRef = useRef<number>(0);\n const offsetsRef = useRef<Array<number>>([]);\n\n const onScrollViewChanged = (nextIndex: number) => {\n const prevIndex = indexRef.current;\n if (prevIndex === nextIndex) {\n return;\n }\n\n offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n lastOffsetY.value = savedOffsetY;\n\n indexRef.current = nextIndex;\n\n // Determine whether to overlap every time index is changed.\n overlapped.value = savedOffsetY > 0;\n\n // If next ScrollView's offset is too short, expand app bar.\n if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n };\n\n const scrollHandler = useAnimatedScrollHandler({\n onBeginDrag: () => {\n if (keyboardDismissMode === 'on-drag') {\n runOnJS(Keyboard.dismiss)();\n }\n lastTranslateY.value = translateY.value;\n },\n onMomentumBegin: () => {\n lastTranslateY.value = translateY.value;\n },\n onScroll: (event) => {\n const offsetY = event.contentOffset.y;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n if (SUPPORTS_DRAG_DETECTION) {\n const dy = offsetY - lastOffsetY.value;\n\n translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n overlapped.value = offsetY + translateY.value > 0;\n } else {\n if (offsetY > -maxTy) {\n if (ty === 0) {\n translateY.value = withTiming(Math.min(Math.max(-offsetY, maxTy), 0), ANIMATION_CONFIG);\n }\n } else {\n if (ty === maxTy) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n }\n\n overlapped.value = offsetY > 0;\n\n lastOffsetY.value = offsetY;\n }\n },\n onEndDrag: (event) => {\n lastOffsetY.value = event.contentOffset.y;\n },\n onMomentumEnd: (event) => {\n const offsetY = event.contentOffset.y;\n\n lastOffsetY.value = offsetY;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n // If toolbar is already positioned on edge, do nothing.\n if (ty <= maxTy || ty >= 0) {\n return;\n }\n\n const threshold = maxTy * 0.5;\n\n const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n overlapped.value = offsetY + nextTranslateY > 0;\n\n translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n },\n }, [keyboardDismissMode, appBarHeight]);\n\n const hasCollapsible = collapsibleToolbarHeight > 0;\n\n const appBarStyle = [\n animatedStyle,\n { paddingTop: safeAreaInsets.top },\n hasCollapsible ? styles.floating : undefined,\n ];\n\n return {\n appBarStyle,\n onAppBarLayout,\n onCollapsibleToolbarLayout,\n onScroll: scrollHandler,\n onScrollViewChanged,\n scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n };\n};\n"],"mappings":"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"}
1
+ {"version":3,"names":["useCallback","useRef","Keyboard","Platform","runOnJS","useAnimatedScrollHandler","useAnimatedStyle","useDerivedValue","useSharedValue","withTiming","useSafeAreaInsets","useHeight","useElevationStyle","useAppbarStyles","defaultOptions","keyboardDismissMode","ANIMATION_CONFIG","duration","SUPPORTS_DRAG_DETECTION","OS","useCollapsibleAppBar","userOptions","styles","safeAreaInsets","appBarHeight","onAppBarLayout","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","translateY","lastTranslateY","lastOffsetY","overlapped","elevationStyle","animatedStyle","transform","value","boxShadow","elevation","shadowColor","shadowOffset","shadowRadius","shadowOpacity","indexRef","offsetsRef","onScrollViewChanged","nextIndex","prevIndex","current","savedOffsetY","scrollHandler","onBeginDrag","dismiss","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","ty","maxTy","dy","Math","min","max","onEndDrag","onMomentumEnd","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n runOnJS,\n useAnimatedScrollHandler,\n useAnimatedStyle,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useHeight } from '../internal/hooks';\nimport useElevationStyle from './useElevationStyle';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n top?: number;\n bottom?: number;\n left?: number;\n right?: number;\n}\n\nexport interface Options {\n keyboardDismissMode?: 'none' | 'on-drag';\n}\n\nexport interface CollapsibleAppBar {\n appBarStyle: ViewStyleProp;\n onAppBarLayout: OnLayoutCallback;\n onCollapsibleToolbarLayout: OnLayoutCallback;\n onScroll: OnScroll;\n onScrollViewChanged: (index: number) => void;\n scrollContentInsets: ContentInsets;\n}\n\nconst defaultOptions: Required<Options> = {\n keyboardDismissMode: 'none',\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n const { keyboardDismissMode }: Required<Options> = {\n ...defaultOptions,\n ...userOptions,\n };\n\n const styles = useAppbarStyles();\n\n const safeAreaInsets = useSafeAreaInsets();\n\n const [appBarHeight, onAppBarLayout] = useHeight();\n const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n const maxTranslateY = useDerivedValue(() => -collapsibleToolbarHeight, [collapsibleToolbarHeight]);\n\n const translateY = useSharedValue<number>(0);\n const lastTranslateY = useSharedValue<number>(0);\n const lastOffsetY = useSharedValue<number>(0);\n const overlapped = useSharedValue<boolean>(false);\n\n const elevationStyle = useElevationStyle(4);\n const animatedStyle = useAnimatedStyle(() => {\n const transform = [{ translateY: translateY.value }];\n\n if (Platform.OS === 'web') {\n return {\n transform,\n boxShadow: overlapped.value ? elevationStyle?.boxShadow : 0,\n };\n }\n if (Platform.OS === 'android') {\n return {\n transform,\n elevation: overlapped.value ? elevationStyle?.elevation : 0,\n };\n }\n if (Platform.OS === 'ios') {\n return {\n transform,\n shadowColor: elevationStyle?.shadowColor,\n shadowOffset: elevationStyle?.shadowOffset,\n shadowRadius: elevationStyle?.shadowRadius,\n shadowOpacity: overlapped.value ? elevationStyle?.shadowOpacity : 0,\n };\n }\n return {};\n }, [\n /**\n * FIXME: Consider add `elevationStyle` to dependencies.\n */\n ]);\n\n const indexRef = useRef<number>(0);\n const offsetsRef = useRef<Array<number>>([]);\n\n const onScrollViewChanged = useCallback((nextIndex: number) => {\n const prevIndex = indexRef.current;\n if (prevIndex === nextIndex) {\n return;\n }\n\n offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n lastOffsetY.value = savedOffsetY;\n\n indexRef.current = nextIndex;\n\n // Determine whether to overlap every time index is changed.\n overlapped.value = savedOffsetY > 0;\n\n // If next ScrollView's offset is too short, expand app bar.\n if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n }, [appBarHeight]);\n\n const scrollHandler = useAnimatedScrollHandler({\n onBeginDrag: () => {\n if (keyboardDismissMode === 'on-drag') {\n runOnJS(Keyboard.dismiss)();\n }\n lastTranslateY.value = translateY.value;\n },\n onMomentumBegin: () => {\n lastTranslateY.value = translateY.value;\n },\n onScroll: (event) => {\n const offsetY = event.contentOffset.y;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n if (SUPPORTS_DRAG_DETECTION) {\n const dy = offsetY - lastOffsetY.value;\n\n translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n overlapped.value = offsetY + translateY.value > 0;\n } else {\n if (offsetY > -maxTy) {\n if (ty === 0) {\n translateY.value = withTiming(Math.min(Math.max(-offsetY, maxTy), 0), ANIMATION_CONFIG);\n }\n } else {\n if (ty === maxTy) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n }\n\n overlapped.value = offsetY > 0;\n\n lastOffsetY.value = offsetY;\n }\n },\n onEndDrag: (event) => {\n lastOffsetY.value = event.contentOffset.y;\n },\n onMomentumEnd: (event) => {\n const offsetY = event.contentOffset.y;\n\n lastOffsetY.value = offsetY;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n // If toolbar is already positioned on edge, do nothing.\n if (ty <= maxTy || ty >= 0) {\n return;\n }\n\n const threshold = maxTy * 0.5;\n\n const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n overlapped.value = offsetY + nextTranslateY > 0;\n\n translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n },\n }, [keyboardDismissMode, appBarHeight]);\n\n const hasCollapsible = collapsibleToolbarHeight > 0;\n\n const appBarStyle = [\n animatedStyle,\n { paddingTop: safeAreaInsets.top },\n hasCollapsible ? styles.floating : undefined,\n ];\n\n return {\n appBarStyle,\n onAppBarLayout,\n onCollapsibleToolbarLayout,\n onScroll: scrollHandler,\n onScrollViewChanged,\n scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n };\n};\n"],"mappings":"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"}
@@ -2,9 +2,10 @@ import { useEffect, useRef } from 'react';
2
2
  import { Animated } from 'react-native';
3
3
  export default function useSyncAnimatedValue(config) {
4
4
  const {
5
- initialValue,
5
+ initialValue: maybeInitialValue,
6
6
  shouldSyncAlways = false
7
7
  } = config;
8
+ const initialValue = maybeInitialValue ?? 0;
8
9
  const animatedValue = useRef(new Animated.Value(initialValue)).current;
9
10
  const indexRef = useRef(initialValue);
10
11
  useEffect(() => {
@@ -1 +1 @@
1
- {"version":3,"names":["useEffect","useRef","Animated","useSyncAnimatedValue","config","initialValue","shouldSyncAlways","animatedValue","Value","current","indexRef","maybeId","addListener","newValue","value","undefined","removeListener","getCurrentValue"],"sources":["useSyncAnimatedValue.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport type { SyncAnimatedValue } from '../types';\n\nexport interface SyncAnimatedValueConfig {\n initialValue: number;\n shouldSyncAlways?: boolean;\n}\n\nexport default function useSyncAnimatedValue(config: SyncAnimatedValueConfig): SyncAnimatedValue {\n const {\n initialValue,\n shouldSyncAlways = false,\n } = config;\n\n const animatedValue = useRef(new Animated.Value(initialValue)).current;\n\n const indexRef = useRef<number>(initialValue);\n\n useEffect(() => {\n const maybeId = shouldSyncAlways ? animatedValue.addListener((newValue) => {\n indexRef.current = newValue.value;\n }) : undefined;\n\n return () => {\n if (maybeId != null) {\n animatedValue.removeListener(maybeId);\n }\n };\n }, [shouldSyncAlways]);\n\n return {\n animatedValue,\n initialValue,\n getCurrentValue: () => indexRef.current,\n };\n};\n"],"mappings":"AAAA,SAASA,SAAT,EAAoBC,MAApB,QAAkC,OAAlC;AACA,SAASC,QAAT,QAAyB,cAAzB;AAQA,eAAe,SAASC,oBAAT,CAA8BC,MAA9B,EAAkF;EAC7F,MAAM;IACFC,YADE;IAEFC,gBAAgB,GAAG;EAFjB,IAGFF,MAHJ;EAKA,MAAMG,aAAa,GAAGN,MAAM,CAAC,IAAIC,QAAQ,CAACM,KAAb,CAAmBH,YAAnB,CAAD,CAAN,CAAyCI,OAA/D;EAEA,MAAMC,QAAQ,GAAGT,MAAM,CAASI,YAAT,CAAvB;EAEAL,SAAS,CAAC,MAAM;IACZ,MAAMW,OAAO,GAAGL,gBAAgB,GAAGC,aAAa,CAACK,WAAd,CAA2BC,QAAD,IAAc;MACvEH,QAAQ,CAACD,OAAT,GAAmBI,QAAQ,CAACC,KAA5B;IACH,CAFkC,CAAH,GAE3BC,SAFL;IAIA,OAAO,MAAM;MACT,IAAIJ,OAAO,IAAI,IAAf,EAAqB;QACjBJ,aAAa,CAACS,cAAd,CAA6BL,OAA7B;MACH;IACJ,CAJD;EAKH,CAVQ,EAUN,CAACL,gBAAD,CAVM,CAAT;EAYA,OAAO;IACHC,aADG;IAEHF,YAFG;IAGHY,eAAe,EAAE,MAAMP,QAAQ,CAACD;EAH7B,CAAP;AAKH;AAAA"}
1
+ {"version":3,"names":["useEffect","useRef","Animated","useSyncAnimatedValue","config","initialValue","maybeInitialValue","shouldSyncAlways","animatedValue","Value","current","indexRef","maybeId","addListener","newValue","value","undefined","removeListener","getCurrentValue"],"sources":["useSyncAnimatedValue.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport type { SyncAnimatedValue } from '../types';\n\nexport interface SyncAnimatedValueConfig {\n initialValue: number;\n shouldSyncAlways?: boolean;\n}\n\nexport default function useSyncAnimatedValue(config: SyncAnimatedValueConfig): SyncAnimatedValue {\n const {\n initialValue: maybeInitialValue,\n shouldSyncAlways = false,\n } = config;\n\n const initialValue = maybeInitialValue ?? 0;\n const animatedValue = useRef(new Animated.Value(initialValue)).current;\n\n const indexRef = useRef<number>(initialValue);\n\n useEffect(() => {\n const maybeId = shouldSyncAlways ? animatedValue.addListener((newValue) => {\n indexRef.current = newValue.value;\n }) : undefined;\n\n return () => {\n if (maybeId != null) {\n animatedValue.removeListener(maybeId);\n }\n };\n }, [shouldSyncAlways]);\n\n return {\n animatedValue,\n initialValue,\n getCurrentValue: () => indexRef.current,\n };\n};\n"],"mappings":"AAAA,SAASA,SAAT,EAAoBC,MAApB,QAAkC,OAAlC;AACA,SAASC,QAAT,QAAyB,cAAzB;AAQA,eAAe,SAASC,oBAAT,CAA8BC,MAA9B,EAAkF;EAC7F,MAAM;IACFC,YAAY,EAAEC,iBADZ;IAEFC,gBAAgB,GAAG;EAFjB,IAGFH,MAHJ;EAKA,MAAMC,YAAY,GAAGC,iBAAiB,IAAI,CAA1C;EACA,MAAME,aAAa,GAAGP,MAAM,CAAC,IAAIC,QAAQ,CAACO,KAAb,CAAmBJ,YAAnB,CAAD,CAAN,CAAyCK,OAA/D;EAEA,MAAMC,QAAQ,GAAGV,MAAM,CAASI,YAAT,CAAvB;EAEAL,SAAS,CAAC,MAAM;IACZ,MAAMY,OAAO,GAAGL,gBAAgB,GAAGC,aAAa,CAACK,WAAd,CAA2BC,QAAD,IAAc;MACvEH,QAAQ,CAACD,OAAT,GAAmBI,QAAQ,CAACC,KAA5B;IACH,CAFkC,CAAH,GAE3BC,SAFL;IAIA,OAAO,MAAM;MACT,IAAIJ,OAAO,IAAI,IAAf,EAAqB;QACjBJ,aAAa,CAACS,cAAd,CAA6BL,OAA7B;MACH;IACJ,CAJD;EAKH,CAVQ,EAUN,CAACL,gBAAD,CAVM,CAAT;EAYA,OAAO;IACHC,aADG;IAEHH,YAFG;IAGHa,eAAe,EAAE,MAAMP,QAAQ,CAACD;EAH7B,CAAP;AAKH;AAAA"}
@@ -1,5 +1,9 @@
1
1
  export default class MockStore {
2
- dispatch(data) {// do nothing
2
+ dispatch(action) {// do nothing
3
+ }
4
+
5
+ getState() {
6
+ throw new Error('stub!');
3
7
  }
4
8
 
5
9
  removeAllListeners() {// do nothing
@@ -1 +1 @@
1
- {"version":3,"names":["MockStore","dispatch","data","removeAllListeners","subscribe","listener"],"sources":["MockStore.ts"],"sourcesContent":["import { MonoStore, StoreSubscription } from './types';\n\nexport default class MockStore<T> implements MonoStore<T> {\n\n dispatch(data: T): void {\n // do nothing\n }\n\n removeAllListeners(): void {\n // do nothing\n }\n\n subscribe(listener: (data: T) => void): StoreSubscription {\n return () => void 0;\n }\n\n};\n"],"mappings":"AAEA,eAAe,MAAMA,SAAN,CAA2C;EAEtDC,QAAQ,CAACC,IAAD,EAAgB,CACpB;EACH;;EAEDC,kBAAkB,GAAS,CACvB;EACH;;EAEDC,SAAS,CAACC,QAAD,EAAiD;IACtD,OAAO,MAAM,KAAK,CAAlB;EACH;;AAZqD;AAczD"}
1
+ {"version":3,"names":["MockStore","dispatch","action","getState","Error","removeAllListeners","subscribe","listener"],"sources":["MockStore.ts"],"sourcesContent":["import { MonoStore, StoreSubscription, DispatchAction } from './types';\n\nexport default class MockStore<S> implements MonoStore<S> {\n\n dispatch(action: DispatchAction<S>): void {\n // do nothing\n }\n\n getState(): S {\n throw new Error('stub!');\n }\n\n removeAllListeners(): void {\n // do nothing\n }\n\n subscribe(listener: (state: S) => void): StoreSubscription {\n return () => void 0;\n }\n\n};\n"],"mappings":"AAEA,eAAe,MAAMA,SAAN,CAA2C;EAEtDC,QAAQ,CAACC,MAAD,EAAkC,CACtC;EACH;;EAEDC,QAAQ,GAAM;IACV,MAAM,IAAIC,KAAJ,CAAU,OAAV,CAAN;EACH;;EAEDC,kBAAkB,GAAS,CACvB;EACH;;EAEDC,SAAS,CAACC,QAAD,EAAkD;IACvD,OAAO,MAAM,KAAK,CAAlB;EACH;;AAhBqD;AAkBzD"}
@@ -5,36 +5,42 @@ function refEqual(a, b) {
5
5
  }
6
6
 
7
7
  export default class SimpleStore {
8
- constructor(initialData) {
9
- _defineProperty(this, "data", void 0);
8
+ constructor(initialState) {
9
+ _defineProperty(this, "state", void 0);
10
10
 
11
11
  _defineProperty(this, "listeners", []);
12
12
 
13
- this.data = initialData;
13
+ this.state = initialState;
14
14
  }
15
15
 
16
- subscribe(listener) {
17
- this.listeners.push(listener);
18
- return () => {
19
- const index = this.listeners.indexOf(listener);
20
- this.listeners.splice(index, 1);
21
- };
22
- }
16
+ dispatch(action) {
17
+ // @ts-ignore
18
+ const nextState = typeof action === 'function' ? action(this.state) : action; // Do not dispatch if state ref is equal
23
19
 
24
- dispatch(data) {
25
- // Do not dispatch if data ref is equal
26
- if (refEqual(this.data, data)) {
20
+ if (refEqual(this.state, nextState)) {
27
21
  return;
28
22
  }
29
23
 
30
- this.data = data;
24
+ this.state = nextState;
31
25
 
32
26
  for (const id in this.listeners) {
33
27
  const listener = this.listeners[id];
34
- listener === null || listener === void 0 ? void 0 : listener(data);
28
+ listener === null || listener === void 0 ? void 0 : listener(nextState);
35
29
  }
36
30
  }
37
31
 
32
+ getState() {
33
+ return this.state;
34
+ }
35
+
36
+ subscribe(listener) {
37
+ this.listeners.push(listener);
38
+ return () => {
39
+ const index = this.listeners.indexOf(listener);
40
+ this.listeners.splice(index, 1);
41
+ };
42
+ }
43
+
38
44
  removeAllListeners() {
39
45
  this.listeners.splice(0, this.listeners.length);
40
46
  }
@@ -1 +1 @@
1
- {"version":3,"names":["refEqual","a","b","SimpleStore","constructor","initialData","data","subscribe","listener","listeners","push","index","indexOf","splice","dispatch","id","removeAllListeners","length"],"sources":["SimpleStore.ts"],"sourcesContent":["import { MonoStore, StoreSubscription } from './types';\n\nfunction refEqual(a: any, b: any): boolean {\n return a === b;\n}\n\nexport default class SimpleStore<T> implements MonoStore<T> {\n\n private data: T;\n\n private listeners: Array<(data: T) => void> = [];\n\n constructor(initialData: T) {\n this.data = initialData;\n }\n\n subscribe(listener: (data: T) => void): StoreSubscription {\n this.listeners.push(listener);\n\n return () => {\n const index = this.listeners.indexOf(listener);\n this.listeners.splice(index, 1);\n };\n }\n\n dispatch(data: T): void {\n // Do not dispatch if data ref is equal\n if (refEqual(this.data, data)) {\n return;\n }\n\n this.data = data;\n for (const id in this.listeners) {\n const listener = this.listeners[id];\n listener?.(data);\n }\n }\n\n removeAllListeners(): void {\n this.listeners.splice(0, this.listeners.length);\n }\n\n};\n"],"mappings":";;AAEA,SAASA,QAAT,CAAkBC,CAAlB,EAA0BC,CAA1B,EAA2C;EACvC,OAAOD,CAAC,KAAKC,CAAb;AACH;;AAED,eAAe,MAAMC,WAAN,CAA6C;EAMxDC,WAAW,CAACC,WAAD,EAAiB;IAAA;;IAAA,mCAFkB,EAElB;;IACxB,KAAKC,IAAL,GAAYD,WAAZ;EACH;;EAEDE,SAAS,CAACC,QAAD,EAAiD;IACtD,KAAKC,SAAL,CAAeC,IAAf,CAAoBF,QAApB;IAEA,OAAO,MAAM;MACT,MAAMG,KAAK,GAAG,KAAKF,SAAL,CAAeG,OAAf,CAAuBJ,QAAvB,CAAd;MACA,KAAKC,SAAL,CAAeI,MAAf,CAAsBF,KAAtB,EAA6B,CAA7B;IACH,CAHD;EAIH;;EAEDG,QAAQ,CAACR,IAAD,EAAgB;IACpB;IACA,IAAIN,QAAQ,CAAC,KAAKM,IAAN,EAAYA,IAAZ,CAAZ,EAA+B;MAC3B;IACH;;IAED,KAAKA,IAAL,GAAYA,IAAZ;;IACA,KAAK,MAAMS,EAAX,IAAiB,KAAKN,SAAtB,EAAiC;MAC7B,MAAMD,QAAQ,GAAG,KAAKC,SAAL,CAAeM,EAAf,CAAjB;MACAP,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGF,IAAH,CAAR;IACH;EACJ;;EAEDU,kBAAkB,GAAS;IACvB,KAAKP,SAAL,CAAeI,MAAf,CAAsB,CAAtB,EAAyB,KAAKJ,SAAL,CAAeQ,MAAxC;EACH;;AAlCuD;AAoC3D"}
1
+ {"version":3,"names":["refEqual","a","b","SimpleStore","constructor","initialState","state","dispatch","action","nextState","id","listeners","listener","getState","subscribe","push","index","indexOf","splice","removeAllListeners","length"],"sources":["SimpleStore.ts"],"sourcesContent":["import type { DispatchAction, MonoStore, StoreSubscription } from './types';\n\nfunction refEqual(a: any, b: any): boolean {\n return a === b;\n}\n\nexport default class SimpleStore<S> implements MonoStore<S> {\n\n private state: S;\n\n private listeners: Array<(state: S) => void> = [];\n\n constructor(initialState: S) {\n this.state = initialState;\n }\n\n dispatch(action: DispatchAction<S>): void {\n // @ts-ignore\n const nextState = typeof action === 'function' ? action(this.state) : action;\n\n // Do not dispatch if state ref is equal\n if (refEqual(this.state, nextState)) {\n return;\n }\n\n this.state = nextState;\n for (const id in this.listeners) {\n const listener = this.listeners[id];\n listener?.(nextState);\n }\n }\n\n getState(): S {\n return this.state;\n }\n\n subscribe(listener: (state: S) => void): StoreSubscription {\n this.listeners.push(listener);\n\n return () => {\n const index = this.listeners.indexOf(listener);\n this.listeners.splice(index, 1);\n };\n }\n\n removeAllListeners(): void {\n this.listeners.splice(0, this.listeners.length);\n }\n\n};\n"],"mappings":";;AAEA,SAASA,QAAT,CAAkBC,CAAlB,EAA0BC,CAA1B,EAA2C;EACvC,OAAOD,CAAC,KAAKC,CAAb;AACH;;AAED,eAAe,MAAMC,WAAN,CAA6C;EAMxDC,WAAW,CAACC,YAAD,EAAkB;IAAA;;IAAA,mCAFkB,EAElB;;IACzB,KAAKC,KAAL,GAAaD,YAAb;EACH;;EAEDE,QAAQ,CAACC,MAAD,EAAkC;IACtC;IACA,MAAMC,SAAS,GAAG,OAAOD,MAAP,KAAkB,UAAlB,GAA+BA,MAAM,CAAC,KAAKF,KAAN,CAArC,GAAoDE,MAAtE,CAFsC,CAItC;;IACA,IAAIR,QAAQ,CAAC,KAAKM,KAAN,EAAaG,SAAb,CAAZ,EAAqC;MACjC;IACH;;IAED,KAAKH,KAAL,GAAaG,SAAb;;IACA,KAAK,MAAMC,EAAX,IAAiB,KAAKC,SAAtB,EAAiC;MAC7B,MAAMC,QAAQ,GAAG,KAAKD,SAAL,CAAeD,EAAf,CAAjB;MACAE,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGH,SAAH,CAAR;IACH;EACJ;;EAEDI,QAAQ,GAAM;IACV,OAAO,KAAKP,KAAZ;EACH;;EAEDQ,SAAS,CAACF,QAAD,EAAkD;IACvD,KAAKD,SAAL,CAAeI,IAAf,CAAoBH,QAApB;IAEA,OAAO,MAAM;MACT,MAAMI,KAAK,GAAG,KAAKL,SAAL,CAAeM,OAAf,CAAuBL,QAAvB,CAAd;MACA,KAAKD,SAAL,CAAeO,MAAf,CAAsBF,KAAtB,EAA6B,CAA7B;IACH,CAHD;EAIH;;EAEDG,kBAAkB,GAAS;IACvB,KAAKR,SAAL,CAAeO,MAAf,CAAsB,CAAtB,EAAyB,KAAKP,SAAL,CAAeS,MAAxC;EACH;;AAzCuD;AA2C3D"}
@@ -1 +1 @@
1
- {"version":3,"names":["default","SimpleStore","MockStore"],"sources":["index.ts"],"sourcesContent":["export { default as SimpleStore } from './SimpleStore';\nexport { default as MockStore } from './MockStore';\nexport type { MonoStore } from './types';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,WAApB,QAAuC,eAAvC;AACA,SAASD,OAAO,IAAIE,SAApB,QAAqC,aAArC"}
1
+ {"version":3,"names":["default","SimpleStore","MockStore"],"sources":["index.ts"],"sourcesContent":["export { default as SimpleStore } from './SimpleStore';\nexport { default as MockStore } from './MockStore';\nexport type { MonoStore, DispatchAction } from './types';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,WAApB,QAAuC,eAAvC;AACA,SAASD,OAAO,IAAIE,SAApB,QAAqC,aAArC"}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["export interface StoreSubscription {\n (): void;\n}\n\nexport interface MonoStore<T> {\n dispatch: (data: T) => void;\n subscribe: (listener: (data: T) => void) => StoreSubscription;\n removeAllListeners: () => void;\n}\n"],"mappings":""}
1
+ {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["export interface StoreSubscription {\n (): void;\n}\n\nexport type DispatchAction<State> = State | ((prevState: State) => State);\n\nexport interface MonoStore<S> {\n dispatch: (action: DispatchAction<S>) => void;\n getState: () => S;\n subscribe: (listener: (state: S) => void) => StoreSubscription;\n removeAllListeners: () => void;\n}\n"],"mappings":""}
@@ -1,6 +1,7 @@
1
1
  import type { ScrollViewProps } from 'react-native';
2
2
  import TabCoordinate from './TabCoordinate';
3
3
  export interface ScrollableTabsViewProps extends ScrollViewProps {
4
+ initialIndex: number;
4
5
  coordinates: TabCoordinate[];
5
6
  }
6
7
  export default function ScrollableTabsView(props: ScrollableTabsViewProps): JSX.Element;
@@ -5,4 +5,4 @@ export interface UseScrollViewReaction {
5
5
  scrollViewRef: MutableRefObject<ScrollView | null>;
6
6
  onLayout: ViewProps['onLayout'];
7
7
  }
8
- export default function useScrollViewReaction(coordinates: TabCoordinate[]): UseScrollViewReaction;
8
+ export default function useScrollViewReaction(initialIndex: number, coordinates: TabCoordinate[]): UseScrollViewReaction;
@@ -1,6 +1,7 @@
1
- import { MonoStore, StoreSubscription } from './types';
2
- export default class MockStore<T> implements MonoStore<T> {
3
- dispatch(data: T): void;
1
+ import { MonoStore, StoreSubscription, DispatchAction } from './types';
2
+ export default class MockStore<S> implements MonoStore<S> {
3
+ dispatch(action: DispatchAction<S>): void;
4
+ getState(): S;
4
5
  removeAllListeners(): void;
5
- subscribe(listener: (data: T) => void): StoreSubscription;
6
+ subscribe(listener: (state: S) => void): StoreSubscription;
6
7
  }
@@ -1,9 +1,10 @@
1
- import { MonoStore, StoreSubscription } from './types';
2
- export default class SimpleStore<T> implements MonoStore<T> {
3
- private data;
1
+ import type { DispatchAction, MonoStore, StoreSubscription } from './types';
2
+ export default class SimpleStore<S> implements MonoStore<S> {
3
+ private state;
4
4
  private listeners;
5
- constructor(initialData: T);
6
- subscribe(listener: (data: T) => void): StoreSubscription;
7
- dispatch(data: T): void;
5
+ constructor(initialState: S);
6
+ dispatch(action: DispatchAction<S>): void;
7
+ getState(): S;
8
+ subscribe(listener: (state: S) => void): StoreSubscription;
8
9
  removeAllListeners(): void;
9
10
  }
@@ -1,3 +1,3 @@
1
1
  export { default as SimpleStore } from './SimpleStore';
2
2
  export { default as MockStore } from './MockStore';
3
- export type { MonoStore } from './types';
3
+ export type { MonoStore, DispatchAction } from './types';
@@ -1,8 +1,10 @@
1
1
  export interface StoreSubscription {
2
2
  (): void;
3
3
  }
4
- export interface MonoStore<T> {
5
- dispatch: (data: T) => void;
6
- subscribe: (listener: (data: T) => void) => StoreSubscription;
4
+ export declare type DispatchAction<State> = State | ((prevState: State) => State);
5
+ export interface MonoStore<S> {
6
+ dispatch: (action: DispatchAction<S>) => void;
7
+ getState: () => S;
8
+ subscribe: (listener: (state: S) => void) => StoreSubscription;
7
9
  removeAllListeners: () => void;
8
10
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fountain-ui/core",
3
- "version": "2.0.0-beta.21",
3
+ "version": "2.0.0-beta.24",
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": "d18fb7ba86bc8aa042122e5321b9c26381bd5d5f"
70
+ "gitHead": "fecf3188c95df22fd559194feb24b8662872852b"
71
71
  }
@@ -5,16 +5,18 @@ import TabCoordinate from './TabCoordinate';
5
5
  import useScrollViewReaction from './useScrollViewReaction';
6
6
 
7
7
  export interface ScrollableTabsViewProps extends ScrollViewProps {
8
+ initialIndex: number;
8
9
  coordinates: TabCoordinate[];
9
10
  }
10
11
 
11
12
  export default function ScrollableTabsView(props: ScrollableTabsViewProps) {
12
13
  const {
13
14
  coordinates,
15
+ initialIndex,
14
16
  ...scrollViewProps
15
17
  } = props;
16
18
 
17
- const { scrollViewRef, onLayout } = useScrollViewReaction(coordinates);
19
+ const { scrollViewRef, onLayout } = useScrollViewReaction(initialIndex, coordinates);
18
20
 
19
21
  return (
20
22
  <ScrollView
package/src/Tabs/Tabs.tsx CHANGED
@@ -148,6 +148,7 @@ const Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {
148
148
  coordinates={coordinates}
149
149
  directionalLockEnabled={true}
150
150
  horizontal={true}
151
+ initialIndex={realInitialIndex}
151
152
  scrollsToTop={false}
152
153
  showsHorizontalScrollIndicator={false}
153
154
  showsVerticalScrollIndicator={false}
@@ -10,6 +10,7 @@ export interface UseScrollViewReaction {
10
10
  }
11
11
 
12
12
  export default function useScrollViewReaction(
13
+ initialIndex: number,
13
14
  coordinates: TabCoordinate[],
14
15
  ): UseScrollViewReaction {
15
16
  const scrollViewRef = useRef<ScrollView | null>(null);
@@ -30,23 +31,32 @@ export default function useScrollViewReaction(
30
31
  scrollToX(lastScrolledXRef.current);
31
32
  }, []);
32
33
 
33
- useEffect(() => {
34
- const computeNextScrollX = (index: number) => {
35
- const prevIndex = index - 1;
36
- const prevCoordinate = coordinates[prevIndex];
34
+ const computeNextScrollX = useCallback((index: number): number => {
35
+ const prevIndex = index - 1;
36
+ const prevCoordinate = coordinates[prevIndex];
37
37
 
38
- if (prevCoordinate) {
39
- const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
40
- return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
41
- }
38
+ if (prevCoordinate) {
39
+ const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
40
+ return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
41
+ }
42
+
43
+ return 0;
44
+ }, [coordinates]);
42
45
 
43
- return 0;
44
- };
46
+ useEffect(() => {
47
+ if (Number.isNaN(lastScrolledXRef.current)) {
48
+ const x = computeNextScrollX(initialIndex);
49
+ if (x > 0) {
50
+ scrollToX(x);
51
+ }
52
+ }
53
+ }, [initialIndex, computeNextScrollX]);
45
54
 
55
+ useEffect(() => {
46
56
  return indexStore.subscribe(currentIndex => {
47
57
  scrollToX(computeNextScrollX(currentIndex));
48
58
  });
49
- }, [indexStore, coordinates]);
59
+ }, [indexStore, computeNextScrollX]);
50
60
 
51
61
  return { scrollViewRef, onLayout };
52
62
  };
@@ -1,4 +1,4 @@
1
- import { useRef } from 'react';
1
+ import { useCallback, useRef } from 'react';
2
2
  import { Falsy, Keyboard, Platform, RegisteredStyle, ScrollViewProps, ViewProps, ViewStyle } from 'react-native';
3
3
  import type { WithTimingConfig } from 'react-native-reanimated';
4
4
  import {
@@ -105,7 +105,7 @@ export default function useCollapsibleAppBar(userOptions: Options = defaultOptio
105
105
  const indexRef = useRef<number>(0);
106
106
  const offsetsRef = useRef<Array<number>>([]);
107
107
 
108
- const onScrollViewChanged = (nextIndex: number) => {
108
+ const onScrollViewChanged = useCallback((nextIndex: number) => {
109
109
  const prevIndex = indexRef.current;
110
110
  if (prevIndex === nextIndex) {
111
111
  return;
@@ -125,7 +125,7 @@ export default function useCollapsibleAppBar(userOptions: Options = defaultOptio
125
125
  if (translateY.value < 0 && savedOffsetY < appBarHeight) {
126
126
  translateY.value = withTiming(0, ANIMATION_CONFIG);
127
127
  }
128
- };
128
+ }, [appBarHeight]);
129
129
 
130
130
  const scrollHandler = useAnimatedScrollHandler({
131
131
  onBeginDrag: () => {
@@ -9,10 +9,11 @@ export interface SyncAnimatedValueConfig {
9
9
 
10
10
  export default function useSyncAnimatedValue(config: SyncAnimatedValueConfig): SyncAnimatedValue {
11
11
  const {
12
- initialValue,
12
+ initialValue: maybeInitialValue,
13
13
  shouldSyncAlways = false,
14
14
  } = config;
15
15
 
16
+ const initialValue = maybeInitialValue ?? 0;
16
17
  const animatedValue = useRef(new Animated.Value(initialValue)).current;
17
18
 
18
19
  const indexRef = useRef<number>(initialValue);
@@ -1,16 +1,20 @@
1
- import { MonoStore, StoreSubscription } from './types';
1
+ import { MonoStore, StoreSubscription, DispatchAction } from './types';
2
2
 
3
- export default class MockStore<T> implements MonoStore<T> {
3
+ export default class MockStore<S> implements MonoStore<S> {
4
4
 
5
- dispatch(data: T): void {
5
+ dispatch(action: DispatchAction<S>): void {
6
6
  // do nothing
7
7
  }
8
8
 
9
+ getState(): S {
10
+ throw new Error('stub!');
11
+ }
12
+
9
13
  removeAllListeners(): void {
10
14
  // do nothing
11
15
  }
12
16
 
13
- subscribe(listener: (data: T) => void): StoreSubscription {
17
+ subscribe(listener: (state: S) => void): StoreSubscription {
14
18
  return () => void 0;
15
19
  }
16
20
 
@@ -1,41 +1,48 @@
1
- import { MonoStore, StoreSubscription } from './types';
1
+ import type { DispatchAction, MonoStore, StoreSubscription } from './types';
2
2
 
3
3
  function refEqual(a: any, b: any): boolean {
4
4
  return a === b;
5
5
  }
6
6
 
7
- export default class SimpleStore<T> implements MonoStore<T> {
7
+ export default class SimpleStore<S> implements MonoStore<S> {
8
8
 
9
- private data: T;
9
+ private state: S;
10
10
 
11
- private listeners: Array<(data: T) => void> = [];
11
+ private listeners: Array<(state: S) => void> = [];
12
12
 
13
- constructor(initialData: T) {
14
- this.data = initialData;
13
+ constructor(initialState: S) {
14
+ this.state = initialState;
15
15
  }
16
16
 
17
- subscribe(listener: (data: T) => void): StoreSubscription {
18
- this.listeners.push(listener);
17
+ dispatch(action: DispatchAction<S>): void {
18
+ // @ts-ignore
19
+ const nextState = typeof action === 'function' ? action(this.state) : action;
19
20
 
20
- return () => {
21
- const index = this.listeners.indexOf(listener);
22
- this.listeners.splice(index, 1);
23
- };
24
- }
25
-
26
- dispatch(data: T): void {
27
- // Do not dispatch if data ref is equal
28
- if (refEqual(this.data, data)) {
21
+ // Do not dispatch if state ref is equal
22
+ if (refEqual(this.state, nextState)) {
29
23
  return;
30
24
  }
31
25
 
32
- this.data = data;
26
+ this.state = nextState;
33
27
  for (const id in this.listeners) {
34
28
  const listener = this.listeners[id];
35
- listener?.(data);
29
+ listener?.(nextState);
36
30
  }
37
31
  }
38
32
 
33
+ getState(): S {
34
+ return this.state;
35
+ }
36
+
37
+ subscribe(listener: (state: S) => void): StoreSubscription {
38
+ this.listeners.push(listener);
39
+
40
+ return () => {
41
+ const index = this.listeners.indexOf(listener);
42
+ this.listeners.splice(index, 1);
43
+ };
44
+ }
45
+
39
46
  removeAllListeners(): void {
40
47
  this.listeners.splice(0, this.listeners.length);
41
48
  }
@@ -1,3 +1,3 @@
1
1
  export { default as SimpleStore } from './SimpleStore';
2
2
  export { default as MockStore } from './MockStore';
3
- export type { MonoStore } from './types';
3
+ export type { MonoStore, DispatchAction } from './types';
@@ -2,8 +2,11 @@ export interface StoreSubscription {
2
2
  (): void;
3
3
  }
4
4
 
5
- export interface MonoStore<T> {
6
- dispatch: (data: T) => void;
7
- subscribe: (listener: (data: T) => void) => StoreSubscription;
5
+ export type DispatchAction<State> = State | ((prevState: State) => State);
6
+
7
+ export interface MonoStore<S> {
8
+ dispatch: (action: DispatchAction<S>) => void;
9
+ getState: () => S;
10
+ subscribe: (listener: (state: S) => void) => StoreSubscription;
8
11
  removeAllListeners: () => void;
9
12
  }