@0610studio/zs-ui 0.0.64 → 0.0.65

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.
@@ -1,21 +1,20 @@
1
1
  import React, { ReactNode } from 'react';
2
2
  import { ViewProps, ScrollView } from 'react-native';
3
- type ZSContainerProps = ViewProps & {
3
+ declare const ZSContainer: React.ForwardRefExoticComponent<ViewProps & {
4
4
  backgroundColor?: string;
5
5
  isLoader?: boolean;
6
6
  statusBarColor?: string;
7
- barStyle?: 'light-content' | 'dark-content';
8
- edges?: Array<'top' | 'right' | 'bottom' | 'left'>;
7
+ barStyle?: "light-content" | "dark-content";
8
+ edges?: Array<"top" | "right" | "bottom" | "left">;
9
9
  isScrollView?: boolean;
10
- scrollViewRef?: React.RefObject<ScrollView>;
11
10
  topComponent?: ReactNode;
12
11
  bottomComponent?: ReactNode;
13
12
  showsVerticalScrollIndicator?: boolean;
14
13
  loadingComponent?: React.ReactNode;
15
14
  keyboardVerticalOffset?: number;
16
- behavior?: "padding" | "height" | "position" | undefined;
15
+ behavior?: "padding" | "height" | "position";
17
16
  automaticallyAdjustKeyboardInsets?: boolean;
18
- };
19
- declare function ZSContainer({ backgroundColor, isLoader, statusBarColor, barStyle, edges, isScrollView, scrollViewRef, topComponent, bottomComponent, showsVerticalScrollIndicator, loadingComponent, keyboardVerticalOffset, behavior, automaticallyAdjustKeyboardInsets, ...props }: ZSContainerProps): React.JSX.Element;
17
+ keyboardScrollExtraOffset?: number;
18
+ } & React.RefAttributes<ScrollView>>;
20
19
  export default ZSContainer;
21
20
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSContainer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAE,SAAS,EAA8E,UAAU,EAAE,MAAM,cAAc,CAAC;AAMjI,KAAK,gBAAgB,GAAG,SAAS,GAAG;IAClC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,eAAe,GAAG,cAAc,CAAC;IAC5C,KAAK,CAAC,EAAE,KAAK,CAAC,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC,CAAC;IACnD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAC5C,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,CAAC;IACzD,iCAAiC,CAAC,EAAE,OAAO,CAAC;CAC7C,CAAC;AAEF,iBAAS,WAAW,CAAC,EACnB,eAAe,EACf,QAAgB,EAChB,cAAc,EACd,QAAyB,EACzB,KAAyB,EACzB,YAAmB,EACnB,aAAa,EACb,YAAY,EACZ,eAAe,EACf,4BAAmC,EACnC,gBAAwC,EACxC,sBAAsB,EACtB,QAAQ,EACR,iCAAwC,EACxC,GAAG,KAAK,EACT,EAAE,gBAAgB,qBAkDlB;AAQD,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSContainer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAgE,MAAM,OAAO,CAAC;AACvG,OAAO,EAAE,SAAS,EAA8E,UAAU,EAAqD,MAAM,cAAc,CAAC;AAuBpL,QAAA,MAAM,WAAW;sBAhBG,MAAM;eACb,OAAO;qBACD,MAAM;eACZ,eAAe,GAAG,cAAc;YACnC,KAAK,CAAC,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;mBACnC,OAAO;mBACP,SAAS;sBACN,SAAS;mCACI,OAAO;uBACnB,KAAK,CAAC,SAAS;6BACT,MAAM;eACpB,SAAS,GAAG,QAAQ,GAAG,UAAU;wCACR,OAAO;gCACf,MAAM;oCAwHlC,CAAC;AAYH,eAAe,WAAW,CAAC"}
@@ -1,39 +1,79 @@
1
- import React, { useState, useEffect } from 'react';
2
- import { KeyboardAvoidingView, StatusBar, StyleSheet, Dimensions, ActivityIndicator } from 'react-native';
1
+ import React, { useState, useEffect, useImperativeHandle, forwardRef, useRef } from 'react';
2
+ import { KeyboardAvoidingView, StatusBar, StyleSheet, Dimensions, ActivityIndicator, Keyboard } from 'react-native';
3
3
  import { SafeAreaView } from 'react-native-safe-area-context';
