@fountain-ui/lab 2.0.0-beta.66 → 2.0.0-beta.68

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.
@@ -60,9 +60,10 @@ function ComicViewer(props) {
60
60
  autoHandleErrorCount = 3,
61
61
  fastScrollOptions,
62
62
  initialNumToRender = 1,
63
+ initialNumToCreate,
63
64
  initialScrollPercentage = 0,
64
65
  itemVisiblePercentThreshold = 0,
65
- intrinsicImages,
66
+ intrinsicImages: originalIntrinsicImages,
66
67
  maxContentWidth = MAXIMUM_WIDTH,
67
68
  onItemPress,
68
69
  onScroll,
@@ -73,11 +74,15 @@ function ComicViewer(props) {
73
74
  windowSize = 3,
74
75
  ...otherProps
75
76
  } = props;
77
+ const initialCreateCount = initialNumToCreate ? R.min(initialNumToCreate, initialNumToRender) : undefined;
78
+ const initialIntrinsicImages = initialCreateCount ? R.take(initialCreateCount, originalIntrinsicImages) : originalIntrinsicImages;
79
+ const [intrinsicImages, setIntrinsicImages] = (0, _react.useState)(initialIntrinsicImages);
76
80
  const fastScrollRef = fastScrollOptions === null || fastScrollOptions === void 0 ? void 0 : fastScrollOptions.ref;
77
81
  const flatListRef = (0, _react.useRef)(null);
78
82
  const actualImageWidth = Math.min(viewportWidth, maxContentWidth);
79
83
  const initialImageStates = (0, _react.useMemo)(() => R.map(createInitialImageState, intrinsicImages), []);
80
84
  const imageStatesRef = (0, _react.useRef)(initialImageStates);
85
+ const shouldWaitInitialCreate = (0, _react.useRef)(!R.isNil(initialCreateCount));
81
86
 
82
87
  const mapImageStatesToItemStates = imageStates => {
83
88
  return imageStates.map((image, index) => mapImageStateToItemState(index, image, autoHandleErrorCount));
@@ -94,7 +99,7 @@ function ComicViewer(props) {
94
99
  height: isNaN(height) ? 0 : height
95
100
  };
96
101
  }, intrinsicImages);
97
- }, [actualImageWidth]);
102
+ }, [actualImageWidth, intrinsicImages]);
98
103
  const layoutFromDimensions = (0, _react.useCallback)(() => {
99
104
  const itemHeights = R.map(dimension => dimension.height, renderedDimensions);
100
105
  const [totalHeight, heightAccum] = getHeightAccum(itemHeights);
@@ -166,13 +171,29 @@ function ComicViewer(props) {
166
171
  });
167
172
  };
168
173
 