4
4
  import ViewAtom from '../atoms/ViewAtom';
5
5
  import ScrollViewAtom from '../atoms/ScrollViewAtom';
6
6
  import { useTheme } from '../../model/useThemeProvider';
7
- function ZSContainer({ backgroundColor, isLoader = false, statusBarColor, barStyle = 'dark-content', edges = ['top', 'bottom'], isScrollView = true, scrollViewRef, topComponent, bottomComponent, showsVerticalScrollIndicator = true, loadingComponent = <ActivityIndicator />, keyboardVerticalOffset, behavior, automaticallyAdjustKeyboardInsets = true, ...props }) {
8
- const { palette } = useTheme(); // 테마 사용
7
+ const ZSContainer = forwardRef(function ZSContainer({ backgroundColor, isLoader = false, statusBarColor, barStyle = 'dark-content', edges = ['top', 'bottom'], isScrollView = true, topComponent, bottomComponent, showsVerticalScrollIndicator = true, loadingComponent = <ActivityIndicator />, keyboardVerticalOffset, behavior, automaticallyAdjustKeyboardInsets = true, keyboardScrollExtraOffset, ...props }, forwardedRef) {
8
+ const { palette } = useTheme();
9
9
  const [isDelayed, setIsDelayed] = useState(true);
10
+ const positionRef = useRef(0);
11
+ const scrollViewRef = useRef(null);
12
+ const lastTouchY = useRef(0);
13
+ useImperativeHandle(forwardedRef, () => scrollViewRef.current, []);
10
14
  useEffect(() => {
11
15
  const timer = setTimeout(() => {
12
16
  setIsDelayed(false);
13
17
  }, 200);
14
18
  return () => clearTimeout(timer);
15
19
  }, []);
16
- return (<SafeAreaView style={[{ backgroundColor: backgroundColor || palette.background.base }, styles.flex1, styles.fullWidth]} edges={edges}>
17
-
20
+ useEffect(() => {
21
+ const keyboardShowSubscription = Keyboard.addListener('keyboardDidShow', (e) => {
22
+ if (scrollViewRef.current && keyboardScrollExtraOffset) {
23
+ const screenHeight = Dimensions.get('window').height;
24
+ const keyboardHeight = e.endCoordinates.height;
25
+ const safeAreaBottom = 0;
26
+ const availableScreenHeight = screenHeight - keyboardHeight - safeAreaBottom;
27
+ const delta = (lastTouchY?.current || 0) + keyboardScrollExtraOffset - availableScreenHeight;
28
+ scrollViewRef.current.scrollTo({
29
+ y: (positionRef.current ?? 0) + delta,
30
+ animated: true,
31
+ });
32
+ }
33
+ });
34
+ return () => {
35
+ positionRef.current = null;
36
+ lastTouchY.current = null;
37
+ keyboardShowSubscription.remove();
38
+ };
39
+ }, [keyboardScrollExtraOffset]);
40
+ const handleScroll = (event) => {
41
+ if (keyboardScrollExtraOffset)
42
+ positionRef.current = event.nativeEvent.contentOffset.y;
43
+ };
44
+ const handleTouch = (evt) => {
45
+ if (keyboardScrollExtraOffset)
46
+ lastTouchY.current = evt.nativeEvent.pageY;
47
+ };
48
+ return (<SafeAreaView style={[
49
+ { backgroundColor: backgroundColor || palette.background.base },
50
+ styles.flex1,
51
+ styles.fullWidth,
52
+ ]} edges={edges}>
18
53
  {!isDelayed && (<KeyboardAvoidingView style={[styles.flex1, styles.fullWidth]} behavior={behavior} keyboardVerticalOffset={keyboardVerticalOffset}>
19
54
  {topComponent && topComponent}
20
55
 
21
- {isLoader ? (loadingComponent) : isScrollView ? (<ScrollViewAtom ref={scrollViewRef} style={[styles.flex1, styles.fullWidth]} bounces={false} overScrollMode="never" contentContainerStyle={styles.scrollContainerStyle} showsVerticalScrollIndicator={showsVerticalScrollIndicator} keyboardShouldPersistTaps="handled" automaticallyAdjustKeyboardInsets={automaticallyAdjustKeyboardInsets}>
56
+ {isLoader ? (loadingComponent) : isScrollView ? (<ScrollViewAtom ref={scrollViewRef} style={[styles.flex1, styles.fullWidth]} bounces={false} overScrollMode="never" contentContainerStyle={styles.scrollContainerStyle} showsVerticalScrollIndicator={showsVerticalScrollIndicator} keyboardShouldPersistTaps="handled" automaticallyAdjustKeyboardInsets={automaticallyAdjustKeyboardInsets} onScroll={handleScroll} onTouchStart={handleTouch}>
22
57
  <ViewAtom style={[styles.flex1, styles.fullWidth, props.style]}>
23
58
  {props.children}
24
59
  </ViewAtom>
25
- </ScrollViewAtom>) : (<ViewAtom style={[styles.flex1, styles.fullWidth, props.style]}>{props.children}</ViewAtom>)}
60
+ </ScrollViewAtom>) : (<ViewAtom style={[styles.flex1, styles.fullWidth, props.style]}>
61
+ {props.children}
62
+ </ViewAtom>)}
26
63
 
27
64
  {!isLoader && bottomComponent && bottomComponent}
28
65
  </KeyboardAvoidingView>)}
29
-
30
66
  <StatusBar barStyle={barStyle} backgroundColor={statusBarColor || palette.background.base}/>
31
67
  </SafeAreaView>);
32
- }
68
+ });
33
69
  const styles = StyleSheet.create({
34
70
  flex1: { flex: 1 },
35
71
  fullWidth: { width: Dimensions.get('window').width },
36
- scrollContainerStyle: { flexGrow: 1, alignItems: 'center', width: Dimensions.get('window').width },
72
+ scrollContainerStyle: {
73
+ flexGrow: 1,
74
+ alignItems: 'center',
75
+ width: Dimensions.get('window').width,
76
+ },
37
77
  });
38
78
  export default ZSContainer;
39
79
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSContainer/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { ReactNode, useState, useEffect } from 'react';\nimport { ViewProps, KeyboardAvoidingView, StatusBar, StyleSheet, Dimensions, ActivityIndicator, ScrollView } from 'react-native';\nimport { SafeAreaView } from 'react-native-safe-area-context';\nimport ViewAtom from '../atoms/ViewAtom';\nimport ScrollViewAtom from '../atoms/ScrollViewAtom';\nimport { useTheme } from '../../model/useThemeProvider';\n\ntype ZSContainerProps = ViewProps & {\n backgroundColor?: string;\n isLoader?: boolean;\n statusBarColor?: string;\n barStyle?: 'light-content' | 'dark-content';\n edges?: Array<'top' | 'right' | 'bottom' | 'left'>;\n isScrollView?: boolean;\n scrollViewRef?: React.RefObject<ScrollView>;\n topComponent?: ReactNode;\n bottomComponent?: ReactNode;\n showsVerticalScrollIndicator?: boolean;\n loadingComponent?: React.ReactNode;\n keyboardVerticalOffset?: number;\n behavior?: \"padding\" | \"height\" | \"position\" | undefined;\n automaticallyAdjustKeyboardInsets?: boolean;\n};\n\nfunction ZSContainer({\n backgroundColor,\n isLoader = false,\n statusBarColor,\n barStyle = 'dark-content',\n edges = ['top', 'bottom'],\n isScrollView = true,\n scrollViewRef,\n topComponent,\n bottomComponent,\n showsVerticalScrollIndicator = true,\n loadingComponent = <ActivityIndicator />,\n keyboardVerticalOffset,\n behavior,\n automaticallyAdjustKeyboardInsets = true,\n ...props\n}: ZSContainerProps) {\n const { palette } = useTheme(); // 테마 사용\n const [isDelayed, setIsDelayed] = useState(true);\n\n useEffect(() => {\n const timer = setTimeout(() => {\n setIsDelayed(false);\n }, 200);\n return () => clearTimeout(timer);\n }, []);\n\n return (\n <SafeAreaView style={[{ backgroundColor: backgroundColor || palette.background.base }, styles.flex1, styles.fullWidth]} edges={edges}>\n\n {!isDelayed && (\n <KeyboardAvoidingView\n style={[styles.flex1, styles.fullWidth]}\n behavior={behavior}\n keyboardVerticalOffset={keyboardVerticalOffset}\n >\n {topComponent && topComponent}\n\n {isLoader ? (\n loadingComponent\n ) : isScrollView ? (\n <ScrollViewAtom\n ref={scrollViewRef}\n style={[styles.flex1, styles.fullWidth]}\n bounces={false}\n overScrollMode=\"never\"\n contentContainerStyle={styles.scrollContainerStyle}\n showsVerticalScrollIndicator={showsVerticalScrollIndicator}\n keyboardShouldPersistTaps=\"handled\"\n automaticallyAdjustKeyboardInsets={automaticallyAdjustKeyboardInsets}\n >\n <ViewAtom style={[styles.flex1, styles.fullWidth, props.style]}>\n {props.children}\n </ViewAtom>\n </ScrollViewAtom>\n ) : (\n <ViewAtom style={[styles.flex1, styles.fullWidth, props.style]}>{props.children}</ViewAtom>\n )}\n\n {!isLoader && bottomComponent && bottomComponent}\n </KeyboardAvoidingView>\n )}\n\n <StatusBar barStyle={barStyle} backgroundColor={statusBarColor || palette.background.base} />\n </SafeAreaView>\n );\n}\n\nconst styles = StyleSheet.create({\n flex1: { flex: 1 },\n fullWidth: { width: Dimensions.get('window').width },\n scrollContainerStyle: { flexGrow: 1, alignItems: 'center', width: Dimensions.get('window').width },\n});\n\nexport default ZSContainer;\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSContainer/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { ReactNode, useState, useEffect, useImperativeHandle, forwardRef, useRef } from 'react';\nimport { ViewProps, KeyboardAvoidingView, StatusBar, StyleSheet, Dimensions, ActivityIndicator, ScrollView, NativeSyntheticEvent, NativeScrollEvent, Keyboard } from 'react-native';\nimport { SafeAreaView } from 'react-native-safe-area-context';\nimport ViewAtom from '../atoms/ViewAtom';\nimport ScrollViewAtom from '../atoms/ScrollViewAtom';\nimport { useTheme } from '../../model/useThemeProvider';\n\ntype ZSContainerProps = ViewProps & {\n backgroundColor?: string;\n isLoader?: boolean;\n statusBarColor?: string;\n barStyle?: 'light-content' | 'dark-content';\n edges?: Array<'top' | 'right' | 'bottom' | 'left'>;\n isScrollView?: boolean;\n topComponent?: ReactNode;\n bottomComponent?: ReactNode;\n showsVerticalScrollIndicator?: boolean;\n loadingComponent?: React.ReactNode;\n keyboardVerticalOffset?: number;\n behavior?: 'padding' | 'height' | 'position';\n automaticallyAdjustKeyboardInsets?: boolean;\n keyboardScrollExtraOffset?: number;\n};\n\nconst ZSContainer = forwardRef<ScrollView, ZSContainerProps>(function ZSContainer(\n {\n backgroundColor,\n isLoader = false,\n statusBarColor,\n barStyle = 'dark-content',\n edges = ['top', 'bottom'],\n isScrollView = true,\n topComponent,\n bottomComponent,\n showsVerticalScrollIndicator = true,\n loadingComponent = <ActivityIndicator />,\n keyboardVerticalOffset,\n behavior,\n automaticallyAdjustKeyboardInsets = true,\n keyboardScrollExtraOffset,\n ...props\n },\n forwardedRef\n) {\n const { palette } = useTheme();\n const [isDelayed, setIsDelayed] = useState(true);\n const positionRef = useRef<number | null>(0);\n const scrollViewRef = useRef<ScrollView>(null);\n const lastTouchY = useRef<number | null>(0);\n\n useImperativeHandle(forwardedRef, () => scrollViewRef.current as ScrollView, []);\n\n useEffect(() => {\n const timer = setTimeout(() => {\n setIsDelayed(false);\n }, 200);\n return () => clearTimeout(timer);\n }, []);\n\n useEffect(() => {\n const keyboardShowSubscription = Keyboard.addListener('keyboardDidShow', (e) => {\n if (scrollViewRef.current && keyboardScrollExtraOffset) {\n const screenHeight = Dimensions.get('window').height;\n const keyboardHeight = e.endCoordinates.height;\n const safeAreaBottom = 0;\n const availableScreenHeight = screenHeight - keyboardHeight - safeAreaBottom;\n const delta = (lastTouchY?.current || 0) + keyboardScrollExtraOffset - availableScreenHeight;\n\n scrollViewRef.current.scrollTo({\n y: (positionRef.current ?? 0) + delta,\n animated: true,\n });\n }\n });\n\n return () => {\n positionRef.current = null;\n lastTouchY.current = null;\n keyboardShowSubscription.remove();\n };\n }, [keyboardScrollExtraOffset]);\n\n const handleScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {\n if (keyboardScrollExtraOffset) positionRef.current = event.nativeEvent.contentOffset.y;\n };\n\n const handleTouch = (evt: any) => {\n if (keyboardScrollExtraOffset) lastTouchY.current = evt.nativeEvent.pageY;\n };\n\n return (\n <SafeAreaView\n style={[\n { backgroundColor: backgroundColor || palette.background.base },\n styles.flex1,\n styles.fullWidth,\n ]}\n edges={edges}\n >\n {!isDelayed && (\n <KeyboardAvoidingView\n style={[styles.flex1, styles.fullWidth]}\n behavior={behavior}\n keyboardVerticalOffset={keyboardVerticalOffset}\n >\n {topComponent && topComponent}\n\n {isLoader ? (\n loadingComponent\n ) : isScrollView ? (\n <ScrollViewAtom\n ref={scrollViewRef}\n style={[styles.flex1, styles.fullWidth]}\n bounces={false}\n overScrollMode=\"never\"\n contentContainerStyle={styles.scrollContainerStyle}\n showsVerticalScrollIndicator={showsVerticalScrollIndicator}\n keyboardShouldPersistTaps=\"handled\"\n automaticallyAdjustKeyboardInsets={automaticallyAdjustKeyboardInsets}\n onScroll={handleScroll}\n onTouchStart={handleTouch}\n >\n <ViewAtom style={[styles.flex1, styles.fullWidth, props.style]}>\n {props.children}\n </ViewAtom>\n </ScrollViewAtom>\n ) : (\n <ViewAtom style={[styles.flex1, styles.fullWidth, props.style]}>\n {props.children}\n </ViewAtom>\n )}\n\n {!isLoader && bottomComponent && bottomComponent}\n </KeyboardAvoidingView>\n )}\n <StatusBar\n barStyle={barStyle}\n backgroundColor={statusBarColor || palette.background.base}\n />\n </SafeAreaView>\n );\n});\n\nconst styles = StyleSheet.create({\n flex1: { flex: 1 },\n fullWidth: { width: Dimensions.get('window').width },\n scrollContainerStyle: {\n flexGrow: 1,\n alignItems: 'center',\n width: Dimensions.get('window').width,\n },\n});\n\nexport default ZSContainer;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@0610studio/zs-ui",
3
- "version": "0.0.64",
3
+ "version": "0.0.65",
4
4
  "private": false,
5
5
  "description": "EXPO ZS-UI",
6
6
  "type": "module",