169
- const renderItem = (0, _react.useCallback)(_ref2 => {
174
+ const updateIntrinsicImages = (0, _react.useCallback)(() => {
175
+ const isInitialCreateFinish = R.all(imageState => imageState.urlState.validity !== 'unknown')(imageStatesRef.current);
176
+
177
+ if (!isInitialCreateFinish || !shouldWaitInitialCreate.current) {
178
+ return;
179
+ }
180
+
181
+ setIntrinsicImages(originalIntrinsicImages);
182
+ const newImageStates = R.map(createInitialImageState, originalIntrinsicImages);
183
+ imageStatesRef.current = R.map(_ref2 => {
184
+ let [, state] = _ref2;
185
+ return state;
186
+ })(R.toPairs(R.mergeDeepLeft(imageStatesRef.current, newImageStates)));
187
+ setItemStates(mapImageStatesToItemStates(imageStatesRef.current));
188
+ shouldWaitInitialCreate.current = false;
189
+ }, [originalIntrinsicImages, createInitialImageState, mapImageStatesToItemStates]);
190
+ const renderItem = (0, _react.useCallback)(_ref3 => {
170
191
  var _renderedDimensions$i, _renderedDimensions$i2;
171
192
 
172
193
  let {
173
194
  item,
174
195
  index
175
- } = _ref2;
196
+ } = _ref3;
176
197
 
177
198
  const handleError = () => {
178
199
  onError && onError();
@@ -195,6 +216,7 @@ function ComicViewer(props) {
195
216
  return;
196
217
  }
197
218
 
219
+ updateIntrinsicImages();
198
220
  updateTryRenderingMillis();
199
221
  };
200
222
 
@@ -217,6 +239,7 @@ function ComicViewer(props) {
217
239
 
218
240
  return imageState;
219
241
  });
242
+ updateIntrinsicImages();
220
243
  };
221
244
 
222
245
  return /*#__PURE__*/_react.default.createElement(_ViewerItem.default, {
@@ -231,7 +254,7 @@ function ComicViewer(props) {
231
254
  height: ((_renderedDimensions$i2 = renderedDimensions[index]) === null || _renderedDimensions$i2 === void 0 ? void 0 : _renderedDimensions$i2.height) ?? 0,
232
255
  reloadButtonVisible: item.reloadButtonVisible
233
256
  });
234
- }, [onItemPress, renderedDimensions]);
257
+ }, [onItemPress, renderedDimensions, updateIntrinsicImages]);
235
258
  (0, _react.useEffect)(() => {
236
259
  const scroll = () => {
237
260
  const offset = Math.floor(initialScrollPercentage / 100 * totalHeight);
@@ -1 +1 @@
1
- {"version":3,"names":["appender","left","right","getHeightAccum","heights","R","mapAccum","keyExtractor","item","String","index","createInitialImageState","image","totalErrorCount","dimension","tryRenderingMillis","urlState","url","validity","mapImageStateToItemState","imageState","autoHandleErrorCount","imageKey","reloadButtonVisible","mapIndexed","addIndex","map","MAXIMUM_WIDTH","ComicViewer","props","debounceMillis","fastScrollOptions","initialNumToRender","initialScrollPercentage","itemVisiblePercentThreshold","intrinsicImages","maxContentWidth","onItemPress","onScroll","onError","onReloadPress","viewportWidth","invisiblePaddingTop","windowSize","otherProps","fastScrollRef","ref","flatListRef","useRef","actualImageWidth","Math","min","initialImageStates","useMemo","imageStatesRef","mapImageStatesToItemStates","imageStates","itemStates","setItemStates","useState","current","renderedDimensions","intrinsicImage","height","width","isNaN","layoutFromDimensions","useCallback","itemHeights","totalHeight","heightAccum","itemOffsets","prepend","getItemLayout","data","length","offset","viewabilityConfig","updateImageState","updateFunction","prevImageStates","newImageStates","prevItemStates","newItemStates","equals","updateTryRenderingMillis","Date","getTime","i","onViewableItemsChanged","viewableItems","handleScroll","event","onContentScroll","scrollContentToOffset","scrollToOffset","animated","renderItem","handleError","handleReloadPress","onLoad","undefined","useEffect","scroll","floor","timeoutId","Platform","OS","setTimeout","clearTimeout"],"sources":["ComicViewer.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { FlatList, ListRenderItem, NativeScrollEvent, NativeSyntheticEvent, Platform, ViewToken } from 'react-native';\nimport * as R from 'ramda';\nimport { default as ComicViewerProps, Dimension, IntrinsicImage } from './ComicViewerProps';\nimport ViewerItem from './ViewerItem';\nimport FastScroll from './FastScroll';\n\nconst appender = (left: number, right: number): [number, number] => [left + right, left + right];\nconst getHeightAccum = (heights: number[]): [number, number[]] => R.mapAccum(appender, 0, heights);\n\nconst keyExtractor = <T, >(item: ItemState) => String(item.index);\n\ninterface UrlState {\n url: string;\n validity: 'valid' | 'invalid' | 'unknown';\n}\n\ninterface ImageState {\n urlState: UrlState;\n totalErrorCount: number;\n dimension: Dimension;\n tryRenderingMillis: number;\n}\n\ninterface ItemState {\n index: number;\n url?: string;\n imageKey: string;\n reloadButtonVisible: boolean;\n dimension: Dimension;\n}\n\nconst createInitialImageState = (image: IntrinsicImage): ImageState => ({\n totalErrorCount: 0,\n dimension: image.dimension,\n tryRenderingMillis: 0,\n urlState: {\n url: image.url,\n validity: 'unknown',\n },\n});\n\nconst mapImageStateToItemState = (\n index: number,\n imageState: ImageState,\n autoHandleErrorCount: number,\n): ItemState => ({\n index,\n url: imageState.urlState?.url,\n imageKey: `${imageState.tryRenderingMillis}-${index}`,\n reloadButtonVisible: (imageState.urlState?.validity !== 'valid') && imageState.totalErrorCount >= autoHandleErrorCount,\n dimension: imageState.dimension,\n});\n\nconst mapIndexed = R.addIndex<IntrinsicImage>(R.map);\n\nconst MAXIMUM_WIDTH = 720;\n\nexport default function ComicViewer(props: ComicViewerProps) {\n const {\n debounceMillis = 100,\n autoHandleErrorCount = 3,\n fastScrollOptions,\n initialNumToRender = 1,\n initialScrollPercentage = 0,\n itemVisiblePercentThreshold = 0,\n intrinsicImages,\n maxContentWidth = MAXIMUM_WIDTH,\n onItemPress,\n onScroll,\n onError,\n onReloadPress,\n viewportWidth,\n invisiblePaddingTop = 0,\n windowSize = 3,\n ...otherProps\n } = props;\n\n const fastScrollRef = fastScrollOptions?.ref;\n\n const flatListRef = useRef<FlatList>(null);\n\n const actualImageWidth = Math.min(viewportWidth, maxContentWidth);\n\n const initialImageStates = useMemo<Array<ImageState>>(() => R.map(createInitialImageState, intrinsicImages), []);\n\n const imageStatesRef = useRef<Array<ImageState>>(initialImageStates);\n\n const mapImageStatesToItemStates = (imageStates: Array<ImageState>): Array<ItemState> => {\n return imageStates.map((image, index) => mapImageStateToItemState(\n index, image, autoHandleErrorCount,\n ));\n };\n\n const [itemStates, setItemStates] = useState<Array<ItemState>>(() => {\n return mapImageStatesToItemStates(imageStatesRef.current);\n });\n\n const renderedDimensions = useMemo<Array<Dimension>>(() => {\n return mapIndexed((intrinsicImage, index) => {\n const height = (intrinsicImage.dimension.height * actualImageWidth) / intrinsicImage.dimension.width + (index === 0 ? invisiblePaddingTop : 0);\n\n return {\n width: actualImageWidth,\n height: isNaN(height) ? 0 : height,\n };\n }, intrinsicImages);\n }, [actualImageWidth]);\n\n const layoutFromDimensions = useCallback(() => {\n const itemHeights = R.map(dimension => dimension.height, renderedDimensions);\n const [totalHeight, heightAccum] = getHeightAccum(itemHeights);\n const itemOffsets = R.prepend(0, heightAccum);\n\n const getItemLayout = (data: any, index: number) => ({\n index,\n length: itemHeights[index],\n offset: itemOffsets[index],\n });\n\n return {\n totalHeight,\n getItemLayout,\n };\n }, [renderedDimensions]);\n\n const { totalHeight, getItemLayout } = layoutFromDimensions();\n\n const viewabilityConfig = useMemo(() => ({\n itemVisiblePercentThreshold,\n }), [itemVisiblePercentThreshold]);\n\n const updateImageState = (updateFunction: (prev: ImageState, index: number) => ImageState) => {\n const prevImageStates = imageStatesRef.current;\n const newImageStates = prevImageStates.map(updateFunction);\n\n imageStatesRef.current = newImageStates;\n\n setItemStates(prevItemStates => {\n const newItemStates = mapImageStatesToItemStates(newImageStates);\n\n return R.equals(prevItemStates, newItemStates) ? prevItemStates : newItemStates;\n });\n };\n\n const updateTryRenderingMillis = () => {\n const tryRenderingMillis = new Date().getTime();\n\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (urlState?.validity === 'invalid') {\n return {\n ...imageState,\n tryRenderingMillis,\n };\n }\n\n return imageState;\n });\n };\n const onViewableItemsChanged = useRef(({ viewableItems }: { viewableItems: Array<ViewToken> }) => {\n updateTryRenderingMillis();\n });\n\n const handleScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {\n fastScrollRef?.current?.onContentScroll(event);\n\n onScroll?.(event);\n }, [onScroll]);\n\n const scrollContentToOffset = (offset: number) => {\n flatListRef.current?.scrollToOffset({\n offset,\n animated: false,\n });\n };\n\n const renderItem: ListRenderItem<ItemState> = useCallback(({ item, index }) => {\n const handleError = () => {\n onError && onError();\n\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index) {\n return {\n ...imageState,\n totalErrorCount: imageState.totalErrorCount + 1,\n urlState: {\n ...urlState,\n validity: 'invalid',\n },\n };\n }\n\n return imageState;\n });\n\n if (item.reloadButtonVisible) {\n return;\n }\n\n updateTryRenderingMillis();\n };\n\n const handleReloadPress = () => {\n onReloadPress && onReloadPress();\n\n updateTryRenderingMillis();\n };\n\n const onLoad = () => {\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index && urlState !== undefined) {\n return {\n ...imageState,\n urlState: {\n ...urlState,\n validity: 'valid',\n },\n };\n }\n\n return imageState;\n });\n };\n\n return (\n <ViewerItem\n onError={handleError}\n onLoad={onLoad}\n onPress={onItemPress}\n onReloadPress={handleReloadPress}\n url={item.url}\n imageKey={item.imageKey}\n invisiblePaddingTop={index === 0 ? invisiblePaddingTop : 0}\n width={renderedDimensions[index]?.width ?? 0}\n height={renderedDimensions[index]?.height ?? 0}\n reloadButtonVisible={item.reloadButtonVisible}\n />\n );\n }, [onItemPress, renderedDimensions]);\n\n useEffect(() => {\n const scroll = () => {\n const offset = Math.floor((initialScrollPercentage / 100) * totalHeight);\n\n if (flatListRef.current) {\n flatListRef.current.scrollToOffset({ offset, animated: false });\n }\n };\n\n let timeoutId: NodeJS.Timeout | undefined = undefined;\n\n /**\n * @FIXME\n * scrollToOffset has issue(no effect) in useEffect hook on iOS.\n * ref: https://github.com/facebook/react-native/issues/35575\n */\n if (Platform.OS === 'ios') {\n timeoutId = setTimeout(scroll, 0);\n } else {\n scroll();\n }\n\n return () => {\n timeoutId && clearTimeout(timeoutId);\n }\n }, []);\n\n return (\n <React.Fragment>\n <FlatList\n data={itemStates}\n getItemLayout={getItemLayout}\n initialNumToRender={initialNumToRender}\n keyExtractor={keyExtractor}\n onViewableItemsChanged={onViewableItemsChanged.current}\n ref={flatListRef}\n renderItem={renderItem}\n viewabilityConfig={viewabilityConfig}\n windowSize={windowSize}\n onScroll={handleScroll}\n {...otherProps}\n />\n\n <FastScroll\n {...fastScrollOptions}\n contentLength={totalHeight}\n initialScrollPercentage={initialScrollPercentage}\n scrollContentToOffset={scrollContentToOffset}\n />\n </React.Fragment>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"names":["appender","left","right","getHeightAccum","heights","R","mapAccum","keyExtractor","item","String","index","createInitialImageState","image","totalErrorCount","dimension","tryRenderingMillis","urlState","url","validity","mapImageStateToItemState","imageState","autoHandleErrorCount","imageKey","reloadButtonVisible","mapIndexed","addIndex","map","MAXIMUM_WIDTH","ComicViewer","props","debounceMillis","fastScrollOptions","initialNumToRender","initialNumToCreate","initialScrollPercentage","itemVisiblePercentThreshold","intrinsicImages","originalIntrinsicImages","maxContentWidth","onItemPress","onScroll","onError","onReloadPress","viewportWidth","invisiblePaddingTop","windowSize","otherProps","initialCreateCount","min","undefined","initialIntrinsicImages","take","setIntrinsicImages","useState","fastScrollRef","ref","flatListRef","useRef","actualImageWidth","Math","initialImageStates","useMemo","imageStatesRef","shouldWaitInitialCreate","isNil","mapImageStatesToItemStates","imageStates","itemStates","setItemStates","current","renderedDimensions","intrinsicImage","height","width","isNaN","layoutFromDimensions","useCallback","itemHeights","totalHeight","heightAccum","itemOffsets","prepend","getItemLayout","data","length","offset","viewabilityConfig","updateImageState","updateFunction","prevImageStates","newImageStates","prevItemStates","newItemStates","equals","updateTryRenderingMillis","Date","getTime","i","onViewableItemsChanged","viewableItems","handleScroll","event","onContentScroll","scrollContentToOffset","scrollToOffset","animated","updateIntrinsicImages","isInitialCreateFinish","all","state","toPairs","mergeDeepLeft","renderItem","handleError","handleReloadPress","onLoad","useEffect","scroll","floor","timeoutId","Platform","OS","setTimeout","clearTimeout"],"sources":["ComicViewer.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { FlatList, ListRenderItem, NativeScrollEvent, NativeSyntheticEvent, Platform, ViewToken } from 'react-native';\nimport * as R from 'ramda';\nimport { default as ComicViewerProps, Dimension, IntrinsicImage } from './ComicViewerProps';\nimport ViewerItem from './ViewerItem';\nimport FastScroll from './FastScroll';\n\nconst appender = (left: number, right: number): [number, number] => [left + right, left + right];\nconst getHeightAccum = (heights: number[]): [number, number[]] => R.mapAccum(appender, 0, heights);\n\nconst keyExtractor = <T, >(item: ItemState) => String(item.index);\n\ninterface UrlState {\n url: string;\n validity: 'valid' | 'invalid' | 'unknown';\n}\n\ninterface ImageState {\n urlState: UrlState;\n totalErrorCount: number;\n dimension: Dimension;\n tryRenderingMillis: number;\n}\n\ninterface ItemState {\n index: number;\n url?: string;\n imageKey: string;\n reloadButtonVisible: boolean;\n dimension: Dimension;\n}\n\nconst createInitialImageState = (image: IntrinsicImage): ImageState => ({\n totalErrorCount: 0,\n dimension: image.dimension,\n tryRenderingMillis: 0,\n urlState: {\n url: image.url,\n validity: 'unknown',\n },\n});\n\nconst mapImageStateToItemState = (\n index: number,\n imageState: ImageState,\n autoHandleErrorCount: number,\n): ItemState => ({\n index,\n url: imageState.urlState?.url,\n imageKey: `${imageState.tryRenderingMillis}-${index}`,\n reloadButtonVisible: (imageState.urlState?.validity !== 'valid') && imageState.totalErrorCount >= autoHandleErrorCount,\n dimension: imageState.dimension,\n});\n\nconst mapIndexed = R.addIndex<IntrinsicImage>(R.map);\n\nconst MAXIMUM_WIDTH = 720;\n\nexport default function ComicViewer(props: ComicViewerProps) {\n const {\n debounceMillis = 100,\n autoHandleErrorCount = 3,\n fastScrollOptions,\n initialNumToRender = 1,\n initialNumToCreate,\n initialScrollPercentage = 0,\n itemVisiblePercentThreshold = 0,\n intrinsicImages: originalIntrinsicImages,\n maxContentWidth = MAXIMUM_WIDTH,\n onItemPress,\n onScroll,\n onError,\n onReloadPress,\n viewportWidth,\n invisiblePaddingTop = 0,\n windowSize = 3,\n ...otherProps\n } = props;\n\n const initialCreateCount = initialNumToCreate ? R.min(initialNumToCreate, initialNumToRender) : undefined;\n const initialIntrinsicImages = initialCreateCount ? R.take(initialCreateCount, originalIntrinsicImages) : originalIntrinsicImages;\n const [intrinsicImages, setIntrinsicImages] = useState(initialIntrinsicImages);\n\n const fastScrollRef = fastScrollOptions?.ref;\n\n const flatListRef = useRef<FlatList>(null);\n\n const actualImageWidth = Math.min(viewportWidth, maxContentWidth);\n\n const initialImageStates = useMemo<Array<ImageState>>(() => R.map(createInitialImageState, intrinsicImages), []);\n\n const imageStatesRef = useRef<Array<ImageState>>(initialImageStates);\n\n const shouldWaitInitialCreate = useRef<Boolean>(!R.isNil(initialCreateCount));\n\n const mapImageStatesToItemStates = (imageStates: Array<ImageState>): Array<ItemState> => {\n return imageStates.map((image, index) => mapImageStateToItemState(\n index, image, autoHandleErrorCount,\n ));\n };\n\n const [itemStates, setItemStates] = useState<Array<ItemState>>(() => {\n return mapImageStatesToItemStates(imageStatesRef.current);\n });\n\n const renderedDimensions = useMemo<Array<Dimension>>(() => {\n return mapIndexed((intrinsicImage, index) => {\n const height = (intrinsicImage.dimension.height * actualImageWidth) / intrinsicImage.dimension.width + (index === 0 ? invisiblePaddingTop : 0);\n\n return {\n width: actualImageWidth,\n height: isNaN(height) ? 0 : height,\n };\n }, intrinsicImages);\n }, [actualImageWidth, intrinsicImages]);\n\n const layoutFromDimensions = useCallback(() => {\n const itemHeights = R.map(dimension => dimension.height, renderedDimensions);\n const [totalHeight, heightAccum] = getHeightAccum(itemHeights);\n const itemOffsets = R.prepend(0, heightAccum);\n\n const getItemLayout = (data: any, index: number) => ({\n index,\n length: itemHeights[index],\n offset: itemOffsets[index],\n });\n\n return {\n totalHeight,\n getItemLayout,\n };\n }, [renderedDimensions]);\n\n const { totalHeight, getItemLayout } = layoutFromDimensions();\n\n const viewabilityConfig = useMemo(() => ({\n itemVisiblePercentThreshold,\n }), [itemVisiblePercentThreshold]);\n\n const updateImageState = (updateFunction: (prev: ImageState, index: number) => ImageState) => {\n const prevImageStates = imageStatesRef.current;\n const newImageStates = prevImageStates.map(updateFunction);\n\n imageStatesRef.current = newImageStates;\n\n setItemStates(prevItemStates => {\n const newItemStates = mapImageStatesToItemStates(newImageStates);\n\n return R.equals(prevItemStates, newItemStates) ? prevItemStates : newItemStates;\n });\n };\n\n const updateTryRenderingMillis = () => {\n const tryRenderingMillis = new Date().getTime();\n\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (urlState?.validity === 'invalid') {\n return {\n ...imageState,\n tryRenderingMillis,\n };\n }\n\n return imageState;\n });\n };\n const onViewableItemsChanged = useRef(({ viewableItems }: { viewableItems: Array<ViewToken> }) => {\n updateTryRenderingMillis();\n });\n\n const handleScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {\n fastScrollRef?.current?.onContentScroll(event);\n\n onScroll?.(event);\n }, [onScroll]);\n\n const scrollContentToOffset = (offset: number) => {\n flatListRef.current?.scrollToOffset({\n offset,\n animated: false,\n });\n };\n\n const updateIntrinsicImages = useCallback(() => {\n const isInitialCreateFinish = R.all((imageState: ImageState) => imageState.urlState.validity !== 'unknown')(imageStatesRef.current);\n\n if (!isInitialCreateFinish || !shouldWaitInitialCreate.current) {\n return;\n }\n\n setIntrinsicImages(originalIntrinsicImages);\n const newImageStates = R.map(createInitialImageState, originalIntrinsicImages);\n imageStatesRef.current = R.map(([, state]: [number, ImageState]) => state)(R.toPairs(R.mergeDeepLeft(imageStatesRef.current, newImageStates)));\n setItemStates(mapImageStatesToItemStates(imageStatesRef.current));\n\n shouldWaitInitialCreate.current = false;\n }, [originalIntrinsicImages, createInitialImageState, mapImageStatesToItemStates]);\n\n const renderItem: ListRenderItem<ItemState> = useCallback(({ item, index }) => {\n const handleError = () => {\n onError && onError();\n\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index) {\n return {\n ...imageState,\n totalErrorCount: imageState.totalErrorCount + 1,\n urlState: {\n ...urlState,\n validity: 'invalid',\n },\n };\n }\n\n return imageState;\n });\n\n if (item.reloadButtonVisible) {\n return;\n }\n\n updateIntrinsicImages();\n\n updateTryRenderingMillis();\n };\n\n const handleReloadPress = () => {\n onReloadPress && onReloadPress();\n\n updateTryRenderingMillis();\n };\n\n const onLoad = () => {\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index && urlState !== undefined) {\n return {\n ...imageState,\n urlState: {\n ...urlState,\n validity: 'valid',\n },\n };\n }\n\n return imageState;\n });\n\n updateIntrinsicImages();\n };\n\n return (\n <ViewerItem\n onError={handleError}\n onLoad={onLoad}\n onPress={onItemPress}\n onReloadPress={handleReloadPress}\n url={item.url}\n imageKey={item.imageKey}\n invisiblePaddingTop={index === 0 ? invisiblePaddingTop : 0}\n width={renderedDimensions[index]?.width ?? 0}\n height={renderedDimensions[index]?.height ?? 0}\n reloadButtonVisible={item.reloadButtonVisible}\n />\n );\n }, [onItemPress, renderedDimensions, updateIntrinsicImages]);\n\n useEffect(() => {\n const scroll = () => {\n const offset = Math.floor((initialScrollPercentage / 100) * totalHeight);\n\n if (flatListRef.current) {\n flatListRef.current.scrollToOffset({ offset, animated: false });\n }\n };\n\n let timeoutId: NodeJS.Timeout | undefined = undefined;\n\n /**\n * @FIXME\n * scrollToOffset has issue(no effect) in useEffect hook on iOS.\n * ref: https://github.com/facebook/react-native/issues/35575\n */\n if (Platform.OS === 'ios') {\n timeoutId = setTimeout(scroll, 0);\n } else {\n scroll();\n }\n\n return () => {\n timeoutId && clearTimeout(timeoutId);\n };\n }, []);\n\n return (\n <React.Fragment>\n <FlatList\n data={itemStates}\n getItemLayout={getItemLayout}\n initialNumToRender={initialNumToRender}\n keyExtractor={keyExtractor}\n onViewableItemsChanged={onViewableItemsChanged.current}\n ref={flatListRef}\n renderItem={renderItem}\n viewabilityConfig={viewabilityConfig}\n windowSize={windowSize}\n onScroll={handleScroll}\n {...otherProps}\n />\n\n <FastScroll\n {...fastScrollOptions}\n contentLength={totalHeight}\n initialScrollPercentage={initialScrollPercentage}\n scrollContentToOffset={scrollContentToOffset}\n />\n </React.Fragment>\n );\n};\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["ComicViewerProps.ts"],"sourcesContent":["import React from 'react';\nimport { ComponentProps } from '@fountain-ui/core';\nimport { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';\nimport { FastScrollOptions } from './FastScrollProps';\n\nexport interface Dimension {\n width: number;\n height: number;\n}\n\nexport interface IntrinsicImage {\n dimension: Dimension;\n url: string;\n}\n\nexport default interface ComicViewerProps extends ComponentProps <{\n /**\n * Delay Time to call the error handler.\n * @default 100\n */\n debounceMillis?: number;\n\n /**\n * How many times handle onError directly when item error occur\n * @default 3\n */\n autoHandleErrorCount?: number;\n\n /**\n * How many items to render in the initial batch.\n * @default 1\n */\n initialNumToRender?: number;\n\n /**\n * Start at initialScrollPercentage.\n * If over 100, scroll to end.\n * @default 0\n */\n initialScrollPercentage?: number;\n\n /**\n * The value for FlatList viewabilityConfig.itemVisiblePercentThreshold.\n * @default 0\n */\n itemVisiblePercentThreshold?: number;\n\n /**\n * Dimensions and url info of each Image considering viewport.\n */\n intrinsicImages: Array<IntrinsicImage>;\n\n /**\n * Need invisible paddingTop viewer vertically expanded.\n * @default 0\n */\n invisiblePaddingTop?: number;\n\n /**\n * Max value of contents image width size.\n * @default 720\n */\n maxContentWidth?: number;\n\n /**\n * Width of viewport.\n */\n viewportWidth: number;\n\n /**\n * The value for FlatList windowSize.\n * @default 3\n */\n windowSize?: number;\n\n /**\n * Options for fastscroll component.\n */\n fastScrollOptions: FastScrollOptions;\n\n /**\n * Handle scroll event.\n * @param event Scroll event.\n */\n onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;\n\n /**\n * Handle item press event.\n */\n onItemPress?: () => void;\n\n /**\n * Handle image loading fail event.\n */\n onError?: () => void;\n\n /**\n * Handle reload button press event.\n */\n onReloadPress?: () => void;\n\n /**\n * Component for comic viewer footer.\n */\n ListFooterComponent?: React.ReactElement;\n}> {}\n"],"mappings":""}
1
+ {"version":3,"names":[],"sources":["ComicViewerProps.ts"],"sourcesContent":["import React from 'react';\nimport { ComponentProps } from '@fountain-ui/core';\nimport { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';\nimport { FastScrollOptions } from './FastScrollProps';\n\nexport interface Dimension {\n width: number;\n height: number;\n}\n\nexport interface IntrinsicImage {\n dimension: Dimension;\n url: string;\n}\n\nexport default interface ComicViewerProps extends ComponentProps <{\n /**\n * Delay Time to call the error handler.\n * @default 100\n */\n debounceMillis?: number;\n\n /**\n * How many times handle onError directly when item error occur\n * @default 3\n */\n autoHandleErrorCount?: number;\n\n /**\n * How many items to render in the initial batch.\n * @default 1\n */\n initialNumToRender?: number;\n\n /**\n * How many items to create in the initial batch.\n * @default 1\n */\n initialNumToCreate?: number;\n\n /**\n * Start at initialScrollPercentage.\n * If over 100, scroll to end.\n * @default 0\n */\n initialScrollPercentage?: number;\n\n /**\n * The value for FlatList viewabilityConfig.itemVisiblePercentThreshold.\n * @default 0\n */\n itemVisiblePercentThreshold?: number;\n\n /**\n * Dimensions and url info of each Image considering viewport.\n */\n intrinsicImages: Array<IntrinsicImage>;\n\n /**\n * Need invisible paddingTop viewer vertically expanded.\n * @default 0\n */\n invisiblePaddingTop?: number;\n\n /**\n * Max value of contents image width size.\n * @default 720\n */\n maxContentWidth?: number;\n\n /**\n * Width of viewport.\n */\n viewportWidth: number;\n\n /**\n * The value for FlatList windowSize.\n * @default 3\n */\n windowSize?: number;\n\n /**\n * Options for fastscroll component.\n */\n fastScrollOptions: FastScrollOptions;\n\n /**\n * Handle scroll event.\n * @param event Scroll event.\n */\n onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;\n\n /**\n * Handle item press event.\n */\n onItemPress?: () => void;\n\n /**\n * Handle image loading fail event.\n */\n onError?: () => void;\n\n /**\n * Handle reload button press event.\n */\n onReloadPress?: () => void;\n\n /**\n * Component for comic viewer footer.\n */\n ListFooterComponent?: React.ReactElement;\n}> {}\n"],"mappings":""}
@@ -74,8 +74,7 @@ const FastScroll = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
74
74
  const position = { ...absolutePosition,
75
75
  right: R.defaultTo(0)(absolutePosition === null || absolutePosition === void 0 ? void 0 : absolutePosition.right) + INDICATOR_WIDTH
76
76
  };
77
-
78
- const onContentScroll = event => {
77
+ const onContentScroll = (0, _react.useCallback)(event => {
79
78
  if (!isIndicatorDragging.current) {
80
79
  const contentPercentage = (0, _util.offsetToPercentage)(event.nativeEvent.contentOffset.y, totalContentLength);
81
80
  const offset = (0, _util.percentageToOffset)(contentPercentage, movementRange);
@@ -97,7 +96,7 @@ const FastScroll = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
97
96
  } else {
98
97
  setVisible(true);
99
98
  }
100
- };
99
+ }, [totalContentLength, movementRange]);
101
100
 
102
101
  const getIsIndicatorDragging = () => isIndicatorDragging.current;
103
102
 
@@ -105,7 +104,7 @@ const FastScroll = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
105
104
  getIsIndicatorDragging,
106
105
  onContentScroll,
107
106
  setVisible
108
- }), []);
107
+ }), [onContentScroll]);
109
108
 
110
109
  const handleUpdate = () => {
111
110
  const contentPercentage = (0, _util.offsetToPercentage)(indicatorOffset.value, movementRange);
@@ -1 +1 @@
1
- {"version":3,"names":["INDICATOR_WIDTH","styles","StyleSheet","create","indicator","width","height","backgroundColor","flexDirection","alignItems","justifyContent","borderRadius","view","position","FastScroll","React","forwardRef","props","ref","absolutePosition","additionalLength","contentLength","initialScrollPercentage","movementRange","scrollContentToOffset","visibleDurations","hideMillis","showMillis","totalContentLength","contentOffset","Math","floor","contentPercentage","offsetToPercentage","initialLastIndicatorOffset","percentageToOffset","lastIndicatorOffset","useSharedValue","indicatorOffset","value","isIndicatorDragging","useRef","indicatorOpacity","visible","setVisible","useState","animatedStyle","useAnimatedStyle","transform","translateY","opacity","right","R","defaultTo","onContentScroll","event","current","nativeEvent","y","offset","getIsIndicatorDragging","useImperativeHandle","handleUpdate","setIsIndicatorDragging","pan","Gesture","Pan","onBegin","e","runOnJS","onUpdate","translationY","onFinalize","hide","withDelay","withTiming","duration","show","useEffect"],"sources":["FastScroll.tsx"],"sourcesContent":["import React, { useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport * as R from 'ramda';\nimport { NativeScrollEvent, NativeSyntheticEvent, View } from 'react-native';\nimport { Gesture, GestureDetector } from 'react-native-gesture-handler';\nimport Animated, { runOnJS, useAnimatedStyle, useSharedValue, withDelay, withTiming } from 'react-native-reanimated';\nimport { ChevronDown, ChevronUp } from '@fountain-ui/icons';\nimport { StyleSheet } from '@fountain-ui/core';\nimport FastScrollProps from './FastScrollProps';\nimport { offsetToPercentage, percentageToOffset } from './util';\n\nconst INDICATOR_WIDTH = 28;\n\nconst styles = StyleSheet.create({\n indicator: {\n width: INDICATOR_WIDTH,\n height: 48,\n backgroundColor: '#767676',\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: 16,\n },\n view: {\n position: 'absolute',\n width: 0,\n },\n});\n\nconst FastScroll = React.forwardRef((props: FastScrollProps, ref) => {\n const {\n absolutePosition,\n additionalLength = 0,\n contentLength,\n initialScrollPercentage = 0,\n movementRange,\n scrollContentToOffset,\n visibleDurations = { hideMillis: 200, showMillis: 350 },\n } = props;\n\n const totalContentLength = contentLength + additionalLength;\n\n const contentOffset = Math.floor((initialScrollPercentage / 100) * contentLength);\n const contentPercentage = offsetToPercentage(contentOffset, totalContentLength);\n const initialLastIndicatorOffset = percentageToOffset(contentPercentage, movementRange);\n\n const lastIndicatorOffset = useSharedValue(initialLastIndicatorOffset);\n const indicatorOffset = useSharedValue(lastIndicatorOffset.value);\n\n const isIndicatorDragging = useRef(false);\n\n const indicatorOpacity = useSharedValue(0);\n const [visible, setVisible] = useState(false);\n\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: indicatorOffset.value }],\n opacity: indicatorOpacity.value,\n }));\n\n const position = {\n ...absolutePosition,\n right: R.defaultTo(0)(absolutePosition?.right) + INDICATOR_WIDTH,\n };\n\n const onContentScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {\n if (!isIndicatorDragging.current) {\n const contentPercentage = offsetToPercentage(event.nativeEvent.contentOffset.y, totalContentLength);\n const offset = percentageToOffset(contentPercentage, movementRange);\n\n if (offset < 0 || indicatorOffset.value < 0) {\n lastIndicatorOffset.value = 0;\n indicatorOffset.value = 0;\n return;\n }\n\n if (offset > movementRange || indicatorOffset.value > movementRange) {\n lastIndicatorOffset.value = movementRange;\n indicatorOffset.value = movementRange;\n return;\n }\n\n lastIndicatorOffset.value = offset;\n indicatorOffset.value = offset;\n } else {\n setVisible(true);\n }\n };\n\n const getIsIndicatorDragging = () => isIndicatorDragging.current;\n\n useImperativeHandle(\n ref,\n () => ({\n getIsIndicatorDragging,\n onContentScroll,\n setVisible,\n }),\n [],\n );\n\n const handleUpdate = () => {\n const contentPercentage = offsetToPercentage(indicatorOffset.value, movementRange);\n const offset = percentageToOffset(contentPercentage, totalContentLength);\n\n scrollContentToOffset(offset);\n };\n\n const setIsIndicatorDragging = (value: boolean) => isIndicatorDragging.current = value;\n\n const pan = Gesture.Pan()\n .onBegin((e) => {\n indicatorOffset.value = lastIndicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(true);\n })\n .onUpdate((e) => {\n if (indicatorOffset.value <= 0 && e.translationY < 0) {\n indicatorOffset.value = 0;\n return;\n }\n\n if (indicatorOffset.value >= movementRange && e.translationY > 0) {\n indicatorOffset.value = movementRange;\n return;\n }\n\n indicatorOffset.value = lastIndicatorOffset.value + e.translationY;\n\n runOnJS(handleUpdate)();\n })\n .onFinalize((e) => {\n lastIndicatorOffset.value = indicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(false);\n });\n\n const hide = () => indicatorOpacity.value = withDelay(0, withTiming(0, { duration: visibleDurations.hideMillis }));\n\n const show = () => indicatorOpacity.value = withDelay(0, withTiming(1, { duration: visibleDurations.showMillis }));\n\n useEffect(() => {\n if (visible) {\n indicatorOffset.value = lastIndicatorOffset.value;\n show();\n } else {\n hide();\n }\n }, [visible]);\n\n return (\n <View\n style={[\n { height: movementRange },\n styles.view,\n position,\n ]}\n >\n <GestureDetector gesture={pan}>\n <Animated.View style={[\n animatedStyle,\n styles.indicator,\n ]}>\n <ChevronUp\n fill={'#ededed'}\n height={20}\n width={20}\n />\n <ChevronDown\n fill={'#ededed'}\n height={20}\n width={20}\n />\n </Animated.View>\n </GestureDetector>\n </View>\n );\n});\n\nexport default FastScroll;"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAEA,MAAMA,eAAe,GAAG,EAAxB;;AAEA,MAAMC,MAAM,GAAGC,gBAAA,CAAWC,MAAX,CAAkB;EAC7BC,SAAS,EAAE;IACPC,KAAK,EAAEL,eADA;IAEPM,MAAM,EAAE,EAFD;IAGPC,eAAe,EAAE,SAHV;IAIPC,aAAa,EAAE,QAJR;IAKPC,UAAU,EAAE,QALL;IAMPC,cAAc,EAAE,QANT;IAOPC,YAAY,EAAE;EAPP,CADkB;EAU7BC,IAAI,EAAE;IACFC,QAAQ,EAAE,UADR;IAEFR,KAAK,EAAE;EAFL;AAVuB,CAAlB,CAAf;;AAgBA,MAAMS,UAAU,gBAAGC,cAAA,CAAMC,UAAN,CAAiB,CAACC,KAAD,EAAyBC,GAAzB,KAAiC;EACjE,MAAM;IACFC,gBADE;IAEFC,gBAAgB,GAAG,CAFjB;IAGFC,aAHE;IAIFC,uBAAuB,GAAG,CAJxB;IAKFC,aALE;IAMFC,qBANE;IAOFC,gBAAgB,GAAG;MAAEC,UAAU,EAAE,GAAd;MAAmBC,UAAU,EAAE;IAA/B;EAPjB,IAQFV,KARJ;EAUA,MAAMW,kBAAkB,GAAGP,aAAa,GAAGD,gBAA3C;EAEA,MAAMS,aAAa,GAAIC,IAAI,CAACC,KAAL,CAAYT,uBAAuB,GAAG,GAA3B,GAAkCD,aAA7C,CAAvB;EACA,MAAMW,iBAAiB,GAAG,IAAAC,wBAAA,EAAmBJ,aAAnB,EAAkCD,kBAAlC,CAA1B;EACA,MAAMM,0BAA0B,GAAG,IAAAC,wBAAA,EAAmBH,iBAAnB,EAAsCT,aAAtC,CAAnC;EAEA,MAAMa,mBAAmB,GAAG,IAAAC,qCAAA,EAAeH,0BAAf,CAA5B;EACA,MAAMI,eAAe,GAAG,IAAAD,qCAAA,EAAeD,mBAAmB,CAACG,KAAnC,CAAxB;EAEA,MAAMC,mBAAmB,GAAG,IAAAC,aAAA,EAAO,KAAP,CAA5B;EAEA,MAAMC,gBAAgB,GAAG,IAAAL,qCAAA,EAAe,CAAf,CAAzB;EACA,MAAM,CAACM,OAAD,EAAUC,UAAV,IAAwB,IAAAC,eAAA,EAAS,KAAT,CAA9B;EAEA,MAAMC,aAAa,GAAG,IAAAC,uCAAA,EAAiB,OAAO;IAC1CC,SAAS,EAAE,CAAC;MAAEC,UAAU,EAAEX,eAAe,CAACC;IAA9B,CAAD,CAD+B;IAE1CW,OAAO,EAAER,gBAAgB,CAACH;EAFgB,CAAP,CAAjB,CAAtB;EAKA,MAAM1B,QAAQ,GAAG,EACb,GAAGM,gBADU;IAEbgC,KAAK,EAAEC,CAAC,CAACC,SAAF,CAAY,CAAZ,EAAelC,gBAAf,aAAeA,gBAAf,uBAAeA,gBAAgB,CAAEgC,KAAjC,IAA0CnD;EAFpC,CAAjB;;EAKA,MAAMsD,eAAe,GAAIC,KAAD,IAAoD;IACxE,IAAI,CAACf,mBAAmB,CAACgB,OAAzB,EAAkC;MAC9B,MAAMxB,iBAAiB,GAAG,IAAAC,wBAAA,EAAmBsB,KAAK,CAACE,WAAN,CAAkB5B,aAAlB,CAAgC6B,CAAnD,EAAsD9B,kBAAtD,CAA1B;MACA,MAAM+B,MAAM,GAAG,IAAAxB,wBAAA,EAAmBH,iBAAnB,EAAsCT,aAAtC,CAAf;;MAEA,IAAIoC,MAAM,GAAG,CAAT,IAAcrB,eAAe,CAACC,KAAhB,GAAwB,CAA1C,EAA6C;QACzCH,mBAAmB,CAACG,KAApB,GAA4B,CAA5B;QACAD,eAAe,CAACC,KAAhB,GAAwB,CAAxB;QACA;MACH;;MAED,IAAIoB,MAAM,GAAGpC,aAAT,IAA0Be,eAAe,CAACC,KAAhB,GAAwBhB,aAAtD,EAAqE;QACjEa,mBAAmB,CAACG,KAApB,GAA4BhB,aAA5B;QACAe,eAAe,CAACC,KAAhB,GAAwBhB,aAAxB;QACA;MACH;;MAEDa,mBAAmB,CAACG,KAApB,GAA4BoB,MAA5B;MACArB,eAAe,CAACC,KAAhB,GAAwBoB,MAAxB;IACH,CAlBD,MAkBO;MACHf,UAAU,CAAC,IAAD,CAAV;IACH;EACJ,CAtBD;;EAwBA,MAAMgB,sBAAsB,GAAG,MAAMpB,mBAAmB,CAACgB,OAAzD;;EAEA,IAAAK,0BAAA,EACI3C,GADJ,EAEI,OAAO;IACH0C,sBADG;IAEHN,eAFG;IAGHV;EAHG,CAAP,CAFJ,EAOI,EAPJ;;EAUA,MAAMkB,YAAY,GAAG,MAAM;IACvB,MAAM9B,iBAAiB,GAAG,IAAAC,wBAAA,EAAmBK,eAAe,CAACC,KAAnC,EAA0ChB,aAA1C,CAA1B;IACA,MAAMoC,MAAM,GAAG,IAAAxB,wBAAA,EAAmBH,iBAAnB,EAAsCJ,kBAAtC,CAAf;IAEAJ,qBAAqB,CAACmC,MAAD,CAArB;EACH,CALD;;EAOA,MAAMI,sBAAsB,GAAIxB,KAAD,IAAoBC,mBAAmB,CAACgB,OAApB,GAA8BjB,KAAjF;;EAEA,MAAMyB,GAAG,GAAGC,kCAAA,CAAQC,GAAR,GACPC,OADO,CACEC,CAAD,IAAO;IACZ9B,eAAe,CAACC,KAAhB,GAAwBH,mBAAmB,CAACG,KAA5C;IACA,IAAA8B,8BAAA,EAAQN,sBAAR,EAAgC,IAAhC;EACH,CAJO,EAKPO,QALO,CAKGF,CAAD,IAAO;IACb,IAAI9B,eAAe,CAACC,KAAhB,IAAyB,CAAzB,IAA8B6B,CAAC,CAACG,YAAF,GAAiB,CAAnD,EAAsD;MAClDjC,eAAe,CAACC,KAAhB,GAAwB,CAAxB;MACA;IACH;;IAED,IAAID,eAAe,CAACC,KAAhB,IAAyBhB,aAAzB,IAA0C6C,CAAC,CAACG,YAAF,GAAiB,CAA/D,EAAkE;MAC9DjC,eAAe,CAACC,KAAhB,GAAwBhB,aAAxB;MACA;IACH;;IAEDe,eAAe,CAACC,KAAhB,GAAwBH,mBAAmB,CAACG,KAApB,GAA4B6B,CAAC,CAACG,YAAtD;IAEA,IAAAF,8BAAA,EAAQP,YAAR;EACH,CAnBO,EAoBPU,UApBO,CAoBKJ,CAAD,IAAO;IACfhC,mBAAmB,CAACG,KAApB,GAA4BD,eAAe,CAACC,KAA5C;IACA,IAAA8B,8BAAA,EAAQN,sBAAR,EAAgC,KAAhC;EACH,CAvBO,CAAZ;;EAyBA,MAAMU,IAAI,GAAG,MAAM/B,gBAAgB,CAACH,KAAjB,GAAyB,IAAAmC,gCAAA,EAAU,CAAV,EAAa,IAAAC,iCAAA,EAAW,CAAX,EAAc;IAAEC,QAAQ,EAAEnD,gBAAgB,CAACC;EAA7B,CAAd,CAAb,CAA5C;;EAEA,MAAMmD,IAAI,GAAG,MAAMnC,gBAAgB,CAACH,KAAjB,GAAyB,IAAAmC,gCAAA,EAAU,CAAV,EAAa,IAAAC,iCAAA,EAAW,CAAX,EAAc;IAAEC,QAAQ,EAAEnD,gBAAgB,CAACE;EAA7B,CAAd,CAAb,CAA5C;;EAEA,IAAAmD,gBAAA,EAAU,MAAM;IACZ,IAAInC,OAAJ,EAAa;MACTL,eAAe,CAACC,KAAhB,GAAwBH,mBAAmB,CAACG,KAA5C;MACAsC,IAAI;IACP,CAHD,MAGO;MACHJ,IAAI;IACP;EACJ,CAPD,EAOG,CAAC9B,OAAD,CAPH;EASA,oBACI,6BAAC,iBAAD;IACI,KAAK,EAAE,CACH;MAAErC,MAAM,EAAEiB;IAAV,CADG,EAEHtB,MAAM,CAACW,IAFJ,EAGHC,QAHG;EADX,gBAOI,6BAAC,0CAAD;IAAiB,OAAO,EAAEmD;EAA1B,gBACI,6BAAC,8BAAD,CAAU,IAAV;IAAe,KAAK,EAAE,CAClBlB,aADkB,EAElB7C,MAAM,CAACG,SAFW;EAAtB,gBAII,6BAAC,gBAAD;IACI,IAAI,EAAE,SADV;IAEI,MAAM,EAAE,EAFZ;IAGI,KAAK,EAAE;EAHX,EAJJ,eASI,6BAAC,kBAAD;IACI,IAAI,EAAE,SADV;IAEI,MAAM,EAAE,EAFZ;IAGI,KAAK,EAAE;EAHX,EATJ,CADJ,CAPJ,CADJ;AA2BH,CAjJkB,CAAnB;;eAmJeU,U"}
1
+ {"version":3,"names":["INDICATOR_WIDTH","styles","StyleSheet","create","indicator","width","height","backgroundColor","flexDirection","alignItems","justifyContent","borderRadius","view","position","FastScroll","React","forwardRef","props","ref","absolutePosition","additionalLength","contentLength","initialScrollPercentage","movementRange","scrollContentToOffset","visibleDurations","hideMillis","showMillis","totalContentLength","contentOffset","Math","floor","contentPercentage","offsetToPercentage","initialLastIndicatorOffset","percentageToOffset","lastIndicatorOffset","useSharedValue","indicatorOffset","value","isIndicatorDragging","useRef","indicatorOpacity","visible","setVisible","useState","animatedStyle","useAnimatedStyle","transform","translateY","opacity","right","R","defaultTo","onContentScroll","useCallback","event","current","nativeEvent","y","offset","getIsIndicatorDragging","useImperativeHandle","handleUpdate","setIsIndicatorDragging","pan","Gesture","Pan","onBegin","e","runOnJS","onUpdate","translationY","onFinalize","hide","withDelay","withTiming","duration","show","useEffect"],"sources":["FastScroll.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport * as R from 'ramda';\nimport { NativeScrollEvent, NativeSyntheticEvent, View } from 'react-native';\nimport { Gesture, GestureDetector } from 'react-native-gesture-handler';\nimport Animated, { runOnJS, useAnimatedStyle, useSharedValue, withDelay, withTiming } from 'react-native-reanimated';\nimport { ChevronDown, ChevronUp } from '@fountain-ui/icons';\nimport { StyleSheet } from '@fountain-ui/core';\nimport FastScrollProps from './FastScrollProps';\nimport { offsetToPercentage, percentageToOffset } from './util';\n\nconst INDICATOR_WIDTH = 28;\n\nconst styles = StyleSheet.create({\n indicator: {\n width: INDICATOR_WIDTH,\n height: 48,\n backgroundColor: '#767676',\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: 16,\n },\n view: {\n position: 'absolute',\n width: 0,\n },\n});\n\nconst FastScroll = React.forwardRef((props: FastScrollProps, ref) => {\n const {\n absolutePosition,\n additionalLength = 0,\n contentLength,\n initialScrollPercentage = 0,\n movementRange,\n scrollContentToOffset,\n visibleDurations = { hideMillis: 200, showMillis: 350 },\n } = props;\n\n const totalContentLength = contentLength + additionalLength;\n\n const contentOffset = Math.floor((initialScrollPercentage / 100) * contentLength);\n const contentPercentage = offsetToPercentage(contentOffset, totalContentLength);\n const initialLastIndicatorOffset = percentageToOffset(contentPercentage, movementRange);\n\n const lastIndicatorOffset = useSharedValue(initialLastIndicatorOffset);\n const indicatorOffset = useSharedValue(lastIndicatorOffset.value);\n\n const isIndicatorDragging = useRef(false);\n\n const indicatorOpacity = useSharedValue(0);\n const [visible, setVisible] = useState(false);\n\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: indicatorOffset.value }],\n opacity: indicatorOpacity.value,\n }));\n\n const position = {\n ...absolutePosition,\n right: R.defaultTo(0)(absolutePosition?.right) + INDICATOR_WIDTH,\n };\n\n const onContentScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {\n if (!isIndicatorDragging.current) {\n const contentPercentage = offsetToPercentage(event.nativeEvent.contentOffset.y, totalContentLength);\n const offset = percentageToOffset(contentPercentage, movementRange);\n\n if (offset < 0 || indicatorOffset.value < 0) {\n lastIndicatorOffset.value = 0;\n indicatorOffset.value = 0;\n return;\n }\n\n if (offset > movementRange || indicatorOffset.value > movementRange) {\n lastIndicatorOffset.value = movementRange;\n indicatorOffset.value = movementRange;\n return;\n }\n\n lastIndicatorOffset.value = offset;\n indicatorOffset.value = offset;\n } else {\n setVisible(true);\n }\n }, [totalContentLength, movementRange]);\n\n const getIsIndicatorDragging = () => isIndicatorDragging.current;\n\n useImperativeHandle(\n ref,\n () => ({\n getIsIndicatorDragging,\n onContentScroll,\n setVisible,\n }),\n [onContentScroll],\n );\n\n const handleUpdate = () => {\n const contentPercentage = offsetToPercentage(indicatorOffset.value, movementRange);\n const offset = percentageToOffset(contentPercentage, totalContentLength);\n\n scrollContentToOffset(offset);\n };\n\n const setIsIndicatorDragging = (value: boolean) => isIndicatorDragging.current = value;\n\n const pan = Gesture.Pan()\n .onBegin((e) => {\n indicatorOffset.value = lastIndicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(true);\n })\n .onUpdate((e) => {\n if (indicatorOffset.value <= 0 && e.translationY < 0) {\n indicatorOffset.value = 0;\n return;\n }\n\n if (indicatorOffset.value >= movementRange && e.translationY > 0) {\n indicatorOffset.value = movementRange;\n return;\n }\n\n indicatorOffset.value = lastIndicatorOffset.value + e.translationY;\n\n runOnJS(handleUpdate)();\n })\n .onFinalize((e) => {\n lastIndicatorOffset.value = indicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(false);\n });\n\n const hide = () => indicatorOpacity.value = withDelay(0, withTiming(0, { duration: visibleDurations.hideMillis }));\n\n const show = () => indicatorOpacity.value = withDelay(0, withTiming(1, { duration: visibleDurations.showMillis }));\n\n useEffect(() => {\n if (visible) {\n indicatorOffset.value = lastIndicatorOffset.value;\n show();\n } else {\n hide();\n }\n }, [visible]);\n\n return (\n <View\n style={[\n { height: movementRange },\n styles.view,\n position,\n ]}\n >\n <GestureDetector gesture={pan}>\n <Animated.View style={[\n animatedStyle,\n styles.indicator,\n ]}>\n <ChevronUp\n fill={'#ededed'}\n height={20}\n width={20}\n />\n <ChevronDown\n fill={'#ededed'}\n height={20}\n width={20}\n />\n </Animated.View>\n </GestureDetector>\n </View>\n );\n});\n\nexport default FastScroll;"],"mappings":"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"}
@@ -42,9 +42,10 @@ export default function ComicViewer(props) {
42
42
  autoHandleErrorCount = 3,
43
43
  fastScrollOptions,
44
44
  initialNumToRender = 1,
45
+ initialNumToCreate,
45
46
  initialScrollPercentage = 0,
46
47
  itemVisiblePercentThreshold = 0,
47
- intrinsicImages,
48
+ intrinsicImages: originalIntrinsicImages,
48
49
  maxContentWidth = MAXIMUM_WIDTH,
49
50
  onItemPress,
50
51
  onScroll,
@@ -55,11 +56,15 @@ export default function ComicViewer(props) {
55
56
  windowSize = 3,
56
57
  ...otherProps
57
58
  } = props;
59
+ const initialCreateCount = initialNumToCreate ? R.min(initialNumToCreate, initialNumToRender) : undefined;
60
+ const initialIntrinsicImages = initialCreateCount ? R.take(initialCreateCount, originalIntrinsicImages) : originalIntrinsicImages;
61
+ const [intrinsicImages, setIntrinsicImages] = useState(initialIntrinsicImages);
58
62
  const fastScrollRef = fastScrollOptions === null || fastScrollOptions === void 0 ? void 0 : fastScrollOptions.ref;
59
63
  const flatListRef = useRef(null);
60
64
  const actualImageWidth = Math.min(viewportWidth, maxContentWidth);
61
65
  const initialImageStates = useMemo(() => R.map(createInitialImageState, intrinsicImages), []);
62
66
  const imageStatesRef = useRef(initialImageStates);
67
+ const shouldWaitInitialCreate = useRef(!R.isNil(initialCreateCount));
63
68
 
64
69
  const mapImageStatesToItemStates = imageStates => {
65
70
  return imageStates.map((image, index) => mapImageStateToItemState(index, image, autoHandleErrorCount));
@@ -76,7 +81,7 @@ export default function ComicViewer(props) {
76
81
  height: isNaN(height) ? 0 : height
77
82
  };
78
83
  }, intrinsicImages);
79
- }, [actualImageWidth]);
84
+ }, [actualImageWidth, intrinsicImages]);
80
85
  const layoutFromDimensions = useCallback(() => {
81
86
  const itemHeights = R.map(dimension => dimension.height, renderedDimensions);
82
87
  const [totalHeight, heightAccum] = getHeightAccum(itemHeights);
@@ -148,13 +153,29 @@ export default function ComicViewer(props) {
148
153
  });
149
154
  };
150
155
 
151
- const renderItem = useCallback(_ref2 => {
156
+ const updateIntrinsicImages = useCallback(() => {
157
+ const isInitialCreateFinish = R.all(imageState => imageState.urlState.validity !== 'unknown')(imageStatesRef.current);
158
+
159
+ if (!isInitialCreateFinish || !shouldWaitInitialCreate.current) {
160
+ return;
161
+ }
162
+
163
+ setIntrinsicImages(originalIntrinsicImages);
164
+ const newImageStates = R.map(createInitialImageState, originalIntrinsicImages);
165
+ imageStatesRef.current = R.map(_ref2 => {
166
+ let [, state] = _ref2;
167
+ return state;
168
+ })(R.toPairs(R.mergeDeepLeft(imageStatesRef.current, newImageStates)));
169
+ setItemStates(mapImageStatesToItemStates(imageStatesRef.current));
170
+ shouldWaitInitialCreate.current = false;
171
+ }, [originalIntrinsicImages, createInitialImageState, mapImageStatesToItemStates]);
172
+ const renderItem = useCallback(_ref3 => {
152
173
  var _renderedDimensions$i, _renderedDimensions$i2;
153
174
 
154
175
  let {
155
176
  item,
156
177
  index
157
- } = _ref2;
178
+ } = _ref3;
158
179
 
159
180
  const handleError = () => {
160
181
  onError && onError();
@@ -177,6 +198,7 @@ export default function ComicViewer(props) {
177
198
  return;
178
199
  }
179
200
 
201
+ updateIntrinsicImages();
180
202
  updateTryRenderingMillis();
181
203
  };
182
204
 
@@ -199,6 +221,7 @@ export default function ComicViewer(props) {
199
221
 
200
222
  return imageState;
201
223
  });
224
+ updateIntrinsicImages();
202
225
  };
203
226
 
204
227
  return /*#__PURE__*/React.createElement(ViewerItem, {
@@ -213,7 +236,7 @@ export default function ComicViewer(props) {
213
236
  height: ((_renderedDimensions$i2 = renderedDimensions[index]) === null || _renderedDimensions$i2 === void 0 ? void 0 : _renderedDimensions$i2.height) ?? 0,
214
237
  reloadButtonVisible: item.reloadButtonVisible
215
238
  });
216
- }, [onItemPress, renderedDimensions]);
239
+ }, [onItemPress, renderedDimensions, updateIntrinsicImages]);
217
240
  useEffect(() => {
218
241
  const scroll = () => {
219
242
  const offset = Math.floor(initialScrollPercentage / 100 * totalHeight);
@@ -1 +1 @@
1
- {"version":3,"names":["React","useCallback","useEffect","useMemo","useRef","useState","FlatList","Platform","R","ViewerItem","FastScroll","appender","left","right","getHeightAccum","heights","mapAccum","keyExtractor","item","String","index","createInitialImageState","image","totalErrorCount","dimension","tryRenderingMillis","urlState","url","validity","mapImageStateToItemState","imageState","autoHandleErrorCount","imageKey","reloadButtonVisible","mapIndexed","addIndex","map","MAXIMUM_WIDTH","ComicViewer","props","debounceMillis","fastScrollOptions","initialNumToRender","initialScrollPercentage","itemVisiblePercentThreshold","intrinsicImages","maxContentWidth","onItemPress","onScroll","onError","onReloadPress","viewportWidth","invisiblePaddingTop","windowSize","otherProps","fastScrollRef","ref","flatListRef","actualImageWidth","Math","min","initialImageStates","imageStatesRef","mapImageStatesToItemStates","imageStates","itemStates","setItemStates","current","renderedDimensions","intrinsicImage","height","width","isNaN","layoutFromDimensions","itemHeights","totalHeight","heightAccum","itemOffsets","prepend","getItemLayout","data","length","offset","viewabilityConfig","updateImageState","updateFunction","prevImageStates","newImageStates","prevItemStates","newItemStates","equals","updateTryRenderingMillis","Date","getTime","i","onViewableItemsChanged","viewableItems","handleScroll","event","onContentScroll","scrollContentToOffset","scrollToOffset","animated","renderItem","handleError","handleReloadPress","onLoad","undefined","scroll","floor","timeoutId","OS","setTimeout","clearTimeout"],"sources":["ComicViewer.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { FlatList, ListRenderItem, NativeScrollEvent, NativeSyntheticEvent, Platform, ViewToken } from 'react-native';\nimport * as R from 'ramda';\nimport { default as ComicViewerProps, Dimension, IntrinsicImage } from './ComicViewerProps';\nimport ViewerItem from './ViewerItem';\nimport FastScroll from './FastScroll';\n\nconst appender = (left: number, right: number): [number, number] => [left + right, left + right];\nconst getHeightAccum = (heights: number[]): [number, number[]] => R.mapAccum(appender, 0, heights);\n\nconst keyExtractor = <T, >(item: ItemState) => String(item.index);\n\ninterface UrlState {\n url: string;\n validity: 'valid' | 'invalid' | 'unknown';\n}\n\ninterface ImageState {\n urlState: UrlState;\n totalErrorCount: number;\n dimension: Dimension;\n tryRenderingMillis: number;\n}\n\ninterface ItemState {\n index: number;\n url?: string;\n imageKey: string;\n reloadButtonVisible: boolean;\n dimension: Dimension;\n}\n\nconst createInitialImageState = (image: IntrinsicImage): ImageState => ({\n totalErrorCount: 0,\n dimension: image.dimension,\n tryRenderingMillis: 0,\n urlState: {\n url: image.url,\n validity: 'unknown',\n },\n});\n\nconst mapImageStateToItemState = (\n index: number,\n imageState: ImageState,\n autoHandleErrorCount: number,\n): ItemState => ({\n index,\n url: imageState.urlState?.url,\n imageKey: `${imageState.tryRenderingMillis}-${index}`,\n reloadButtonVisible: (imageState.urlState?.validity !== 'valid') && imageState.totalErrorCount >= autoHandleErrorCount,\n dimension: imageState.dimension,\n});\n\nconst mapIndexed = R.addIndex<IntrinsicImage>(R.map);\n\nconst MAXIMUM_WIDTH = 720;\n\nexport default function ComicViewer(props: ComicViewerProps) {\n const {\n debounceMillis = 100,\n autoHandleErrorCount = 3,\n fastScrollOptions,\n initialNumToRender = 1,\n initialScrollPercentage = 0,\n itemVisiblePercentThreshold = 0,\n intrinsicImages,\n maxContentWidth = MAXIMUM_WIDTH,\n onItemPress,\n onScroll,\n onError,\n onReloadPress,\n viewportWidth,\n invisiblePaddingTop = 0,\n windowSize = 3,\n ...otherProps\n } = props;\n\n const fastScrollRef = fastScrollOptions?.ref;\n\n const flatListRef = useRef<FlatList>(null);\n\n const actualImageWidth = Math.min(viewportWidth, maxContentWidth);\n\n const initialImageStates = useMemo<Array<ImageState>>(() => R.map(createInitialImageState, intrinsicImages), []);\n\n const imageStatesRef = useRef<Array<ImageState>>(initialImageStates);\n\n const mapImageStatesToItemStates = (imageStates: Array<ImageState>): Array<ItemState> => {\n return imageStates.map((image, index) => mapImageStateToItemState(\n index, image, autoHandleErrorCount,\n ));\n };\n\n const [itemStates, setItemStates] = useState<Array<ItemState>>(() => {\n return mapImageStatesToItemStates(imageStatesRef.current);\n });\n\n const renderedDimensions = useMemo<Array<Dimension>>(() => {\n return mapIndexed((intrinsicImage, index) => {\n const height = (intrinsicImage.dimension.height * actualImageWidth) / intrinsicImage.dimension.width + (index === 0 ? invisiblePaddingTop : 0);\n\n return {\n width: actualImageWidth,\n height: isNaN(height) ? 0 : height,\n };\n }, intrinsicImages);\n }, [actualImageWidth]);\n\n const layoutFromDimensions = useCallback(() => {\n const itemHeights = R.map(dimension => dimension.height, renderedDimensions);\n const [totalHeight, heightAccum] = getHeightAccum(itemHeights);\n const itemOffsets = R.prepend(0, heightAccum);\n\n const getItemLayout = (data: any, index: number) => ({\n index,\n length: itemHeights[index],\n offset: itemOffsets[index],\n });\n\n return {\n totalHeight,\n getItemLayout,\n };\n }, [renderedDimensions]);\n\n const { totalHeight, getItemLayout } = layoutFromDimensions();\n\n const viewabilityConfig = useMemo(() => ({\n itemVisiblePercentThreshold,\n }), [itemVisiblePercentThreshold]);\n\n const updateImageState = (updateFunction: (prev: ImageState, index: number) => ImageState) => {\n const prevImageStates = imageStatesRef.current;\n const newImageStates = prevImageStates.map(updateFunction);\n\n imageStatesRef.current = newImageStates;\n\n setItemStates(prevItemStates => {\n const newItemStates = mapImageStatesToItemStates(newImageStates);\n\n return R.equals(prevItemStates, newItemStates) ? prevItemStates : newItemStates;\n });\n };\n\n const updateTryRenderingMillis = () => {\n const tryRenderingMillis = new Date().getTime();\n\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (urlState?.validity === 'invalid') {\n return {\n ...imageState,\n tryRenderingMillis,\n };\n }\n\n return imageState;\n });\n };\n const onViewableItemsChanged = useRef(({ viewableItems }: { viewableItems: Array<ViewToken> }) => {\n updateTryRenderingMillis();\n });\n\n const handleScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {\n fastScrollRef?.current?.onContentScroll(event);\n\n onScroll?.(event);\n }, [onScroll]);\n\n const scrollContentToOffset = (offset: number) => {\n flatListRef.current?.scrollToOffset({\n offset,\n animated: false,\n });\n };\n\n const renderItem: ListRenderItem<ItemState> = useCallback(({ item, index }) => {\n const handleError = () => {\n onError && onError();\n\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index) {\n return {\n ...imageState,\n totalErrorCount: imageState.totalErrorCount + 1,\n urlState: {\n ...urlState,\n validity: 'invalid',\n },\n };\n }\n\n return imageState;\n });\n\n if (item.reloadButtonVisible) {\n return;\n }\n\n updateTryRenderingMillis();\n };\n\n const handleReloadPress = () => {\n onReloadPress && onReloadPress();\n\n updateTryRenderingMillis();\n };\n\n const onLoad = () => {\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index && urlState !== undefined) {\n return {\n ...imageState,\n urlState: {\n ...urlState,\n validity: 'valid',\n },\n };\n }\n\n return imageState;\n });\n };\n\n return (\n <ViewerItem\n onError={handleError}\n onLoad={onLoad}\n onPress={onItemPress}\n onReloadPress={handleReloadPress}\n url={item.url}\n imageKey={item.imageKey}\n invisiblePaddingTop={index === 0 ? invisiblePaddingTop : 0}\n width={renderedDimensions[index]?.width ?? 0}\n height={renderedDimensions[index]?.height ?? 0}\n reloadButtonVisible={item.reloadButtonVisible}\n />\n );\n }, [onItemPress, renderedDimensions]);\n\n useEffect(() => {\n const scroll = () => {\n const offset = Math.floor((initialScrollPercentage / 100) * totalHeight);\n\n if (flatListRef.current) {\n flatListRef.current.scrollToOffset({ offset, animated: false });\n }\n };\n\n let timeoutId: NodeJS.Timeout | undefined = undefined;\n\n /**\n * @FIXME\n * scrollToOffset has issue(no effect) in useEffect hook on iOS.\n * ref: https://github.com/facebook/react-native/issues/35575\n */\n if (Platform.OS === 'ios') {\n timeoutId = setTimeout(scroll, 0);\n } else {\n scroll();\n }\n\n return () => {\n timeoutId && clearTimeout(timeoutId);\n }\n }, []);\n\n return (\n <React.Fragment>\n <FlatList\n data={itemStates}\n getItemLayout={getItemLayout}\n initialNumToRender={initialNumToRender}\n keyExtractor={keyExtractor}\n onViewableItemsChanged={onViewableItemsChanged.current}\n ref={flatListRef}\n renderItem={renderItem}\n viewabilityConfig={viewabilityConfig}\n windowSize={windowSize}\n onScroll={handleScroll}\n {...otherProps}\n />\n\n <FastScroll\n {...fastScrollOptions}\n contentLength={totalHeight}\n initialScrollPercentage={initialScrollPercentage}\n scrollContentToOffset={scrollContentToOffset}\n />\n </React.Fragment>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"names":["React","useCallback","useEffect","useMemo","useRef","useState","FlatList","Platform","R","ViewerItem","FastScroll","appender","left","right","getHeightAccum","heights","mapAccum","keyExtractor","item","String","index","createInitialImageState","image","totalErrorCount","dimension","tryRenderingMillis","urlState","url","validity","mapImageStateToItemState","imageState","autoHandleErrorCount","imageKey","reloadButtonVisible","mapIndexed","addIndex","map","MAXIMUM_WIDTH","ComicViewer","props","debounceMillis","fastScrollOptions","initialNumToRender","initialNumToCreate","initialScrollPercentage","itemVisiblePercentThreshold","intrinsicImages","originalIntrinsicImages","maxContentWidth","onItemPress","onScroll","onError","onReloadPress","viewportWidth","invisiblePaddingTop","windowSize","otherProps","initialCreateCount","min","undefined","initialIntrinsicImages","take","setIntrinsicImages","fastScrollRef","ref","flatListRef","actualImageWidth","Math","initialImageStates","imageStatesRef","shouldWaitInitialCreate","isNil","mapImageStatesToItemStates","imageStates","itemStates","setItemStates","current","renderedDimensions","intrinsicImage","height","width","isNaN","layoutFromDimensions","itemHeights","totalHeight","heightAccum","itemOffsets","prepend","getItemLayout","data","length","offset","viewabilityConfig","updateImageState","updateFunction","prevImageStates","newImageStates","prevItemStates","newItemStates","equals","updateTryRenderingMillis","Date","getTime","i","onViewableItemsChanged","viewableItems","handleScroll","event","onContentScroll","scrollContentToOffset","scrollToOffset","animated","updateIntrinsicImages","isInitialCreateFinish","all","state","toPairs","mergeDeepLeft","renderItem","handleError","handleReloadPress","onLoad","scroll","floor","timeoutId","OS","setTimeout","clearTimeout"],"sources":["ComicViewer.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { FlatList, ListRenderItem, NativeScrollEvent, NativeSyntheticEvent, Platform, ViewToken } from 'react-native';\nimport * as R from 'ramda';\nimport { default as ComicViewerProps, Dimension, IntrinsicImage } from './ComicViewerProps';\nimport ViewerItem from './ViewerItem';\nimport FastScroll from './FastScroll';\n\nconst appender = (left: number, right: number): [number, number] => [left + right, left + right];\nconst getHeightAccum = (heights: number[]): [number, number[]] => R.mapAccum(appender, 0, heights);\n\nconst keyExtractor = <T, >(item: ItemState) => String(item.index);\n\ninterface UrlState {\n url: string;\n validity: 'valid' | 'invalid' | 'unknown';\n}\n\ninterface ImageState {\n urlState: UrlState;\n totalErrorCount: number;\n dimension: Dimension;\n tryRenderingMillis: number;\n}\n\ninterface ItemState {\n index: number;\n url?: string;\n imageKey: string;\n reloadButtonVisible: boolean;\n dimension: Dimension;\n}\n\nconst createInitialImageState = (image: IntrinsicImage): ImageState => ({\n totalErrorCount: 0,\n dimension: image.dimension,\n tryRenderingMillis: 0,\n urlState: {\n url: image.url,\n validity: 'unknown',\n },\n});\n\nconst mapImageStateToItemState = (\n index: number,\n imageState: ImageState,\n autoHandleErrorCount: number,\n): ItemState => ({\n index,\n url: imageState.urlState?.url,\n imageKey: `${imageState.tryRenderingMillis}-${index}`,\n reloadButtonVisible: (imageState.urlState?.validity !== 'valid') && imageState.totalErrorCount >= autoHandleErrorCount,\n dimension: imageState.dimension,\n});\n\nconst mapIndexed = R.addIndex<IntrinsicImage>(R.map);\n\nconst MAXIMUM_WIDTH = 720;\n\nexport default function ComicViewer(props: ComicViewerProps) {\n const {\n debounceMillis = 100,\n autoHandleErrorCount = 3,\n fastScrollOptions,\n initialNumToRender = 1,\n initialNumToCreate,\n initialScrollPercentage = 0,\n itemVisiblePercentThreshold = 0,\n intrinsicImages: originalIntrinsicImages,\n maxContentWidth = MAXIMUM_WIDTH,\n onItemPress,\n onScroll,\n onError,\n onReloadPress,\n viewportWidth,\n invisiblePaddingTop = 0,\n windowSize = 3,\n ...otherProps\n } = props;\n\n const initialCreateCount = initialNumToCreate ? R.min(initialNumToCreate, initialNumToRender) : undefined;\n const initialIntrinsicImages = initialCreateCount ? R.take(initialCreateCount, originalIntrinsicImages) : originalIntrinsicImages;\n const [intrinsicImages, setIntrinsicImages] = useState(initialIntrinsicImages);\n\n const fastScrollRef = fastScrollOptions?.ref;\n\n const flatListRef = useRef<FlatList>(null);\n\n const actualImageWidth = Math.min(viewportWidth, maxContentWidth);\n\n const initialImageStates = useMemo<Array<ImageState>>(() => R.map(createInitialImageState, intrinsicImages), []);\n\n const imageStatesRef = useRef<Array<ImageState>>(initialImageStates);\n\n const shouldWaitInitialCreate = useRef<Boolean>(!R.isNil(initialCreateCount));\n\n const mapImageStatesToItemStates = (imageStates: Array<ImageState>): Array<ItemState> => {\n return imageStates.map((image, index) => mapImageStateToItemState(\n index, image, autoHandleErrorCount,\n ));\n };\n\n const [itemStates, setItemStates] = useState<Array<ItemState>>(() => {\n return mapImageStatesToItemStates(imageStatesRef.current);\n });\n\n const renderedDimensions = useMemo<Array<Dimension>>(() => {\n return mapIndexed((intrinsicImage, index) => {\n const height = (intrinsicImage.dimension.height * actualImageWidth) / intrinsicImage.dimension.width + (index === 0 ? invisiblePaddingTop : 0);\n\n return {\n width: actualImageWidth,\n height: isNaN(height) ? 0 : height,\n };\n }, intrinsicImages);\n }, [actualImageWidth, intrinsicImages]);\n\n const layoutFromDimensions = useCallback(() => {\n const itemHeights = R.map(dimension => dimension.height, renderedDimensions);\n const [totalHeight, heightAccum] = getHeightAccum(itemHeights);\n const itemOffsets = R.prepend(0, heightAccum);\n\n const getItemLayout = (data: any, index: number) => ({\n index,\n length: itemHeights[index],\n offset: itemOffsets[index],\n });\n\n return {\n totalHeight,\n getItemLayout,\n };\n }, [renderedDimensions]);\n\n const { totalHeight, getItemLayout } = layoutFromDimensions();\n\n const viewabilityConfig = useMemo(() => ({\n itemVisiblePercentThreshold,\n }), [itemVisiblePercentThreshold]);\n\n const updateImageState = (updateFunction: (prev: ImageState, index: number) => ImageState) => {\n const prevImageStates = imageStatesRef.current;\n const newImageStates = prevImageStates.map(updateFunction);\n\n imageStatesRef.current = newImageStates;\n\n setItemStates(prevItemStates => {\n const newItemStates = mapImageStatesToItemStates(newImageStates);\n\n return R.equals(prevItemStates, newItemStates) ? prevItemStates : newItemStates;\n });\n };\n\n const updateTryRenderingMillis = () => {\n const tryRenderingMillis = new Date().getTime();\n\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (urlState?.validity === 'invalid') {\n return {\n ...imageState,\n tryRenderingMillis,\n };\n }\n\n return imageState;\n });\n };\n const onViewableItemsChanged = useRef(({ viewableItems }: { viewableItems: Array<ViewToken> }) => {\n updateTryRenderingMillis();\n });\n\n const handleScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {\n fastScrollRef?.current?.onContentScroll(event);\n\n onScroll?.(event);\n }, [onScroll]);\n\n const scrollContentToOffset = (offset: number) => {\n flatListRef.current?.scrollToOffset({\n offset,\n animated: false,\n });\n };\n\n const updateIntrinsicImages = useCallback(() => {\n const isInitialCreateFinish = R.all((imageState: ImageState) => imageState.urlState.validity !== 'unknown')(imageStatesRef.current);\n\n if (!isInitialCreateFinish || !shouldWaitInitialCreate.current) {\n return;\n }\n\n setIntrinsicImages(originalIntrinsicImages);\n const newImageStates = R.map(createInitialImageState, originalIntrinsicImages);\n imageStatesRef.current = R.map(([, state]: [number, ImageState]) => state)(R.toPairs(R.mergeDeepLeft(imageStatesRef.current, newImageStates)));\n setItemStates(mapImageStatesToItemStates(imageStatesRef.current));\n\n shouldWaitInitialCreate.current = false;\n }, [originalIntrinsicImages, createInitialImageState, mapImageStatesToItemStates]);\n\n const renderItem: ListRenderItem<ItemState> = useCallback(({ item, index }) => {\n const handleError = () => {\n onError && onError();\n\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index) {\n return {\n ...imageState,\n totalErrorCount: imageState.totalErrorCount + 1,\n urlState: {\n ...urlState,\n validity: 'invalid',\n },\n };\n }\n\n return imageState;\n });\n\n if (item.reloadButtonVisible) {\n return;\n }\n\n updateIntrinsicImages();\n\n updateTryRenderingMillis();\n };\n\n const handleReloadPress = () => {\n onReloadPress && onReloadPress();\n\n updateTryRenderingMillis();\n };\n\n const onLoad = () => {\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index && urlState !== undefined) {\n return {\n ...imageState,\n urlState: {\n ...urlState,\n validity: 'valid',\n },\n };\n }\n\n return imageState;\n });\n\n updateIntrinsicImages();\n };\n\n return (\n <ViewerItem\n onError={handleError}\n onLoad={onLoad}\n onPress={onItemPress}\n onReloadPress={handleReloadPress}\n url={item.url}\n imageKey={item.imageKey}\n invisiblePaddingTop={index === 0 ? invisiblePaddingTop : 0}\n width={renderedDimensions[index]?.width ?? 0}\n height={renderedDimensions[index]?.height ?? 0}\n reloadButtonVisible={item.reloadButtonVisible}\n />\n );\n }, [onItemPress, renderedDimensions, updateIntrinsicImages]);\n\n useEffect(() => {\n const scroll = () => {\n const offset = Math.floor((initialScrollPercentage / 100) * totalHeight);\n\n if (flatListRef.current) {\n flatListRef.current.scrollToOffset({ offset, animated: false });\n }\n };\n\n let timeoutId: NodeJS.Timeout | undefined = undefined;\n\n /**\n * @FIXME\n * scrollToOffset has issue(no effect) in useEffect hook on iOS.\n * ref: https://github.com/facebook/react-native/issues/35575\n */\n if (Platform.OS === 'ios') {\n timeoutId = setTimeout(scroll, 0);\n } else {\n scroll();\n }\n\n return () => {\n timeoutId && clearTimeout(timeoutId);\n };\n }, []);\n\n return (\n <React.Fragment>\n <FlatList\n data={itemStates}\n getItemLayout={getItemLayout}\n initialNumToRender={initialNumToRender}\n keyExtractor={keyExtractor}\n onViewableItemsChanged={onViewableItemsChanged.current}\n ref={flatListRef}\n renderItem={renderItem}\n viewabilityConfig={viewabilityConfig}\n windowSize={windowSize}\n onScroll={handleScroll}\n {...otherProps}\n />\n\n <FastScroll\n {...fastScrollOptions}\n contentLength={totalHeight}\n initialScrollPercentage={initialScrollPercentage}\n scrollContentToOffset={scrollContentToOffset}\n />\n </React.Fragment>\n );\n};\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["ComicViewerProps.ts"],"sourcesContent":["import React from 'react';\nimport { ComponentProps } from '@fountain-ui/core';\nimport { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';\nimport { FastScrollOptions } from './FastScrollProps';\n\nexport interface Dimension {\n width: number;\n height: number;\n}\n\nexport interface IntrinsicImage {\n dimension: Dimension;\n url: string;\n}\n\nexport default interface ComicViewerProps extends ComponentProps <{\n /**\n * Delay Time to call the error handler.\n * @default 100\n */\n debounceMillis?: number;\n\n /**\n * How many times handle onError directly when item error occur\n * @default 3\n */\n autoHandleErrorCount?: number;\n\n /**\n * How many items to render in the initial batch.\n * @default 1\n */\n initialNumToRender?: number;\n\n /**\n * Start at initialScrollPercentage.\n * If over 100, scroll to end.\n * @default 0\n */\n initialScrollPercentage?: number;\n\n /**\n * The value for FlatList viewabilityConfig.itemVisiblePercentThreshold.\n * @default 0\n */\n itemVisiblePercentThreshold?: number;\n\n /**\n * Dimensions and url info of each Image considering viewport.\n */\n intrinsicImages: Array<IntrinsicImage>;\n\n /**\n * Need invisible paddingTop viewer vertically expanded.\n * @default 0\n */\n invisiblePaddingTop?: number;\n\n /**\n * Max value of contents image width size.\n * @default 720\n */\n maxContentWidth?: number;\n\n /**\n * Width of viewport.\n */\n viewportWidth: number;\n\n /**\n * The value for FlatList windowSize.\n * @default 3\n */\n windowSize?: number;\n\n /**\n * Options for fastscroll component.\n */\n fastScrollOptions: FastScrollOptions;\n\n /**\n * Handle scroll event.\n * @param event Scroll event.\n */\n onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;\n\n /**\n * Handle item press event.\n */\n onItemPress?: () => void;\n\n /**\n * Handle image loading fail event.\n */\n onError?: () => void;\n\n /**\n * Handle reload button press event.\n */\n onReloadPress?: () => void;\n\n /**\n * Component for comic viewer footer.\n */\n ListFooterComponent?: React.ReactElement;\n}> {}\n"],"mappings":""}
1
+ {"version":3,"names":[],"sources":["ComicViewerProps.ts"],"sourcesContent":["import React from 'react';\nimport { ComponentProps } from '@fountain-ui/core';\nimport { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';\nimport { FastScrollOptions } from './FastScrollProps';\n\nexport interface Dimension {\n width: number;\n height: number;\n}\n\nexport interface IntrinsicImage {\n dimension: Dimension;\n url: string;\n}\n\nexport default interface ComicViewerProps extends ComponentProps <{\n /**\n * Delay Time to call the error handler.\n * @default 100\n */\n debounceMillis?: number;\n\n /**\n * How many times handle onError directly when item error occur\n * @default 3\n */\n autoHandleErrorCount?: number;\n\n /**\n * How many items to render in the initial batch.\n * @default 1\n */\n initialNumToRender?: number;\n\n /**\n * How many items to create in the initial batch.\n * @default 1\n */\n initialNumToCreate?: number;\n\n /**\n * Start at initialScrollPercentage.\n * If over 100, scroll to end.\n * @default 0\n */\n initialScrollPercentage?: number;\n\n /**\n * The value for FlatList viewabilityConfig.itemVisiblePercentThreshold.\n * @default 0\n */\n itemVisiblePercentThreshold?: number;\n\n /**\n * Dimensions and url info of each Image considering viewport.\n */\n intrinsicImages: Array<IntrinsicImage>;\n\n /**\n * Need invisible paddingTop viewer vertically expanded.\n * @default 0\n */\n invisiblePaddingTop?: number;\n\n /**\n * Max value of contents image width size.\n * @default 720\n */\n maxContentWidth?: number;\n\n /**\n * Width of viewport.\n */\n viewportWidth: number;\n\n /**\n * The value for FlatList windowSize.\n * @default 3\n */\n windowSize?: number;\n\n /**\n * Options for fastscroll component.\n */\n fastScrollOptions: FastScrollOptions;\n\n /**\n * Handle scroll event.\n * @param event Scroll event.\n */\n onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;\n\n /**\n * Handle item press event.\n */\n onItemPress?: () => void;\n\n /**\n * Handle image loading fail event.\n */\n onError?: () => void;\n\n /**\n * Handle reload button press event.\n */\n onReloadPress?: () => void;\n\n /**\n * Component for comic viewer footer.\n */\n ListFooterComponent?: React.ReactElement;\n}> {}\n"],"mappings":""}
@@ -1,4 +1,4 @@
1
- import React, { useEffect, useImperativeHandle, useRef, useState } from 'react';
1
+ import React, { useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';
2
2
  import * as R from 'ramda';
3
3
  import { View } from 'react-native';
4
4
  import { Gesture, GestureDetector } from 'react-native-gesture-handler';
@@ -53,8 +53,7 @@ const FastScroll = /*#__PURE__*/React.forwardRef((props, ref) => {
53
53
  const position = { ...absolutePosition,
54
54
  right: R.defaultTo(0)(absolutePosition === null || absolutePosition === void 0 ? void 0 : absolutePosition.right) + INDICATOR_WIDTH
55
55
  };
56
-
57
- const onContentScroll = event => {
56
+ const onContentScroll = useCallback(event => {
58
57
  if (!isIndicatorDragging.current) {
59
58
  const contentPercentage = offsetToPercentage(event.nativeEvent.contentOffset.y, totalContentLength);
60
59
  const offset = percentageToOffset(contentPercentage, movementRange);
@@ -76,7 +75,7 @@ const FastScroll = /*#__PURE__*/React.forwardRef((props, ref) => {
76
75
  } else {
77
76
  setVisible(true);
78
77
  }
79
- };
78
+ }, [totalContentLength, movementRange]);
80
79
 
81
80
  const getIsIndicatorDragging = () => isIndicatorDragging.current;
82
81
 
@@ -84,7 +83,7 @@ const FastScroll = /*#__PURE__*/React.forwardRef((props, ref) => {
84
83
  getIsIndicatorDragging,
85
84
  onContentScroll,
86
85
  setVisible
87
- }), []);
86
+ }), [onContentScroll]);
88
87
 
89
88
  const handleUpdate = () => {
90
89
  const contentPercentage = offsetToPercentage(indicatorOffset.value, movementRange);
@@ -1 +1 @@
1
- {"version":3,"names":["React","useEffect","useImperativeHandle","useRef","useState","R","View","Gesture","GestureDetector","Animated","runOnJS","useAnimatedStyle","useSharedValue","withDelay","withTiming","ChevronDown","ChevronUp","StyleSheet","offsetToPercentage","percentageToOffset","INDICATOR_WIDTH","styles","create","indicator","width","height","backgroundColor","flexDirection","alignItems","justifyContent","borderRadius","view","position","FastScroll","forwardRef","props","ref","absolutePosition","additionalLength","contentLength","initialScrollPercentage","movementRange","scrollContentToOffset","visibleDurations","hideMillis","showMillis","totalContentLength","contentOffset","Math","floor","contentPercentage","initialLastIndicatorOffset","lastIndicatorOffset","indicatorOffset","value","isIndicatorDragging","indicatorOpacity","visible","setVisible","animatedStyle","transform","translateY","opacity","right","defaultTo","onContentScroll","event","current","nativeEvent","y","offset","getIsIndicatorDragging","handleUpdate","setIsIndicatorDragging","pan","Pan","onBegin","e","onUpdate","translationY","onFinalize","hide","duration","show"],"sources":["FastScroll.tsx"],"sourcesContent":["import React, { useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport * as R from 'ramda';\nimport { NativeScrollEvent, NativeSyntheticEvent, View } from 'react-native';\nimport { Gesture, GestureDetector } from 'react-native-gesture-handler';\nimport Animated, { runOnJS, useAnimatedStyle, useSharedValue, withDelay, withTiming } from 'react-native-reanimated';\nimport { ChevronDown, ChevronUp } from '@fountain-ui/icons';\nimport { StyleSheet } from '@fountain-ui/core';\nimport FastScrollProps from './FastScrollProps';\nimport { offsetToPercentage, percentageToOffset } from './util';\n\nconst INDICATOR_WIDTH = 28;\n\nconst styles = StyleSheet.create({\n indicator: {\n width: INDICATOR_WIDTH,\n height: 48,\n backgroundColor: '#767676',\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: 16,\n },\n view: {\n position: 'absolute',\n width: 0,\n },\n});\n\nconst FastScroll = React.forwardRef((props: FastScrollProps, ref) => {\n const {\n absolutePosition,\n additionalLength = 0,\n contentLength,\n initialScrollPercentage = 0,\n movementRange,\n scrollContentToOffset,\n visibleDurations = { hideMillis: 200, showMillis: 350 },\n } = props;\n\n const totalContentLength = contentLength + additionalLength;\n\n const contentOffset = Math.floor((initialScrollPercentage / 100) * contentLength);\n const contentPercentage = offsetToPercentage(contentOffset, totalContentLength);\n const initialLastIndicatorOffset = percentageToOffset(contentPercentage, movementRange);\n\n const lastIndicatorOffset = useSharedValue(initialLastIndicatorOffset);\n const indicatorOffset = useSharedValue(lastIndicatorOffset.value);\n\n const isIndicatorDragging = useRef(false);\n\n const indicatorOpacity = useSharedValue(0);\n const [visible, setVisible] = useState(false);\n\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: indicatorOffset.value }],\n opacity: indicatorOpacity.value,\n }));\n\n const position = {\n ...absolutePosition,\n right: R.defaultTo(0)(absolutePosition?.right) + INDICATOR_WIDTH,\n };\n\n const onContentScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {\n if (!isIndicatorDragging.current) {\n const contentPercentage = offsetToPercentage(event.nativeEvent.contentOffset.y, totalContentLength);\n const offset = percentageToOffset(contentPercentage, movementRange);\n\n if (offset < 0 || indicatorOffset.value < 0) {\n lastIndicatorOffset.value = 0;\n indicatorOffset.value = 0;\n return;\n }\n\n if (offset > movementRange || indicatorOffset.value > movementRange) {\n lastIndicatorOffset.value = movementRange;\n indicatorOffset.value = movementRange;\n return;\n }\n\n lastIndicatorOffset.value = offset;\n indicatorOffset.value = offset;\n } else {\n setVisible(true);\n }\n };\n\n const getIsIndicatorDragging = () => isIndicatorDragging.current;\n\n useImperativeHandle(\n ref,\n () => ({\n getIsIndicatorDragging,\n onContentScroll,\n setVisible,\n }),\n [],\n );\n\n const handleUpdate = () => {\n const contentPercentage = offsetToPercentage(indicatorOffset.value, movementRange);\n const offset = percentageToOffset(contentPercentage, totalContentLength);\n\n scrollContentToOffset(offset);\n };\n\n const setIsIndicatorDragging = (value: boolean) => isIndicatorDragging.current = value;\n\n const pan = Gesture.Pan()\n .onBegin((e) => {\n indicatorOffset.value = lastIndicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(true);\n })\n .onUpdate((e) => {\n if (indicatorOffset.value <= 0 && e.translationY < 0) {\n indicatorOffset.value = 0;\n return;\n }\n\n if (indicatorOffset.value >= movementRange && e.translationY > 0) {\n indicatorOffset.value = movementRange;\n return;\n }\n\n indicatorOffset.value = lastIndicatorOffset.value + e.translationY;\n\n runOnJS(handleUpdate)();\n })\n .onFinalize((e) => {\n lastIndicatorOffset.value = indicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(false);\n });\n\n const hide = () => indicatorOpacity.value = withDelay(0, withTiming(0, { duration: visibleDurations.hideMillis }));\n\n const show = () => indicatorOpacity.value = withDelay(0, withTiming(1, { duration: visibleDurations.showMillis }));\n\n useEffect(() => {\n if (visible) {\n indicatorOffset.value = lastIndicatorOffset.value;\n show();\n } else {\n hide();\n }\n }, [visible]);\n\n return (\n <View\n style={[\n { height: movementRange },\n styles.view,\n position,\n ]}\n >\n <GestureDetector gesture={pan}>\n <Animated.View style={[\n animatedStyle,\n styles.indicator,\n ]}>\n <ChevronUp\n fill={'#ededed'}\n height={20}\n width={20}\n />\n <ChevronDown\n fill={'#ededed'}\n height={20}\n width={20}\n />\n </Animated.View>\n </GestureDetector>\n </View>\n );\n});\n\nexport default FastScroll;"],"mappings":"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"}
1
+ {"version":3,"names":["React","useCallback","useEffect","useImperativeHandle","useRef","useState","R","View","Gesture","GestureDetector","Animated","runOnJS","useAnimatedStyle","useSharedValue","withDelay","withTiming","ChevronDown","ChevronUp","StyleSheet","offsetToPercentage","percentageToOffset","INDICATOR_WIDTH","styles","create","indicator","width","height","backgroundColor","flexDirection","alignItems","justifyContent","borderRadius","view","position","FastScroll","forwardRef","props","ref","absolutePosition","additionalLength","contentLength","initialScrollPercentage","movementRange","scrollContentToOffset","visibleDurations","hideMillis","showMillis","totalContentLength","contentOffset","Math","floor","contentPercentage","initialLastIndicatorOffset","lastIndicatorOffset","indicatorOffset","value","isIndicatorDragging","indicatorOpacity","visible","setVisible","animatedStyle","transform","translateY","opacity","right","defaultTo","onContentScroll","event","current","nativeEvent","y","offset","getIsIndicatorDragging","handleUpdate","setIsIndicatorDragging","pan","Pan","onBegin","e","onUpdate","translationY","onFinalize","hide","duration","show"],"sources":["FastScroll.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport * as R from 'ramda';\nimport { NativeScrollEvent, NativeSyntheticEvent, View } from 'react-native';\nimport { Gesture, GestureDetector } from 'react-native-gesture-handler';\nimport Animated, { runOnJS, useAnimatedStyle, useSharedValue, withDelay, withTiming } from 'react-native-reanimated';\nimport { ChevronDown, ChevronUp } from '@fountain-ui/icons';\nimport { StyleSheet } from '@fountain-ui/core';\nimport FastScrollProps from './FastScrollProps';\nimport { offsetToPercentage, percentageToOffset } from './util';\n\nconst INDICATOR_WIDTH = 28;\n\nconst styles = StyleSheet.create({\n indicator: {\n width: INDICATOR_WIDTH,\n height: 48,\n backgroundColor: '#767676',\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: 16,\n },\n view: {\n position: 'absolute',\n width: 0,\n },\n});\n\nconst FastScroll = React.forwardRef((props: FastScrollProps, ref) => {\n const {\n absolutePosition,\n additionalLength = 0,\n contentLength,\n initialScrollPercentage = 0,\n movementRange,\n scrollContentToOffset,\n visibleDurations = { hideMillis: 200, showMillis: 350 },\n } = props;\n\n const totalContentLength = contentLength + additionalLength;\n\n const contentOffset = Math.floor((initialScrollPercentage / 100) * contentLength);\n const contentPercentage = offsetToPercentage(contentOffset, totalContentLength);\n const initialLastIndicatorOffset = percentageToOffset(contentPercentage, movementRange);\n\n const lastIndicatorOffset = useSharedValue(initialLastIndicatorOffset);\n const indicatorOffset = useSharedValue(lastIndicatorOffset.value);\n\n const isIndicatorDragging = useRef(false);\n\n const indicatorOpacity = useSharedValue(0);\n const [visible, setVisible] = useState(false);\n\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: indicatorOffset.value }],\n opacity: indicatorOpacity.value,\n }));\n\n const position = {\n ...absolutePosition,\n right: R.defaultTo(0)(absolutePosition?.right) + INDICATOR_WIDTH,\n };\n\n const onContentScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {\n if (!isIndicatorDragging.current) {\n const contentPercentage = offsetToPercentage(event.nativeEvent.contentOffset.y, totalContentLength);\n const offset = percentageToOffset(contentPercentage, movementRange);\n\n if (offset < 0 || indicatorOffset.value < 0) {\n lastIndicatorOffset.value = 0;\n indicatorOffset.value = 0;\n return;\n }\n\n if (offset > movementRange || indicatorOffset.value > movementRange) {\n lastIndicatorOffset.value = movementRange;\n indicatorOffset.value = movementRange;\n return;\n }\n\n lastIndicatorOffset.value = offset;\n indicatorOffset.value = offset;\n } else {\n setVisible(true);\n }\n }, [totalContentLength, movementRange]);\n\n const getIsIndicatorDragging = () => isIndicatorDragging.current;\n\n useImperativeHandle(\n ref,\n () => ({\n getIsIndicatorDragging,\n onContentScroll,\n setVisible,\n }),\n [onContentScroll],\n );\n\n const handleUpdate = () => {\n const contentPercentage = offsetToPercentage(indicatorOffset.value, movementRange);\n const offset = percentageToOffset(contentPercentage, totalContentLength);\n\n scrollContentToOffset(offset);\n };\n\n const setIsIndicatorDragging = (value: boolean) => isIndicatorDragging.current = value;\n\n const pan = Gesture.Pan()\n .onBegin((e) => {\n indicatorOffset.value = lastIndicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(true);\n })\n .onUpdate((e) => {\n if (indicatorOffset.value <= 0 && e.translationY < 0) {\n indicatorOffset.value = 0;\n return;\n }\n\n if (indicatorOffset.value >= movementRange && e.translationY > 0) {\n indicatorOffset.value = movementRange;\n return;\n }\n\n indicatorOffset.value = lastIndicatorOffset.value + e.translationY;\n\n runOnJS(handleUpdate)();\n })\n .onFinalize((e) => {\n lastIndicatorOffset.value = indicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(false);\n });\n\n const hide = () => indicatorOpacity.value = withDelay(0, withTiming(0, { duration: visibleDurations.hideMillis }));\n\n const show = () => indicatorOpacity.value = withDelay(0, withTiming(1, { duration: visibleDurations.showMillis }));\n\n useEffect(() => {\n if (visible) {\n indicatorOffset.value = lastIndicatorOffset.value;\n show();\n } else {\n hide();\n }\n }, [visible]);\n\n return (\n <View\n style={[\n { height: movementRange },\n styles.view,\n position,\n ]}\n >\n <GestureDetector gesture={pan}>\n <Animated.View style={[\n animatedStyle,\n styles.indicator,\n ]}>\n <ChevronUp\n fill={'#ededed'}\n height={20}\n width={20}\n />\n <ChevronDown\n fill={'#ededed'}\n height={20}\n width={20}\n />\n </Animated.View>\n </GestureDetector>\n </View>\n );\n});\n\nexport default FastScroll;"],"mappings":"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"}
@@ -26,6 +26,11 @@ export default interface ComicViewerProps extends ComponentProps<{
26
26
  * @default 1
27
27
  */
28
28
  initialNumToRender?: number;
29
+ /**
30
+ * How many items to create in the initial batch.
31
+ * @default 1
32
+ */
33
+ initialNumToCreate?: number;
29
34
  /**
30
35
  * Start at initialScrollPercentage.
31
36
  * If over 100, scroll to end.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fountain-ui/lab",
3
- "version": "2.0.0-beta.66",
3
+ "version": "2.0.0-beta.68",
4
4
  "private": false,
5
5
  "author": "Fountain-UI Team",
6
6
  "description": "Incubator for Fountain-UI React components.",
@@ -70,5 +70,5 @@
70
70
  "publishConfig": {
71
71
  "access": "public"
72
72
  },
73
- "gitHead": "1f5f8496fa340a44a90faaba7a6a76990866bcab"
73
+ "gitHead": "4920ef572df215338c7050ceff96d12afd65fe8c"
74
74
  }
@@ -62,9 +62,10 @@ export default function ComicViewer(props: ComicViewerProps) {
62
62
  autoHandleErrorCount = 3,
63
63
  fastScrollOptions,
64
64
  initialNumToRender = 1,
65
+ initialNumToCreate,
65
66
  initialScrollPercentage = 0,
66
67
  itemVisiblePercentThreshold = 0,
67
- intrinsicImages,
68
+ intrinsicImages: originalIntrinsicImages,
68
69
  maxContentWidth = MAXIMUM_WIDTH,
69
70
  onItemPress,
70
71
  onScroll,
@@ -76,6 +77,10 @@ export default function ComicViewer(props: ComicViewerProps) {
76
77
  ...otherProps
77
78
  } = props;
78
79
 
80
+ const initialCreateCount = initialNumToCreate ? R.min(initialNumToCreate, initialNumToRender) : undefined;
81
+ const initialIntrinsicImages = initialCreateCount ? R.take(initialCreateCount, originalIntrinsicImages) : originalIntrinsicImages;
82
+ const [intrinsicImages, setIntrinsicImages] = useState(initialIntrinsicImages);
83
+
79
84
  const fastScrollRef = fastScrollOptions?.ref;
80
85
 
81
86
  const flatListRef = useRef<FlatList>(null);
@@ -86,6 +91,8 @@ export default function ComicViewer(props: ComicViewerProps) {
86
91
 
87
92
  const imageStatesRef = useRef<Array<ImageState>>(initialImageStates);
88
93
 
94
+ const shouldWaitInitialCreate = useRef<Boolean>(!R.isNil(initialCreateCount));
95
+
89
96
  const mapImageStatesToItemStates = (imageStates: Array<ImageState>): Array<ItemState> => {
90
97
  return imageStates.map((image, index) => mapImageStateToItemState(
91
98
  index, image, autoHandleErrorCount,
@@ -105,7 +112,7 @@ export default function ComicViewer(props: ComicViewerProps) {
105
112
  height: isNaN(height) ? 0 : height,
106
113
  };
107
114
  }, intrinsicImages);
108
- }, [actualImageWidth]);
115
+ }, [actualImageWidth, intrinsicImages]);
109
116
 
110
117
  const layoutFromDimensions = useCallback(() => {
111
118
  const itemHeights = R.map(dimension => dimension.height, renderedDimensions);
@@ -176,6 +183,21 @@ export default function ComicViewer(props: ComicViewerProps) {
176
183
  });
177
184
  };
178
185
 
186
+ const updateIntrinsicImages = useCallback(() => {
187
+ const isInitialCreateFinish = R.all((imageState: ImageState) => imageState.urlState.validity !== 'unknown')(imageStatesRef.current);
188
+
189
+ if (!isInitialCreateFinish || !shouldWaitInitialCreate.current) {
190
+ return;
191
+ }
192
+
193
+ setIntrinsicImages(originalIntrinsicImages);
194
+ const newImageStates = R.map(createInitialImageState, originalIntrinsicImages);
195
+ imageStatesRef.current = R.map(([, state]: [number, ImageState]) => state)(R.toPairs(R.mergeDeepLeft(imageStatesRef.current, newImageStates)));
196
+ setItemStates(mapImageStatesToItemStates(imageStatesRef.current));
197
+
198
+ shouldWaitInitialCreate.current = false;
199
+ }, [originalIntrinsicImages, createInitialImageState, mapImageStatesToItemStates]);
200
+
179
201
  const renderItem: ListRenderItem<ItemState> = useCallback(({ item, index }) => {
180
202
  const handleError = () => {
181
203
  onError && onError();
@@ -201,6 +223,8 @@ export default function ComicViewer(props: ComicViewerProps) {
201
223
  return;
202
224
  }
203
225
 
226
+ updateIntrinsicImages();
227
+
204
228
  updateTryRenderingMillis();
205
229
  };
206
230
 
@@ -226,6 +250,8 @@ export default function ComicViewer(props: ComicViewerProps) {
226
250
 
227
251
  return imageState;
228
252
  });
253
+
254
+ updateIntrinsicImages();
229
255
  };
230
256
 
231
257
  return (
@@ -242,7 +268,7 @@ export default function ComicViewer(props: ComicViewerProps) {
242
268
  reloadButtonVisible={item.reloadButtonVisible}
243
269
  />
244
270
  );
245
- }, [onItemPress, renderedDimensions]);
271
+ }, [onItemPress, renderedDimensions, updateIntrinsicImages]);
246
272
 
247
273
  useEffect(() => {
248
274
  const scroll = () => {
@@ -268,7 +294,7 @@ export default function ComicViewer(props: ComicViewerProps) {
268
294
 
269
295
  return () => {
270
296
  timeoutId && clearTimeout(timeoutId);
271
- }
297
+ };
272
298
  }, []);
273
299
 
274
300
  return (
@@ -32,6 +32,12 @@ export default interface ComicViewerProps extends ComponentProps <{
32
32
  */
33
33
  initialNumToRender?: number;
34
34
 
35
+ /**
36
+ * How many items to create in the initial batch.
37
+ * @default 1
38
+ */
39
+ initialNumToCreate?: number;
40
+
35
41
  /**
36
42
  * Start at initialScrollPercentage.
37
43
  * If over 100, scroll to end.
@@ -1,4 +1,4 @@
1
- import React, { useEffect, useImperativeHandle, useRef, useState } from 'react';
1
+ import React, { useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';
2
2
  import * as R from 'ramda';
3
3
  import { NativeScrollEvent, NativeSyntheticEvent, View } from 'react-native';
4
4
  import { Gesture, GestureDetector } from 'react-native-gesture-handler';
@@ -39,7 +39,7 @@ const FastScroll = React.forwardRef((props: FastScrollProps, ref) => {
39
39
 
40
40
  const totalContentLength = contentLength + additionalLength;
41
41
 
42
- const contentOffset = Math.floor((initialScrollPercentage / 100) * contentLength);
42
+ const contentOffset = Math.floor((initialScrollPercentage / 100) * contentLength);
43
43
  const contentPercentage = offsetToPercentage(contentOffset, totalContentLength);
44
44
  const initialLastIndicatorOffset = percentageToOffset(contentPercentage, movementRange);
45
45
 
@@ -61,7 +61,7 @@ const FastScroll = React.forwardRef((props: FastScrollProps, ref) => {
61
61
  right: R.defaultTo(0)(absolutePosition?.right) + INDICATOR_WIDTH,
62
62
  };
63
63
 
64
- const onContentScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {
64
+ const onContentScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {
65
65
  if (!isIndicatorDragging.current) {
66
66
  const contentPercentage = offsetToPercentage(event.nativeEvent.contentOffset.y, totalContentLength);
67
67
  const offset = percentageToOffset(contentPercentage, movementRange);
@@ -83,7 +83,7 @@ const FastScroll = React.forwardRef((props: FastScrollProps, ref) => {
83
83
  } else {
84
84
  setVisible(true);
85
85
  }
86
- };
86
+ }, [totalContentLength, movementRange]);
87
87
 
88
88
  const getIsIndicatorDragging = () => isIndicatorDragging.current;
89
89
 
@@ -94,7 +94,7 @@ const FastScroll = React.forwardRef((props: FastScrollProps, ref) => {
94
94
  onContentScroll,
95
95
  setVisible,
96
96
  }),
97
- [],
97
+ [onContentScroll],
98
98
  );
99
99
 
100
100
  const handleUpdate = () => {
package/yarn-error.log DELETED
@@ -1,103 +0,0 @@
1
- Arguments:
2
- /Users/chan/.nvm/versions/node/v16.16.0/bin/node /usr/local/Cellar/yarn/1.22.19/libexec/bin/yarn.js add react-native-device-info
3
-
4
- PATH:
5
- /Users/chan/.nvm/versions/node/v16.16.0/bin:/usr/local/bin:/System/Cryptexes/App/usr/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/local/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/appleinternal/bin:/Users/chan/IdeaProjects/tappytoon/bin/git-ext:/Library/Java/JavaVirtualMachines/jdk-12.0.2.jdk/Contents/Home/bin:/usr/local/bin:/System/Cryptexes/App/usr/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/local/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/appleinternal/bin:/Users/chan/IdeaProjects/tappytoon/bin/git-ext:/Users/chan/Library/Android/sdk/tools:/usr/local/bin:/System/Cryptexes/App/usr/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/local/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/appleinternal/bin:/Users/chan/IdeaProjects/tappytoon/bin/git-ext:/Users/chan/Library/Android/sdk/platform-tools:/Users/chan/library/android/sdk/tools:/usr/local/bin:/System/Cryptexes/App/usr/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/local/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/appleinternal/bin:/Users/chan/IdeaProjects/tappytoon/bin/git-ext:/Library/Java/JavaVirtualMachines/jdk-12.0.2.jdk/Contents/Home/bin:/usr/local/bin:/System/Cryptexes/App/usr/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/local/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/appleinternal/bin:/Users/chan/IdeaProjects/tappytoon/bin/git-ext:/Users/chan/Library/Android/sdk/tools:/usr/local/bin:/System/Cryptexes/App/usr/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/local/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/appleinternal/bin:/Users/chan/IdeaProjects/tappytoon/bin/git-ext:/Users/chan/Library/Android/sdk/platform-tools:/Users/hyungchanyuk/library/android/sdk/platform-tools:/Users/chan/WebstormProjects/tappytoon/bin/git-ext
6
-
7
- Yarn version:
8
- 1.22.19
9
-
10
- Node version:
11
- 16.16.0
12
-
13
- Platform:
14
- darwin x64
15
-
16
- Trace:
17
- SyntaxError: /Users/chan/WebstormProjects/tappytoon/nodejs/fountain-ui/packages/fountain-ui-lab/package.json: Unexpected token } in JSON at position 681
18
- at JSON.parse (<anonymous>)
19
- at /usr/local/Cellar/yarn/1.22.19/libexec/lib/cli.js:1629:59
20
- at Generator.next (<anonymous>)
21
- at step (/usr/local/Cellar/yarn/1.22.19/libexec/lib/cli.js:310:30)
22
- at /usr/local/Cellar/yarn/1.22.19/libexec/lib/cli.js:321:13
23
-
24
- npm manifest:
25
- {
26
- "name": "@fountain-ui/lab",
27
- "version": "2.0.0-beta.45",
28
- "private": false,
29
- "author": "Fountain-UI Team",
30
- "description": "Incubator for Fountain-UI React components.",
31
- "license": "MIT",
32
- "main": "./build/commonjs/index.js",
33
- "module": "./build/module/index.js",
34
- "react-native": "./src/index.ts",
35
- "source": "./src/index.ts",
36
- "types": "./build/typescript/index.d.ts",
37
- "scripts": {
38
- "clean": "rimraf build",
39
- "prepare": "bob build"
40
- },
41
- "dependencies": {
42
- "@emotion/react": "^11.10.0",
43
- "@emotion/styled": "^11.10.0",
44
- "@fountain-ui/icons": "^2.0.0-beta.9",
45
- "@fountain-ui/utils": "^2.0.0-beta.4",
46
- "react-native-calendars": "1.1267.0",
47
- },
48
- "peerDependencies": {
49
- "@fountain-ui/core": "^2.0.0-beta.3",
50
- "@gorhom/bottom-sheet": "^4.5.0",
51
- "date-fns": "^2.0.0",
52
- "react": "^16.8.0 || ^17.0.0",
53
- "react-dom": "^16.8.0 || ^17.0.0",
54
- "react-native": "^0.63.0",
55
- "react-native-gesture-handler": "^2.0.0",
56
- "react-native-pager-view": "^4.0.0"
57
- },
58
- "peerDependenciesMeta": {
59
- "@gorhom/bottom-sheet": {
60
- "optional": true
61
- },
62
- "react-dom": {
63
- "optional": true
64
- },
65
- "react-native-pager-view": {
66
- "optional": true
67
- }
68
- },
69
- "devDependencies": {
70
- "@gorhom/bottom-sheet": "^4.5.0",
71
- "date-fns": "^2.23.0",
72
- "react-native-pager-view": "^4.2.4",
73
- "react-native-safe-area-context": "^4.0.0"
74
- },
75
- "react-native-builder-bob": {
76
- "source": "./src",
77
- "output": "./build",
78
- "targets": [
79
- "commonjs",
80
- "module",
81
- [
82
- "typescript",
83
- {
84
- "project": "tsconfig.build.json",
85
- "tsc": "../../node_modules/.bin/tsc"
86
- }
87
- ]
88
- ],
89
- "files": [
90
- "./src",
91
- "./build"
92
- ]
93
- },
94
- "publishConfig": {
95
- "access": "public"
96
- }
97
- }
98
-
99
- yarn manifest:
100
- No manifest
101
-
102
- Lockfile:
103
- No lockfile