@0610studio/zs-ui 0.17.0 → 0.17.1

package/build/context/ThemeContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+E,MAAM,OAAO,CAAC;AAKpG,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAE5E,OAAkB,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAEhE,MAAM,WAAW,kBAAkB;IACjC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE;YAAE,KAAK,CAAC,EAAE,KAAK,CAAC;YAAC,IAAI,CAAC,EAAE,KAAK,CAAA;SAAE,CAAA;KAAE,KAAK,KAAK,CAAC;CAC/G;AAED,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,uBAAuB,CAAC;IACpC,SAAS,EAAE,eAAe,CAAC;CAC5B;AAED,MAAM,WAAW,OAAQ,SAAQ,KAAK;IACpC,IAAI,EAAE,OAAO,GAAG,MAAM,CAAC;IACvB,wBAAwB,EAAE,OAAO,CAAC;IAClC,uBAAuB,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AAID,eAAO,MAAM,QAAQ,kBAMpB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA6FtD,CAAA"}
+{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiF,MAAM,OAAO,CAAC;AAKtG,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAE5E,OAAkB,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAEhE,MAAM,WAAW,kBAAkB;IACjC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE;YAAE,KAAK,CAAC,EAAE,KAAK,CAAC;YAAC,IAAI,CAAC,EAAE,KAAK,CAAA;SAAE,CAAA;KAAE,KAAK,KAAK,CAAC;CAC/G;AAED,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,uBAAuB,CAAC;IACpC,SAAS,EAAE,eAAe,CAAC;CAC5B;AAED,MAAM,WAAW,OAAQ,SAAQ,KAAK;IACpC,IAAI,EAAE,OAAO,GAAG,MAAM,CAAC;IACvB,wBAAwB,EAAE,OAAO,CAAC;IAClC,uBAAuB,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AA2CD,eAAO,MAAM,QAAQ,kBAMpB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA6GtD,CAAA"}

package/build/context/ThemeContext.js

@@ -1,4 +1,4 @@
-import React, { createContext, useContext, useMemo, useState, useEffect, useCallback } from 'react';
+import React, { createContext, useContext, useMemo, useReducer, useEffect, useCallback } from 'react';
 import { Platform, useColorScheme } from 'react-native';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import * as NavigationBar from 'expo-navigation-bar';
@@ -6,6 +6,30 @@ import palette from '../theme/palette';
 import typography from '../theme/typography';
 import elevation from '../theme/elevation';
 const ThemeContext = createContext(null);
+const getSystemMode = (systemColorScheme) => systemColorScheme === 'dark' ? 'dark' : 'light';
+function themeReducer(state, action) {
+    switch (action.type) {
+        case 'HYDRATE':
+            return action.state;
+        case 'SYNC_SYSTEM_MODE':
+            return state.isUsingSystemColorScheme
+                ? { ...state, mode: action.systemMode }
+                : state;
+        case 'SET_USE_SYSTEM_COLOR_SCHEME':
+            return {
+                ...state,
+                isUsingSystemColorScheme: action.useSystem,
+                mode: action.useSystem ? action.systemMode : state.mode,
+            };
+        case 'TOGGLE_THEME':
+            return {
+                isUsingSystemColorScheme: false,
+                mode: state.mode === 'light' ? 'dark' : 'light',
+            };
+        default:
+            return state;
+    }
+}
 export const useTheme = () => {
     const context = useContext(ThemeContext);
     if (!context) {
@@ -15,8 +39,12 @@ export const useTheme = () => {
 };
 export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true, customPalette }) => {
     const systemColorScheme = useColorScheme(); // 시스템 다크 모드 감지
-    const [isUsingSystemColorScheme, setUseSystemColorScheme] = useState(isDarkModeEnabled ? true : false);
-    const [mode, setMode] = useState(isDarkModeEnabled ? (systemColorScheme === 'dark' ? 'dark' : 'light') : 'light');
+    const systemMode = getSystemMode(systemColorScheme);
+    const [themeState, dispatchTheme] = useReducer(themeReducer, {
+        isUsingSystemColorScheme: isDarkModeEnabled,
+        mode: isDarkModeEnabled ? systemMode : 'light',
+    });
+    const { isUsingSystemColorScheme, mode } = themeState;
     // AsyncStorage에서 시스템 모드 사용 설정 값 로드
     useEffect(() => {
         let isMounted = true;
@@ -24,24 +52,31 @@ export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true,
             try {
                 if (!isMounted)
                     return;
-                if (isDarkModeEnabled) {
-                    const storedUseSystemColorScheme = await AsyncStorage.getItem('useSystemColorScheme');
-                    const storedMode = await AsyncStorage.getItem('themeMode');
-                    if (!isMounted)
-                        return;
-                    if (storedUseSystemColorScheme !== null) {
-                        setUseSystemColorScheme(storedUseSystemColorScheme === 'true');
-                    }
-                    if (storedMode) {
-                        setMode(storedMode === 'dark' ? 'dark' : 'light');
-                    }
-                    else {
-                        setMode(systemColorScheme === 'dark' ? 'dark' : 'light');
-                    }
-                }
-                else {
-                    setMode('light');
+                if (!isDarkModeEnabled) {
+                    dispatchTheme({
+                        type: 'HYDRATE',
+                        state: {
+                            isUsingSystemColorScheme: false,
+                            mode: 'light',
+                        },
+                    });
+                    return;
                 }
+                const storedUseSystemColorScheme = await AsyncStorage.getItem('useSystemColorScheme');
+                const storedMode = await AsyncStorage.getItem('themeMode');
+                if (!isMounted)
+                    return;
+                const isUsingSystemColorScheme = storedUseSystemColorScheme === null
+                    ? true
+                    : storedUseSystemColorScheme === 'true';
+                const savedMode = storedMode === 'dark' || storedMode === 'light' ? storedMode : undefined;
+                dispatchTheme({
+                    type: 'HYDRATE',
+                    state: {
+                        isUsingSystemColorScheme,
+                        mode: isUsingSystemColorScheme ? systemMode : savedMode ?? systemMode,
+                    },
+                });
             }
             catch (error) {
                 console.error('Failed to load theme settings', error);
@@ -51,13 +86,11 @@ export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true,
         return () => {
             isMounted = false;
         };
-    }, [isDarkModeEnabled, systemColorScheme]);
+    }, [isDarkModeEnabled, systemMode]);
     // 시스템 다크 모드 변경에 따른 효과 적용
     useEffect(() => {
-        if (isUsingSystemColorScheme) {
-            setMode(systemColorScheme === 'dark' ? 'dark' : 'light');
-        }
-    }, [isUsingSystemColorScheme, systemColorScheme]);
+        dispatchTheme({ type: 'SYNC_SYSTEM_MODE', systemMode });
+    }, [systemMode]);
     // 안드로이드 하단 제스쳐 영역 스타일
     useEffect(() => {
         if (Platform.OS === 'android') {
@@ -68,18 +101,18 @@ export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true,
     }, [mode, customPalette]);
     // 테마 토글 함수
     const toggleTheme = useCallback(async () => {
-        setUseSystemColorScheme(false); // 사용자 지정 모드로 전환
-        setMode((prevMode) => {
-            const newMode = prevMode === 'light' ? 'dark' : 'light';
-            AsyncStorage.setItem('themeMode', newMode); // 로컬스토리지에 저장
-            return newMode;
-        });
-    }, []);
+        const newMode = mode === 'light' ? 'dark' : 'light';
+        dispatchTheme({ type: 'TOGGLE_THEME' }); // 사용자 지정 모드로 전환
+        await AsyncStorage.multiSet([
+            ['useSystemColorScheme', 'false'],
+            ['themeMode', newMode],
+        ]);
+    }, [mode]);
     // 시스템 모드 사용 설정 변경 함수
     const handleSetUseSystemColorScheme = useCallback(async (useSystem) => {
-        setUseSystemColorScheme(useSystem);
+        dispatchTheme({ type: 'SET_USE_SYSTEM_COLOR_SCHEME', useSystem, systemMode });
         await AsyncStorage.setItem('useSystemColorScheme', useSystem.toString());
-    }, []);
+    }, [systemMode]);
     const themeValue = useMemo(() => {
         const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });
         return {
@@ -92,7 +125,7 @@ export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true,
             typography: typography({ themeFonts }),
             elevation: elevation(currentPalette)
         };
-    }, [mode, isUsingSystemColorScheme, typography, themeFonts, customPalette]);
+    }, [mode, isUsingSystemColorScheme, themeFonts, customPalette, handleSetUseSystemColorScheme, toggleTheme]);
     return (<ThemeContext.Provider value={themeValue}>
       {children}
     </ThemeContext.Provider>);

package/build/context/ThemeContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { createContext, useContext, useMemo, useState, useEffect, useCallback } from 'react';\nimport { Platform, useColorScheme } from 'react-native';\nimport AsyncStorage from '@react-native-async-storage/async-storage';\nimport * as NavigationBar from 'expo-navigation-bar';\nimport palette from '../theme/palette';\nimport { Theme, ThemeFonts, TypographyVariantsProps } from '../theme/types';\nimport typography from '../theme/typography';\nimport elevation, { ElevationStyles } from '../theme/elevation';\n\nexport interface ThemeProviderProps {\n  themeFonts?: ThemeFonts;\n  children: React.ReactNode;\n  isDarkModeEnabled?: boolean;\n  customPalette?: (config: { mode?: 'light' | 'dark'; themeColors?: { light?: Theme; dark?: Theme } }) => Theme;\n}\n\nexport interface ThemeProps {\n  palette: Palette;\n  typography: TypographyVariantsProps;\n  elevation: ElevationStyles;\n}\n\nexport interface Palette extends Theme {\n  mode: 'light' | 'dark';\n  isUsingSystemColorScheme: boolean;\n  setUseSystemColorScheme: (useSystem: boolean) => void;\n  toggleTheme: () => void;\n}\n\nconst ThemeContext = createContext<ThemeProps | null>(null);\n\nexport const useTheme = () => {\n  const context = useContext(ThemeContext);\n  if (!context) {\n    throw new Error('useTheme must be used within a ThemeProvider');\n  }\n  return context;\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({ themeFonts, children, isDarkModeEnabled = true, customPalette }) => {\n  const systemColorScheme = useColorScheme(); // 시스템 다크 모드 감지\n  const [isUsingSystemColorScheme, setUseSystemColorScheme] = useState(isDarkModeEnabled ? true : false);\n  const [mode, setMode] = useState<'light' | 'dark'>(isDarkModeEnabled ? (systemColorScheme === 'dark' ? 'dark' : 'light') : 'light');\n\n  // AsyncStorage에서 시스템 모드 사용 설정 값 로드\n  useEffect(() => {\n    let isMounted = true;\n\n    const loadSettings = async () => {\n      try {\n        if (!isMounted) return;\n        \n        if (isDarkModeEnabled) {\n          const storedUseSystemColorScheme = await AsyncStorage.getItem('useSystemColorScheme');\n          const storedMode = await AsyncStorage.getItem('themeMode');\n\n          if (!isMounted) return;\n\n          if (storedUseSystemColorScheme !== null) {\n            setUseSystemColorScheme(storedUseSystemColorScheme === 'true');\n          }\n          if (storedMode) {\n            setMode(storedMode === 'dark' ? 'dark' : 'light');\n          } else {\n            setMode(systemColorScheme === 'dark' ? 'dark' : 'light');\n          }\n        } else {\n          setMode('light');\n        }\n      } catch (error) {\n        console.error('Failed to load theme settings', error);\n      }\n    };\n\n    loadSettings();\n\n    return () => {\n      isMounted = false;\n    };\n  }, [isDarkModeEnabled, systemColorScheme]);\n\n  // 시스템 다크 모드 변경에 따른 효과 적용\n  useEffect(() => {\n    if (isUsingSystemColorScheme) {\n      setMode(systemColorScheme === 'dark' ? 'dark' : 'light');\n    }\n  }, [isUsingSystemColorScheme, systemColorScheme]);\n\n  // 안드로이드 하단 제스쳐 영역 스타일\n  useEffect(() => {\n    if (Platform.OS === 'android') {\n      NavigationBar.setButtonStyleAsync(mode);\n      const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });\n      NavigationBar.setBackgroundColorAsync(currentPalette.background.base)\n    }\n  }, [mode, customPalette])\n\n  // 테마 토글 함수\n  const toggleTheme = useCallback(async () => {\n    setUseSystemColorScheme(false); // 사용자 지정 모드로 전환\n    setMode((prevMode) => {\n      const newMode = prevMode === 'light' ? 'dark' : 'light';\n      AsyncStorage.setItem('themeMode', newMode); // 로컬스토리지에 저장\n      return newMode;\n    });\n  }, []);\n\n  // 시스템 모드 사용 설정 변경 함수\n  const handleSetUseSystemColorScheme = useCallback(async (useSystem: boolean) => {\n    setUseSystemColorScheme(useSystem);\n    await AsyncStorage.setItem('useSystemColorScheme', useSystem.toString());\n  }, []);\n\n  const themeValue = useMemo(() => {\n    const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });\n    return {\n      palette: {\n        isUsingSystemColorScheme,\n        setUseSystemColorScheme: handleSetUseSystemColorScheme,\n        toggleTheme,\n        ...currentPalette, // 선택된 모드에 따른 팔레트 적용\n      },\n      typography: typography({ themeFonts }),\n      elevation: elevation(currentPalette)\n    };\n  }, [mode, isUsingSystemColorScheme, typography, themeFonts, customPalette]);\n\n  return (\n    <ThemeContext.Provider value={themeValue}>\n      {children}\n    </ThemeContext.Provider>\n  );\n}\n"]}
+{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { createContext, useContext, useMemo, useReducer, useEffect, useCallback } from 'react';\nimport { Platform, useColorScheme } from 'react-native';\nimport AsyncStorage from '@react-native-async-storage/async-storage';\nimport * as NavigationBar from 'expo-navigation-bar';\nimport palette from '../theme/palette';\nimport { Theme, ThemeFonts, TypographyVariantsProps } from '../theme/types';\nimport typography from '../theme/typography';\nimport elevation, { ElevationStyles } from '../theme/elevation';\n\nexport interface ThemeProviderProps {\n  themeFonts?: ThemeFonts;\n  children: React.ReactNode;\n  isDarkModeEnabled?: boolean;\n  customPalette?: (config: { mode?: 'light' | 'dark'; themeColors?: { light?: Theme; dark?: Theme } }) => Theme;\n}\n\nexport interface ThemeProps {\n  palette: Palette;\n  typography: TypographyVariantsProps;\n  elevation: ElevationStyles;\n}\n\nexport interface Palette extends Theme {\n  mode: 'light' | 'dark';\n  isUsingSystemColorScheme: boolean;\n  setUseSystemColorScheme: (useSystem: boolean) => void;\n  toggleTheme: () => void;\n}\n\nconst ThemeContext = createContext<ThemeProps | null>(null);\ntype ThemeMode = 'light' | 'dark';\n\ntype ThemeState = {\n  mode: ThemeMode;\n  isUsingSystemColorScheme: boolean;\n};\n\ntype ThemeAction =\n  | { type: 'HYDRATE'; state: ThemeState }\n  | { type: 'SYNC_SYSTEM_MODE'; systemMode: ThemeMode }\n  | { type: 'SET_USE_SYSTEM_COLOR_SCHEME'; useSystem: boolean; systemMode: ThemeMode }\n  | { type: 'TOGGLE_THEME' };\n\nconst getSystemMode = (systemColorScheme: ReturnType<typeof useColorScheme>): ThemeMode =>\n  systemColorScheme === 'dark' ? 'dark' : 'light';\n\nfunction themeReducer(state: ThemeState, action: ThemeAction): ThemeState {\n  switch (action.type) {\n    case 'HYDRATE':\n      return action.state;\n    case 'SYNC_SYSTEM_MODE':\n      return state.isUsingSystemColorScheme\n        ? { ...state, mode: action.systemMode }\n        : state;\n    case 'SET_USE_SYSTEM_COLOR_SCHEME':\n      return {\n        ...state,\n        isUsingSystemColorScheme: action.useSystem,\n        mode: action.useSystem ? action.systemMode : state.mode,\n      };\n    case 'TOGGLE_THEME':\n      return {\n        isUsingSystemColorScheme: false,\n        mode: state.mode === 'light' ? 'dark' : 'light',\n      };\n    default:\n      return state;\n  }\n}\n\nexport const useTheme = () => {\n  const context = useContext(ThemeContext);\n  if (!context) {\n    throw new Error('useTheme must be used within a ThemeProvider');\n  }\n  return context;\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({ themeFonts, children, isDarkModeEnabled = true, customPalette }) => {\n  const systemColorScheme = useColorScheme(); // 시스템 다크 모드 감지\n  const systemMode = getSystemMode(systemColorScheme);\n  const [themeState, dispatchTheme] = useReducer(\n    themeReducer,\n    {\n      isUsingSystemColorScheme: isDarkModeEnabled,\n      mode: isDarkModeEnabled ? systemMode : 'light',\n    }\n  );\n  const { isUsingSystemColorScheme, mode } = themeState;\n\n  // AsyncStorage에서 시스템 모드 사용 설정 값 로드\n  useEffect(() => {\n    let isMounted = true;\n\n    const loadSettings = async () => {\n      try {\n        if (!isMounted) return;\n        \n        if (!isDarkModeEnabled) {\n          dispatchTheme({\n            type: 'HYDRATE',\n            state: {\n              isUsingSystemColorScheme: false,\n              mode: 'light',\n            },\n          });\n          return;\n        }\n\n        const storedUseSystemColorScheme = await AsyncStorage.getItem('useSystemColorScheme');\n        const storedMode = await AsyncStorage.getItem('themeMode');\n\n        if (!isMounted) return;\n\n        const isUsingSystemColorScheme = storedUseSystemColorScheme === null\n          ? true\n          : storedUseSystemColorScheme === 'true';\n        const savedMode = storedMode === 'dark' || storedMode === 'light' ? storedMode : undefined;\n\n        dispatchTheme({\n          type: 'HYDRATE',\n          state: {\n            isUsingSystemColorScheme,\n            mode: isUsingSystemColorScheme ? systemMode : savedMode ?? systemMode,\n          },\n        });\n      } catch (error) {\n        console.error('Failed to load theme settings', error);\n      }\n    };\n\n    loadSettings();\n\n    return () => {\n      isMounted = false;\n    };\n  }, [isDarkModeEnabled, systemMode]);\n\n  // 시스템 다크 모드 변경에 따른 효과 적용\n  useEffect(() => {\n    dispatchTheme({ type: 'SYNC_SYSTEM_MODE', systemMode });\n  }, [systemMode]);\n\n  // 안드로이드 하단 제스쳐 영역 스타일\n  useEffect(() => {\n    if (Platform.OS === 'android') {\n      NavigationBar.setButtonStyleAsync(mode);\n      const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });\n      NavigationBar.setBackgroundColorAsync(currentPalette.background.base)\n    }\n  }, [mode, customPalette])\n\n  // 테마 토글 함수\n  const toggleTheme = useCallback(async () => {\n    const newMode = mode === 'light' ? 'dark' : 'light';\n    dispatchTheme({ type: 'TOGGLE_THEME' }); // 사용자 지정 모드로 전환\n    await AsyncStorage.multiSet([\n      ['useSystemColorScheme', 'false'],\n      ['themeMode', newMode],\n    ]);\n  }, [mode]);\n\n  // 시스템 모드 사용 설정 변경 함수\n  const handleSetUseSystemColorScheme = useCallback(async (useSystem: boolean) => {\n    dispatchTheme({ type: 'SET_USE_SYSTEM_COLOR_SCHEME', useSystem, systemMode });\n    await AsyncStorage.setItem('useSystemColorScheme', useSystem.toString());\n  }, [systemMode]);\n\n  const themeValue = useMemo(() => {\n    const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });\n    return {\n      palette: {\n        isUsingSystemColorScheme,\n        setUseSystemColorScheme: handleSetUseSystemColorScheme,\n        toggleTheme,\n        ...currentPalette, // 선택된 모드에 따른 팔레트 적용\n      },\n      typography: typography({ themeFonts }),\n      elevation: elevation(currentPalette)\n    };\n  }, [mode, isUsingSystemColorScheme, themeFonts, customPalette, handleSetUseSystemColorScheme, toggleTheme]);\n\n  return (\n    <ThemeContext.Provider value={themeValue}>\n      {children}\n    </ThemeContext.Provider>\n  );\n}\n"]}

package/build/overlay/BottomSheetOverlay/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/overlay/BottomSheetOverlay/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAOjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AA0CzD,iBAAS,kBAAkB,CAAC,EAC1B,eAAe,EACf,SAAS,EACT,OAAY,GACb,EAAE,oBAAoB,4BA6QtB;AA0CD,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/overlay/BottomSheetOverlay/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAOjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AA0CzD,iBAAS,kBAAkB,CAAC,EAC1B,eAAe,EACf,SAAS,EACT,OAAY,GACb,EAAE,oBAAoB,4BA4QtB;AA0CD,eAAe,kBAAkB,CAAC"}

package/build/overlay/BottomSheetOverlay/index.js

@@ -107,7 +107,6 @@ function BottomSheetOverlay({ headerComponent, component, options = {}, }) {
         };
     }, [bottomSheetVisible]);
     const animatedStyles = useAnimatedStyle(() => {
-        'worklet';
         return {
             transform: [
                 { translateY: translateY.value },

package/build/overlay/BottomSheetOverlay/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/overlay/BottomSheetOverlay/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState, useCallback, useMemo, useRef } from 'react';\nimport { StyleSheet, View, PanResponder, Keyboard, Platform, type KeyboardEvent, type LayoutChangeEvent, type PanResponderGestureState, type GestureResponderEvent, useWindowDimensions, type ViewStyle } from 'react-native';\nimport { useBottomSheet } from '../../model/useOverlay';\nimport Animated, { useAnimatedStyle, useSharedValue, withSpring, withTiming } from 'react-native-reanimated';\nimport ModalBackground from '../ui/ModalBackground';\nimport { useTheme } from '../../context/ThemeContext';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { ShowBottomSheetProps } from '../../model/types';\nimport { MAX_FOLDABLE_SINGLE_WIDTH, Z_INDEX_VALUE } from '../../model/utils';\nimport useKeyboard from '../../model/useKeyboard';\nimport useFoldingState from '../../model/useFoldingState';\n\nconst IS_IOS = Platform.OS === 'ios';\n\nconst ANIMATION_CONFIG = {\n  keyboard: {\n    show: { duration: 250 },\n    hide: { duration: 150 },\n  },\n  spring: {\n    damping: 50,\n    stiffness: 300,\n    mass: 0.7,\n    velocity: 100,\n    restDisplacementThreshold: 0.2,\n  },\n  close: { duration: 150 },\n  scale: { duration: 200 },\n  scaleRestore: {\n    damping: 15,\n    stiffness: 300,\n  },\n} as const;\n\nconst GESTURE_CONSTANTS = {\n  scaleAmount: 0.985,\n  horizontalDamping: 18,\n  verticalUpDamping: 18,\n  verticalDownDamping: 1.5,\n  closeVelocityThreshold: 0.5,\n  closeDistanceRatio: 1 / 3,\n  minimumCloseDistance: 80,\n  hideDelay: 200,\n  moveThreshold: 10, // 드래그로 인식하기 위한 최소 이동 거리 (px)\n} as const;\n\nconst getSafeFiniteNumber = (value: number, fallback: number) =>\n  Number.isFinite(value) ? value : fallback;\n\nfunction BottomSheetOverlay({\n  headerComponent,\n  component,\n  options = {},\n}: ShowBottomSheetProps) {\n  const {\n    foldableSingleScreen = false,\n    isBackgroundTouchClose = true,\n    marginHorizontal = 10,\n    marginBottom = 10,\n    padding = 14,\n  } = options;\n  const { height: windowHeight } = useWindowDimensions();\n  const { width: windowWidth } = useFoldingState();\n  const { palette } = useTheme();\n  const { bottomSheetVisible, setBottomSheetVisible, height, maxHeight } = useBottomSheet();\n  const { bottom: bottomInsets, top: topInsets } = useSafeAreaInsets();\n  const [sheetHeight, setSheetHeight] = useState(0);\n  const isAutoHeight = height === 'auto';\n\n  const viewportMaxHeight = useMemo(() =>\n    Math.max(\n      windowHeight - 30 - bottomInsets - topInsets,\n      0\n    ),\n    [bottomInsets, topInsets, windowHeight]\n  );\n\n  const constrainedMaxHeight = useMemo(() => {\n    const maxHeightLimit = Math.max(getSafeFiniteNumber(maxHeight, viewportMaxHeight), 0);\n\n    if (isAutoHeight) {\n      return Math.min(viewportMaxHeight, maxHeightLimit);\n    }\n\n    return Math.min(viewportMaxHeight, maxHeightLimit, Math.max(getSafeFiniteNumber(height, 0), 0));\n  }, [height, isAutoHeight, maxHeight, viewportMaxHeight]);\n\n  const translateY = useSharedValue(0);\n  const translateX = useSharedValue(0);\n  const scale = useSharedValue(1);\n  const startX = useSharedValue(0);\n  const startY = useSharedValue(0);\n  const isGesturing = useSharedValue(false);\n\n  const [localVisible, setLocalVisible] = useState(false);\n  const latestCloseOffsetRef = useRef(constrainedMaxHeight + 100);\n  const closingOffsetRef = useRef(constrainedMaxHeight + 100);\n\n  useEffect(() => {\n    latestCloseOffsetRef.current = sheetHeight > 0 ? sheetHeight + 100 : constrainedMaxHeight + 100;\n  }, [constrainedMaxHeight, sheetHeight]);\n\n  const handleKeyboardShow = useCallback((event: KeyboardEvent) => {\n    if (!isGesturing.value) {\n      const targetY = -event.endCoordinates.height + (IS_IOS ? bottomInsets : 0);\n      translateY.value = withTiming(targetY, ANIMATION_CONFIG.keyboard.show);\n    }\n  }, [bottomInsets]);\n\n  const handleKeyboardHide = useCallback(() => {\n    if (!isGesturing.value) {\n      translateY.value = withTiming(0, ANIMATION_CONFIG.keyboard.hide);\n    }\n  }, []);\n\n  useKeyboard({\n    handleKeyboardShow,\n    handleKeyboardHide,\n  });\n\n  // BottomSheet 표시/숨김 애니메이션 처리\n  useEffect(() => {\n    let timeoutId: ReturnType<typeof setTimeout>;\n\n    if (bottomSheetVisible) {\n      closingOffsetRef.current = latestCloseOffsetRef.current;\n      Keyboard.dismiss();\n      setLocalVisible(true);\n      translateY.value = withSpring(0, ANIMATION_CONFIG.spring);\n    } else {\n      const targetCloseOffset = closingOffsetRef.current || latestCloseOffsetRef.current;\n      closingOffsetRef.current = targetCloseOffset;\n      translateY.value = withTiming(targetCloseOffset, ANIMATION_CONFIG.close);\n      timeoutId = setTimeout(() => {\n        setLocalVisible(false);\n      }, GESTURE_CONSTANTS.hideDelay);\n    }\n\n    return () => {\n      if (timeoutId) clearTimeout(timeoutId);\n    };\n  }, [bottomSheetVisible]);\n\n  const animatedStyles = useAnimatedStyle(() => {\n    'worklet';\n    return {\n      transform: [\n        { translateY: translateY.value },\n        { translateX: translateX.value },\n        { scale: scale.value }\n      ],\n    };\n  });\n\n  const dismissKeyboard = useCallback(() => {\n    Keyboard.dismiss();\n  }, []);\n\n  const closeBottomSheet = useCallback(() => {\n    setBottomSheetVisible(false);\n  }, [setBottomSheetVisible]);\n\n  const handleSheetLayout = useCallback((event: LayoutChangeEvent) => {\n    const nextHeight = Math.round(event.nativeEvent.layout.height);\n\n    if (nextHeight > 0) {\n      const nextCloseOffset = nextHeight + 100;\n      latestCloseOffsetRef.current = nextCloseOffset;\n      if (bottomSheetVisible) {\n        closingOffsetRef.current = nextCloseOffset;\n      }\n    }\n\n    setSheetHeight((prevHeight) => {\n      if (Math.abs(prevHeight - nextHeight) <= 1) {\n        return prevHeight;\n      }\n\n      return nextHeight;\n    });\n  }, [bottomSheetVisible]);\n\n  const handlePanResponderGrant = useCallback(() => {\n    dismissKeyboard();\n    isGesturing.value = true;\n    startX.value = translateX.value;\n    startY.value = translateY.value;\n    scale.value = withTiming(GESTURE_CONSTANTS.scaleAmount, ANIMATION_CONFIG.scale);\n  }, [dismissKeyboard]);\n\n  const handlePanResponderMove = useCallback((_: GestureResponderEvent, gestureState: PanResponderGestureState) => {\n    const newTranslateX = (startX.value + gestureState.dx) / GESTURE_CONSTANTS.horizontalDamping;\n    translateX.value = newTranslateX;\n\n    const newTranslateY = startY.value + gestureState.dy;\n    if (newTranslateY < 0) {\n      translateY.value = newTranslateY / GESTURE_CONSTANTS.verticalUpDamping;\n    } else {\n      translateY.value = newTranslateY / GESTURE_CONSTANTS.verticalDownDamping;\n    }\n  }, []);\n\n  const handlePanResponderRelease = useCallback((_: GestureResponderEvent, gestureState: PanResponderGestureState) => {\n    isGesturing.value = false;\n    translateX.value = withTiming(0, { duration: 100 });\n\n    const dismissThresholdHeight = sheetHeight > 0 ? sheetHeight : constrainedMaxHeight;\n    const dismissDistanceThreshold = Math.max(\n      dismissThresholdHeight * GESTURE_CONSTANTS.closeDistanceRatio,\n      GESTURE_CONSTANTS.minimumCloseDistance\n    );\n    const shouldClose = gestureState.vy > GESTURE_CONSTANTS.closeVelocityThreshold ||\n      translateY.value > dismissDistanceThreshold;\n\n    if (shouldClose) {\n      const targetCloseOffset = latestCloseOffsetRef.current;\n      closingOffsetRef.current = targetCloseOffset;\n      translateY.value = withTiming(targetCloseOffset, ANIMATION_CONFIG.close);\n      closeBottomSheet();\n    } else {\n      translateY.value = withTiming(0, ANIMATION_CONFIG.close);\n    }\n\n    scale.value = withSpring(1, ANIMATION_CONFIG.scaleRestore);\n  }, [closeBottomSheet, constrainedMaxHeight, sheetHeight]);\n\n  const panResponder = useMemo(\n    () => PanResponder.create({\n      onStartShouldSetPanResponder: () => false,\n      onStartShouldSetPanResponderCapture: () => false,\n      onMoveShouldSetPanResponder: (_, gestureState) => {\n        // 일정 거리 이상 이동했을 때만 PanResponder가 응답 (탭과 드래그 구분)\n        const { dx, dy } = gestureState;\n        return Math.abs(dx) > GESTURE_CONSTANTS.moveThreshold || Math.abs(dy) > GESTURE_CONSTANTS.moveThreshold;\n      },\n      onMoveShouldSetPanResponderCapture: () => false,\n      onPanResponderGrant: handlePanResponderGrant,\n      onPanResponderMove: handlePanResponderMove,\n      onPanResponderRelease: handlePanResponderRelease,\n    }),\n    [handlePanResponderGrant, handlePanResponderMove, handlePanResponderRelease]\n  );\n\n  // 배경 터치 핸들러\n  const handleBackgroundPress = useCallback(() => {\n    if (isBackgroundTouchClose) setBottomSheetVisible(false);\n  }, [isBackgroundTouchClose, setBottomSheetVisible]);\n\n  const containerHeightStyle = useMemo<ViewStyle>(() => {\n    if (isAutoHeight) {\n      return { maxHeight: constrainedMaxHeight };\n    }\n\n    return {\n      height: constrainedMaxHeight,\n      maxHeight: constrainedMaxHeight,\n    };\n  }, [constrainedMaxHeight, isAutoHeight]);\n\n  const containerStyle = [\n    styles.container,\n    containerHeightStyle,\n    {\n      width: options.type === 'fixed' ? '100%' : windowWidth - marginHorizontal * 2,\n      maxWidth: foldableSingleScreen ? MAX_FOLDABLE_SINGLE_WIDTH : '100%',\n      marginHorizontal: options.type === 'fixed' ? 0 : marginHorizontal,\n      bottom: options.type === 'fixed' ? 0 : marginBottom + bottomInsets,\n      paddingBottom: options.type === 'fixed' ? bottomInsets : 0,\n      backgroundColor: palette.background.base,\n      ... (options.type === 'fixed' ? { borderTopLeftRadius: 26, borderTopRightRadius: 26, borderBottomLeftRadius: 0, borderBottomRightRadius: 0 } : { borderRadius: 26 }),\n    },\n    animatedStyles,\n  ] as ViewStyle[];\n\n  const pressableViewStyle = [\n    styles.pressableView,\n    { paddingHorizontal: padding, paddingBottom: padding },\n    isAutoHeight ? styles.pressableViewAuto : styles.pressableViewFill,\n  ];\n\n  const contentWrapperStyle = [\n    styles.contentWrapper,\n    isAutoHeight ? styles.contentWrapperAuto : styles.contentWrapperFill,\n  ];\n\n  const gestureBarContainerStyle = [\n    styles.gestureBarContainer,\n    { paddingBottom: padding }\n  ];\n\n  const gestureBarStyle = [\n    styles.gestureBar,\n    { backgroundColor: palette.grey[60] }\n  ];\n\n  if (!localVisible) {\n    return null;\n  }\n\n  return (\n    <ModalBackground\n      zIndex={Z_INDEX_VALUE.BOTTOM_SHEET1}\n      key={localVisible ? 'visiblebs' : 'hiddenbs'}\n      modalBgColor={palette.modalBgColor}\n      onPress={handleBackgroundPress}\n    >\n      <Animated.View style={containerStyle} onLayout={handleSheetLayout}>\n        <View style={pressableViewStyle}>\n          <View {...panResponder.panHandlers}>\n            <View style={gestureBarContainerStyle}>\n              <View style={gestureBarStyle} />\n            </View>\n            {headerComponent}\n          </View>\n\n          <View style={contentWrapperStyle}>\n            {component}\n          </View>\n        </View>\n      </Animated.View>\n    </ModalBackground>\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    position: 'absolute',\n    borderRadius: 26,\n    overflow: 'hidden',\n    zIndex: Z_INDEX_VALUE.BOTTOM_SHEET2,\n  },\n  pressableView: {\n    width: '100%',\n    maxHeight: '100%',\n  },\n  pressableViewFill: {\n    height: '100%',\n  },\n  pressableViewAuto: {\n    flexShrink: 1,\n  },\n  contentWrapper: {\n    minHeight: 0,\n  },\n  contentWrapperFill: {\n    flex: 1,\n  },\n  contentWrapperAuto: {\n    flexShrink: 1,\n    maxHeight: '100%',\n  },\n  gestureBarContainer: {\n    width: '100%',\n    paddingTop: 10,\n    justifyContent: 'center',\n    alignItems: 'center',\n  },\n  gestureBar: {\n    width: 45,\n    height: 3,\n    borderRadius: 2,\n  },\n});\n\nexport default BottomSheetOverlay;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/overlay/BottomSheetOverlay/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState, useCallback, useMemo, useRef } from 'react';\nimport { StyleSheet, View, PanResponder, Keyboard, Platform, type KeyboardEvent, type LayoutChangeEvent, type PanResponderGestureState, type GestureResponderEvent, useWindowDimensions, type ViewStyle } from 'react-native';\nimport { useBottomSheet } from '../../model/useOverlay';\nimport Animated, { useAnimatedStyle, useSharedValue, withSpring, withTiming } from 'react-native-reanimated';\nimport ModalBackground from '../ui/ModalBackground';\nimport { useTheme } from '../../context/ThemeContext';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { ShowBottomSheetProps } from '../../model/types';\nimport { MAX_FOLDABLE_SINGLE_WIDTH, Z_INDEX_VALUE } from '../../model/utils';\nimport useKeyboard from '../../model/useKeyboard';\nimport useFoldingState from '../../model/useFoldingState';\n\nconst IS_IOS = Platform.OS === 'ios';\n\nconst ANIMATION_CONFIG = {\n  keyboard: {\n    show: { duration: 250 },\n    hide: { duration: 150 },\n  },\n  spring: {\n    damping: 50,\n    stiffness: 300,\n    mass: 0.7,\n    velocity: 100,\n    restDisplacementThreshold: 0.2,\n  },\n  close: { duration: 150 },\n  scale: { duration: 200 },\n  scaleRestore: {\n    damping: 15,\n    stiffness: 300,\n  },\n} as const;\n\nconst GESTURE_CONSTANTS = {\n  scaleAmount: 0.985,\n  horizontalDamping: 18,\n  verticalUpDamping: 18,\n  verticalDownDamping: 1.5,\n  closeVelocityThreshold: 0.5,\n  closeDistanceRatio: 1 / 3,\n  minimumCloseDistance: 80,\n  hideDelay: 200,\n  moveThreshold: 10, // 드래그로 인식하기 위한 최소 이동 거리 (px)\n} as const;\n\nconst getSafeFiniteNumber = (value: number, fallback: number) =>\n  Number.isFinite(value) ? value : fallback;\n\nfunction BottomSheetOverlay({\n  headerComponent,\n  component,\n  options = {},\n}: ShowBottomSheetProps) {\n  const {\n    foldableSingleScreen = false,\n    isBackgroundTouchClose = true,\n    marginHorizontal = 10,\n    marginBottom = 10,\n    padding = 14,\n  } = options;\n  const { height: windowHeight } = useWindowDimensions();\n  const { width: windowWidth } = useFoldingState();\n  const { palette } = useTheme();\n  const { bottomSheetVisible, setBottomSheetVisible, height, maxHeight } = useBottomSheet();\n  const { bottom: bottomInsets, top: topInsets } = useSafeAreaInsets();\n  const [sheetHeight, setSheetHeight] = useState(0);\n  const isAutoHeight = height === 'auto';\n\n  const viewportMaxHeight = useMemo(() =>\n    Math.max(\n      windowHeight - 30 - bottomInsets - topInsets,\n      0\n    ),\n    [bottomInsets, topInsets, windowHeight]\n  );\n\n  const constrainedMaxHeight = useMemo(() => {\n    const maxHeightLimit = Math.max(getSafeFiniteNumber(maxHeight, viewportMaxHeight), 0);\n\n    if (isAutoHeight) {\n      return Math.min(viewportMaxHeight, maxHeightLimit);\n    }\n\n    return Math.min(viewportMaxHeight, maxHeightLimit, Math.max(getSafeFiniteNumber(height, 0), 0));\n  }, [height, isAutoHeight, maxHeight, viewportMaxHeight]);\n\n  const translateY = useSharedValue(0);\n  const translateX = useSharedValue(0);\n  const scale = useSharedValue(1);\n  const startX = useSharedValue(0);\n  const startY = useSharedValue(0);\n  const isGesturing = useSharedValue(false);\n\n  const [localVisible, setLocalVisible] = useState(false);\n  const latestCloseOffsetRef = useRef(constrainedMaxHeight + 100);\n  const closingOffsetRef = useRef(constrainedMaxHeight + 100);\n\n  useEffect(() => {\n    latestCloseOffsetRef.current = sheetHeight > 0 ? sheetHeight + 100 : constrainedMaxHeight + 100;\n  }, [constrainedMaxHeight, sheetHeight]);\n\n  const handleKeyboardShow = useCallback((event: KeyboardEvent) => {\n    if (!isGesturing.value) {\n      const targetY = -event.endCoordinates.height + (IS_IOS ? bottomInsets : 0);\n      translateY.value = withTiming(targetY, ANIMATION_CONFIG.keyboard.show);\n    }\n  }, [bottomInsets]);\n\n  const handleKeyboardHide = useCallback(() => {\n    if (!isGesturing.value) {\n      translateY.value = withTiming(0, ANIMATION_CONFIG.keyboard.hide);\n    }\n  }, []);\n\n  useKeyboard({\n    handleKeyboardShow,\n    handleKeyboardHide,\n  });\n\n  // BottomSheet 표시/숨김 애니메이션 처리\n  useEffect(() => {\n    let timeoutId: ReturnType<typeof setTimeout>;\n\n    if (bottomSheetVisible) {\n      closingOffsetRef.current = latestCloseOffsetRef.current;\n      Keyboard.dismiss();\n      setLocalVisible(true);\n      translateY.value = withSpring(0, ANIMATION_CONFIG.spring);\n    } else {\n      const targetCloseOffset = closingOffsetRef.current || latestCloseOffsetRef.current;\n      closingOffsetRef.current = targetCloseOffset;\n      translateY.value = withTiming(targetCloseOffset, ANIMATION_CONFIG.close);\n      timeoutId = setTimeout(() => {\n        setLocalVisible(false);\n      }, GESTURE_CONSTANTS.hideDelay);\n    }\n\n    return () => {\n      if (timeoutId) clearTimeout(timeoutId);\n    };\n  }, [bottomSheetVisible]);\n\n  const animatedStyles = useAnimatedStyle(() => {\n    return {\n      transform: [\n        { translateY: translateY.value },\n        { translateX: translateX.value },\n        { scale: scale.value }\n      ],\n    };\n  });\n\n  const dismissKeyboard = useCallback(() => {\n    Keyboard.dismiss();\n  }, []);\n\n  const closeBottomSheet = useCallback(() => {\n    setBottomSheetVisible(false);\n  }, [setBottomSheetVisible]);\n\n  const handleSheetLayout = useCallback((event: LayoutChangeEvent) => {\n    const nextHeight = Math.round(event.nativeEvent.layout.height);\n\n    if (nextHeight > 0) {\n      const nextCloseOffset = nextHeight + 100;\n      latestCloseOffsetRef.current = nextCloseOffset;\n      if (bottomSheetVisible) {\n        closingOffsetRef.current = nextCloseOffset;\n      }\n    }\n\n    setSheetHeight((prevHeight) => {\n      if (Math.abs(prevHeight - nextHeight) <= 1) {\n        return prevHeight;\n      }\n\n      return nextHeight;\n    });\n  }, [bottomSheetVisible]);\n\n  const handlePanResponderGrant = useCallback(() => {\n    dismissKeyboard();\n    isGesturing.value = true;\n    startX.value = translateX.value;\n    startY.value = translateY.value;\n    scale.value = withTiming(GESTURE_CONSTANTS.scaleAmount, ANIMATION_CONFIG.scale);\n  }, [dismissKeyboard]);\n\n  const handlePanResponderMove = useCallback((_: GestureResponderEvent, gestureState: PanResponderGestureState) => {\n    const newTranslateX = (startX.value + gestureState.dx) / GESTURE_CONSTANTS.horizontalDamping;\n    translateX.value = newTranslateX;\n\n    const newTranslateY = startY.value + gestureState.dy;\n    if (newTranslateY < 0) {\n      translateY.value = newTranslateY / GESTURE_CONSTANTS.verticalUpDamping;\n    } else {\n      translateY.value = newTranslateY / GESTURE_CONSTANTS.verticalDownDamping;\n    }\n  }, []);\n\n  const handlePanResponderRelease = useCallback((_: GestureResponderEvent, gestureState: PanResponderGestureState) => {\n    isGesturing.value = false;\n    translateX.value = withTiming(0, { duration: 100 });\n\n    const dismissThresholdHeight = sheetHeight > 0 ? sheetHeight : constrainedMaxHeight;\n    const dismissDistanceThreshold = Math.max(\n      dismissThresholdHeight * GESTURE_CONSTANTS.closeDistanceRatio,\n      GESTURE_CONSTANTS.minimumCloseDistance\n    );\n    const shouldClose = gestureState.vy > GESTURE_CONSTANTS.closeVelocityThreshold ||\n      translateY.value > dismissDistanceThreshold;\n\n    if (shouldClose) {\n      const targetCloseOffset = latestCloseOffsetRef.current;\n      closingOffsetRef.current = targetCloseOffset;\n      translateY.value = withTiming(targetCloseOffset, ANIMATION_CONFIG.close);\n      closeBottomSheet();\n    } else {\n      translateY.value = withTiming(0, ANIMATION_CONFIG.close);\n    }\n\n    scale.value = withSpring(1, ANIMATION_CONFIG.scaleRestore);\n  }, [closeBottomSheet, constrainedMaxHeight, sheetHeight]);\n\n  const panResponder = useMemo(\n    () => PanResponder.create({\n      onStartShouldSetPanResponder: () => false,\n      onStartShouldSetPanResponderCapture: () => false,\n      onMoveShouldSetPanResponder: (_, gestureState) => {\n        // 일정 거리 이상 이동했을 때만 PanResponder가 응답 (탭과 드래그 구분)\n        const { dx, dy } = gestureState;\n        return Math.abs(dx) > GESTURE_CONSTANTS.moveThreshold || Math.abs(dy) > GESTURE_CONSTANTS.moveThreshold;\n      },\n      onMoveShouldSetPanResponderCapture: () => false,\n      onPanResponderGrant: handlePanResponderGrant,\n      onPanResponderMove: handlePanResponderMove,\n      onPanResponderRelease: handlePanResponderRelease,\n    }),\n    [handlePanResponderGrant, handlePanResponderMove, handlePanResponderRelease]\n  );\n\n  // 배경 터치 핸들러\n  const handleBackgroundPress = useCallback(() => {\n    if (isBackgroundTouchClose) setBottomSheetVisible(false);\n  }, [isBackgroundTouchClose, setBottomSheetVisible]);\n\n  const containerHeightStyle = useMemo<ViewStyle>(() => {\n    if (isAutoHeight) {\n      return { maxHeight: constrainedMaxHeight };\n    }\n\n    return {\n      height: constrainedMaxHeight,\n      maxHeight: constrainedMaxHeight,\n    };\n  }, [constrainedMaxHeight, isAutoHeight]);\n\n  const containerStyle = [\n    styles.container,\n    containerHeightStyle,\n    {\n      width: options.type === 'fixed' ? '100%' : windowWidth - marginHorizontal * 2,\n      maxWidth: foldableSingleScreen ? MAX_FOLDABLE_SINGLE_WIDTH : '100%',\n      marginHorizontal: options.type === 'fixed' ? 0 : marginHorizontal,\n      bottom: options.type === 'fixed' ? 0 : marginBottom + bottomInsets,\n      paddingBottom: options.type === 'fixed' ? bottomInsets : 0,\n      backgroundColor: palette.background.base,\n      ... (options.type === 'fixed' ? { borderTopLeftRadius: 26, borderTopRightRadius: 26, borderBottomLeftRadius: 0, borderBottomRightRadius: 0 } : { borderRadius: 26 }),\n    },\n    animatedStyles,\n  ] as ViewStyle[];\n\n  const pressableViewStyle = [\n    styles.pressableView,\n    { paddingHorizontal: padding, paddingBottom: padding },\n    isAutoHeight ? styles.pressableViewAuto : styles.pressableViewFill,\n  ];\n\n  const contentWrapperStyle = [\n    styles.contentWrapper,\n    isAutoHeight ? styles.contentWrapperAuto : styles.contentWrapperFill,\n  ];\n\n  const gestureBarContainerStyle = [\n    styles.gestureBarContainer,\n    { paddingBottom: padding }\n  ];\n\n  const gestureBarStyle = [\n    styles.gestureBar,\n    { backgroundColor: palette.grey[60] }\n  ];\n\n  if (!localVisible) {\n    return null;\n  }\n\n  return (\n    <ModalBackground\n      zIndex={Z_INDEX_VALUE.BOTTOM_SHEET1}\n      key={localVisible ? 'visiblebs' : 'hiddenbs'}\n      modalBgColor={palette.modalBgColor}\n      onPress={handleBackgroundPress}\n    >\n      <Animated.View style={containerStyle} onLayout={handleSheetLayout}>\n        <View style={pressableViewStyle}>\n          <View {...panResponder.panHandlers}>\n            <View style={gestureBarContainerStyle}>\n              <View style={gestureBarStyle} />\n            </View>\n            {headerComponent}\n          </View>\n\n          <View style={contentWrapperStyle}>\n            {component}\n          </View>\n        </View>\n      </Animated.View>\n    </ModalBackground>\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    position: 'absolute',\n    borderRadius: 26,\n    overflow: 'hidden',\n    zIndex: Z_INDEX_VALUE.BOTTOM_SHEET2,\n  },\n  pressableView: {\n    width: '100%',\n    maxHeight: '100%',\n  },\n  pressableViewFill: {\n    height: '100%',\n  },\n  pressableViewAuto: {\n    flexShrink: 1,\n  },\n  contentWrapper: {\n    minHeight: 0,\n  },\n  contentWrapperFill: {\n    flex: 1,\n  },\n  contentWrapperAuto: {\n    flexShrink: 1,\n    maxHeight: '100%',\n  },\n  gestureBarContainer: {\n    width: '100%',\n    paddingTop: 10,\n    justifyContent: 'center',\n    alignItems: 'center',\n  },\n  gestureBar: {\n    width: 45,\n    height: 3,\n    borderRadius: 2,\n  },\n});\n\nexport default BottomSheetOverlay;\n"]}

package/build/overlay/Modality/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/overlay/Modality/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAWnD,iBAAS,QAAQ,CAAC,EAChB,oBAAoB,EACpB,iBAAiB,GAClB,EAAE;IACD,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,oBAAoB,EAAE,OAAO,CAAC;CAC/B,4BAmHA;AA6BD,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/overlay/Modality/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAWnD,iBAAS,QAAQ,CAAC,EAChB,oBAAoB,EACpB,iBAAiB,GAClB,EAAE;IACD,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,oBAAoB,EAAE,OAAO,CAAC;CAC/B,4BAgHA;AA6BD,eAAe,QAAQ,CAAC"}

package/build/overlay/Modality/index.js

@@ -50,7 +50,6 @@ function Modality({ foldableSingleScreen, modalityComponent, }) {
     }, [modalityVisible, insets.top]);
     // 부모 스크린
     const backScreenAnimatedStyle = useAnimatedStyle(() => {
-        'worklet';
         return {
             transform: [
                 { scaleX: backScale.value },
@@ -62,7 +61,6 @@ function Modality({ foldableSingleScreen, modalityComponent, }) {
     });
     // 아래에서 등장하는 Modality 화면
     const mainScreenAnimatedStyle = useAnimatedStyle(() => {
-        'worklet';
         return {
             transform: [
                 { translateY: mainTranslateY.value }
@@ -71,7 +69,6 @@ function Modality({ foldableSingleScreen, modalityComponent, }) {
     });
     // 배경 불투명도 스타일
     const backgroundAnimatedStyle = useAnimatedStyle(() => {
-        'worklet';
         return {
             opacity: backgroundOpacity.value
         };

package/build/overlay/Modality/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/overlay/Modality/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Dimensions, StatusBar, StyleSheet } from 'react-native';\nimport { useSafeAreaInsets, initialWindowMetrics } from 'react-native-safe-area-context';\nimport Animated, { FadeOut, useAnimatedStyle, withTiming, withDelay, useSharedValue } from 'react-native-reanimated';\nimport { useModality } from '../../model/useOverlay';\nimport { MAX_FOLDABLE_SINGLE_WIDTH, Z_INDEX_VALUE } from '../../model/utils';\nimport ZSView from '../../ui/ZSView';\nimport { useTheme } from '../../context/ThemeContext';\n\nconst windowHeight = Dimensions.get('window').height;\n\nfunction Modality({\n  foldableSingleScreen,\n  modalityComponent,\n}: {\n  modalityComponent: React.ReactNode;\n  foldableSingleScreen: boolean;\n}) {\n  const { palette } = useTheme();\n  const [localVisible, setLocalVisible] = useState(false);\n  const { modalityVisible } = useModality();\n  const insets = useSafeAreaInsets();\n  const backScale = useSharedValue(1);\n  const backTranslateY = useSharedValue(0);\n  const backBorderRadius = useSharedValue(0);\n  const mainTranslateY = useSharedValue(windowHeight);\n  const backgroundOpacity = useSharedValue(1);\n  const overrideMargin = 10;\n  const mainScreenMargin = insets.top;\n  const mainScrrenPadding = (initialWindowMetrics?.insets.bottom || insets.bottom);\n\n  // 애니메이션 트리거\n  useEffect(() => {\n    let timeoutId: ReturnType<typeof setTimeout>;\n    \n    if (modalityVisible) {\n      // 모달이 열리는 애니메이션\n      setLocalVisible(true);\n      backScale.value = withDelay(100, withTiming(0.92, { duration: 200 }));\n      backTranslateY.value = withDelay(300, withTiming(insets.top, { duration: 200 }));\n      backBorderRadius.value = withDelay(100, withTiming(12, { duration: 200 }));\n      mainTranslateY.value = withDelay(200, withTiming(overrideMargin + insets.top, { duration: 200 }));\n      backgroundOpacity.value = withTiming(1, { duration: 500 });\n    } else {\n      // 모달이 닫히는 애니메이션 (역순)\n      backScale.value = withTiming(1, { duration: 100 });\n      backTranslateY.value = withTiming(0, { duration: 100 });\n      backBorderRadius.value = withTiming(0, { duration: 100 });\n      mainTranslateY.value = withTiming(windowHeight, { duration: 200 });\n      backgroundOpacity.value = withTiming(0, { duration: 300 });\n      timeoutId = setTimeout(() => {\n        setLocalVisible(false);\n      }, 500);\n    }\n\n    return () => {\n      if (timeoutId) clearTimeout(timeoutId);\n    };\n  }, [modalityVisible, insets.top]);\n\n  // 부모 스크린\n  const backScreenAnimatedStyle = useAnimatedStyle(() => {\n    'worklet';\n    return {\n      transform: [\n        { scaleX: backScale.value },\n        { translateY: backTranslateY.value }\n      ],\n      borderTopLeftRadius: backBorderRadius.value,\n      borderTopRightRadius: backBorderRadius.value,\n    };\n  });\n\n  // 아래에서 등장하는 Modality 화면\n  const mainScreenAnimatedStyle = useAnimatedStyle(() => {\n    'worklet';\n    return {\n      transform: [\n        { translateY: mainTranslateY.value }\n      ]\n    };\n  });\n\n  // 배경 불투명도 스타일\n  const backgroundAnimatedStyle = useAnimatedStyle(() => {\n    'worklet';\n    return {\n      opacity: backgroundOpacity.value\n    };\n  });\n\n  return (\n    !localVisible ? null :\n      <Animated.View\n        key={localVisible ? 'visiblemd' : 'hiddenmd'}\n        style={[\n          styles.animatedBackground,\n          { backgroundColor: palette.background.neutral },\n          backgroundAnimatedStyle\n        ]}\n      >\n        <StatusBar backgroundColor={modalityVisible ? palette.background.neutral : palette.background.base} />\n\n        <Animated.View\n          exiting={FadeOut.duration(300)}\n          style={[\n            styles.backScreen,\n            { backgroundColor: palette.background.layer2, width: '100%', height: windowHeight, maxWidth: foldableSingleScreen ? MAX_FOLDABLE_SINGLE_WIDTH : '100%' },\n            backScreenAnimatedStyle\n          ]}\n        />\n\n        <Animated.View\n          style={[\n            {\n              height: windowHeight - mainScreenMargin,\n              paddingBottom: mainScrrenPadding,\n              backgroundColor: palette.background.base,\n              width: '100%',\n              maxWidth: foldableSingleScreen ? MAX_FOLDABLE_SINGLE_WIDTH : '100%',\n              alignSelf: 'center',\n            },\n            styles.mainScreen,\n            mainScreenAnimatedStyle\n          ]}\n        >\n          <ZSView style={[styles.contents, { width: '100%'}]}>\n            {modalityComponent}\n          </ZSView>\n        </Animated.View>\n      </Animated.View>\n  );\n}\n\nconst styles = StyleSheet.create({\n  contents: {\n    flex: 1,\n    paddingTop: 10,\n    zIndex: Z_INDEX_VALUE.MODAL4,\n  },\n  animatedBackground: {\n    ...StyleSheet.absoluteFillObject,\n    zIndex: Z_INDEX_VALUE.MODAL1,\n    alignSelf: 'center',\n  },\n  backScreen: {\n    position: 'absolute',\n    justifyContent: 'center',\n    alignItems: 'center',\n    alignSelf: 'center',\n    zIndex: Z_INDEX_VALUE.MODAL2,\n  },\n  mainScreen: {\n    position: 'absolute',\n    borderTopLeftRadius: 16,\n    borderTopRightRadius: 16,\n    zIndex: Z_INDEX_VALUE.MODAL3,\n    overflow: 'hidden',\n  },\n});\n\nexport default Modality;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/overlay/Modality/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Dimensions, StatusBar, StyleSheet } from 'react-native';\nimport { useSafeAreaInsets, initialWindowMetrics } from 'react-native-safe-area-context';\nimport Animated, { FadeOut, useAnimatedStyle, withTiming, withDelay, useSharedValue } from 'react-native-reanimated';\nimport { useModality } from '../../model/useOverlay';\nimport { MAX_FOLDABLE_SINGLE_WIDTH, Z_INDEX_VALUE } from '../../model/utils';\nimport ZSView from '../../ui/ZSView';\nimport { useTheme } from '../../context/ThemeContext';\n\nconst windowHeight = Dimensions.get('window').height;\n\nfunction Modality({\n  foldableSingleScreen,\n  modalityComponent,\n}: {\n  modalityComponent: React.ReactNode;\n  foldableSingleScreen: boolean;\n}) {\n  const { palette } = useTheme();\n  const [localVisible, setLocalVisible] = useState(false);\n  const { modalityVisible } = useModality();\n  const insets = useSafeAreaInsets();\n  const backScale = useSharedValue(1);\n  const backTranslateY = useSharedValue(0);\n  const backBorderRadius = useSharedValue(0);\n  const mainTranslateY = useSharedValue(windowHeight);\n  const backgroundOpacity = useSharedValue(1);\n  const overrideMargin = 10;\n  const mainScreenMargin = insets.top;\n  const mainScrrenPadding = (initialWindowMetrics?.insets.bottom || insets.bottom);\n\n  // 애니메이션 트리거\n  useEffect(() => {\n    let timeoutId: ReturnType<typeof setTimeout>;\n    \n    if (modalityVisible) {\n      // 모달이 열리는 애니메이션\n      setLocalVisible(true);\n      backScale.value = withDelay(100, withTiming(0.92, { duration: 200 }));\n      backTranslateY.value = withDelay(300, withTiming(insets.top, { duration: 200 }));\n      backBorderRadius.value = withDelay(100, withTiming(12, { duration: 200 }));\n      mainTranslateY.value = withDelay(200, withTiming(overrideMargin + insets.top, { duration: 200 }));\n      backgroundOpacity.value = withTiming(1, { duration: 500 });\n    } else {\n      // 모달이 닫히는 애니메이션 (역순)\n      backScale.value = withTiming(1, { duration: 100 });\n      backTranslateY.value = withTiming(0, { duration: 100 });\n      backBorderRadius.value = withTiming(0, { duration: 100 });\n      mainTranslateY.value = withTiming(windowHeight, { duration: 200 });\n      backgroundOpacity.value = withTiming(0, { duration: 300 });\n      timeoutId = setTimeout(() => {\n        setLocalVisible(false);\n      }, 500);\n    }\n\n    return () => {\n      if (timeoutId) clearTimeout(timeoutId);\n    };\n  }, [modalityVisible, insets.top]);\n\n  // 부모 스크린\n  const backScreenAnimatedStyle = useAnimatedStyle(() => {\n    return {\n      transform: [\n        { scaleX: backScale.value },\n        { translateY: backTranslateY.value }\n      ],\n      borderTopLeftRadius: backBorderRadius.value,\n      borderTopRightRadius: backBorderRadius.value,\n    };\n  });\n\n  // 아래에서 등장하는 Modality 화면\n  const mainScreenAnimatedStyle = useAnimatedStyle(() => {\n    return {\n      transform: [\n        { translateY: mainTranslateY.value }\n      ]\n    };\n  });\n\n  // 배경 불투명도 스타일\n  const backgroundAnimatedStyle = useAnimatedStyle(() => {\n    return {\n      opacity: backgroundOpacity.value\n    };\n  });\n\n  return (\n    !localVisible ? null :\n      <Animated.View\n        key={localVisible ? 'visiblemd' : 'hiddenmd'}\n        style={[\n          styles.animatedBackground,\n          { backgroundColor: palette.background.neutral },\n          backgroundAnimatedStyle\n        ]}\n      >\n        <StatusBar backgroundColor={modalityVisible ? palette.background.neutral : palette.background.base} />\n\n        <Animated.View\n          exiting={FadeOut.duration(300)}\n          style={[\n            styles.backScreen,\n            { backgroundColor: palette.background.layer2, width: '100%', height: windowHeight, maxWidth: foldableSingleScreen ? MAX_FOLDABLE_SINGLE_WIDTH : '100%' },\n            backScreenAnimatedStyle\n          ]}\n        />\n\n        <Animated.View\n          style={[\n            {\n              height: windowHeight - mainScreenMargin,\n              paddingBottom: mainScrrenPadding,\n              backgroundColor: palette.background.base,\n              width: '100%',\n              maxWidth: foldableSingleScreen ? MAX_FOLDABLE_SINGLE_WIDTH : '100%',\n              alignSelf: 'center',\n            },\n            styles.mainScreen,\n            mainScreenAnimatedStyle\n          ]}\n        >\n          <ZSView style={[styles.contents, { width: '100%'}]}>\n            {modalityComponent}\n          </ZSView>\n        </Animated.View>\n      </Animated.View>\n  );\n}\n\nconst styles = StyleSheet.create({\n  contents: {\n    flex: 1,\n    paddingTop: 10,\n    zIndex: Z_INDEX_VALUE.MODAL4,\n  },\n  animatedBackground: {\n    ...StyleSheet.absoluteFillObject,\n    zIndex: Z_INDEX_VALUE.MODAL1,\n    alignSelf: 'center',\n  },\n  backScreen: {\n    position: 'absolute',\n    justifyContent: 'center',\n    alignItems: 'center',\n    alignSelf: 'center',\n    zIndex: Z_INDEX_VALUE.MODAL2,\n  },\n  mainScreen: {\n    position: 'absolute',\n    borderTopLeftRadius: 16,\n    borderTopRightRadius: 16,\n    zIndex: Z_INDEX_VALUE.MODAL3,\n    overflow: 'hidden',\n  },\n});\n\nexport default Modality;\n"]}

package/build/ui/ZSPressable/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSPressable/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,EAAmB,SAAS,EAAE,MAAM,cAAc,CAAC;AAG1D,OAAO,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAMvE,UAAU,gBAAiB,SAAQ,SAAS;IAC1C,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAChC,WAAW,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACpC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,iBAAS,WAAW,CAAC,EACnB,OAAO,EACP,WAAW,EACX,WAAkB,EAClB,sBAAmD,EACnD,6BAAkC,EAClC,cAAc,EACd,SAAiB,EACjB,KAAK,EACL,SAAiB,EACjB,QAAgB,EAChB,GAAG,KAAK,EACT,EAAE,gBAAgB,qBA+ElB;;AAED,wBAAuC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSPressable/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,EAAmB,SAAS,EAAE,MAAM,cAAc,CAAC;AAG1D,OAAO,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAMvE,UAAU,gBAAiB,SAAQ,SAAS;IAC1C,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAChC,WAAW,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACpC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,iBAAS,WAAW,CAAC,EACnB,OAAO,EACP,WAAW,EACX,WAAkB,EAClB,sBAAmD,EACnD,6BAAkC,EAClC,cAAc,EACd,SAAiB,EACjB,KAAK,EACL,SAAiB,EACjB,QAAgB,EAChB,GAAG,KAAK,EACT,EAAE,gBAAgB,qBA8ElB;;AAED,wBAAuC"}

package/build/ui/ZSPressable/index.js

@@ -24,7 +24,6 @@ function ZSPressable({ onPress, onLongPress, isAnimation = true, pressedBackgrou
     const handleLongPress = createPressHandler(onLongPress);
     // ------------------------------------------------------------
     const boxAnimation = useAnimatedStyle(() => {
-        'worklet';
         const scale = interpolate(isButtonPress.value, [0, 1], SCALE_VALUES, 'clamp');
         return {
             transform: [{ scale }],

package/build/ui/ZSPressable/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSPressable/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useRef } from \"react\";\nimport { Pressable, View, ViewProps } from \"react-native\";\nimport Animated, { interpolate, useAnimatedStyle, useSharedValue, withTiming } from \"react-native-reanimated\";\nimport AnimatedWrapper from \"../atoms/AnimatedWrapper\";\nimport type { ShadowLevel, ViewColorOptions } from \"../../theme/types\";\n\nconst DEFAULT_DURATION = { duration: 100 } as const;\nconst SCALE_VALUES = [1, 0.96] as const;\nconst DEBOUNCE_TIME = 300;\n\ninterface ZSPressableProps extends ViewProps {\n  onPress?: (value?: any) => void;\n  onLongPress?: (value?: any) => void;\n  pressedBackgroundColor?: string;\n  pressedBackgroundBorderRadius?: number;\n  isAnimation?: boolean;\n  elevationLevel?: ShadowLevel;\n  fullWidth?: boolean;\n  color?: ViewColorOptions;\n  isLoading?: boolean;\n  disabled?: boolean;\n}\n\nfunction ZSPressable({\n  onPress,\n  onLongPress,\n  isAnimation = true,\n  pressedBackgroundColor = 'rgba(180, 180, 180, 0.1)',\n  pressedBackgroundBorderRadius = 16,\n  elevationLevel,\n  fullWidth = false,\n  color,\n  isLoading = false,\n  disabled = false,\n  ...props\n}: ZSPressableProps) {\n  const isButtonPress = useSharedValue(0);\n  const lastClickTime = useRef<number>(0);\n\n  // ------------------------------------------------------------\n\n  const createPressHandler = (callback?: () => void) => {\n    return () => {\n      const now = Date.now();\n      if (now - lastClickTime.current < DEBOUNCE_TIME) return;\n      if (isLoading || disabled) return;\n      lastClickTime.current = now;\n\n      callback?.();\n    };\n  };\n\n  const handlePress = createPressHandler(onPress);\n  const handleLongPress = createPressHandler(onLongPress);\n\n  // ------------------------------------------------------------\n\n  const boxAnimation = useAnimatedStyle(() => {\n    'worklet';\n    const scale = interpolate(\n      isButtonPress.value,\n      [0, 1],\n      SCALE_VALUES,\n      'clamp'\n    );\n    return {\n      transform: [{ scale }],\n    };\n  }, []);\n\n  const handlePressIn = () => {\n    isButtonPress.value = withTiming(1, DEFAULT_DURATION);\n  };\n\n  const handlePressOut = () => {\n    isButtonPress.value = withTiming(0, DEFAULT_DURATION);\n  };\n\n  const handlePressStyle = (pressed: boolean) => {\n    return pressed\n      ? {\n        backgroundColor: pressedBackgroundColor,\n        borderRadius: pressedBackgroundBorderRadius,\n      }\n      : {\n        backgroundColor: 'transparent',\n        borderRadius: pressedBackgroundBorderRadius,\n      };\n  };\n\n  return (\n    <View style={[fullWidth ? { width: '100%' as const } : undefined, { opacity: (isLoading || disabled) ? 0.55 : 1 }]}>\n      <Pressable\n        {...props}\n        onPress={handlePress}\n        onLongPress={handleLongPress}\n        onPressIn={handlePressIn}\n        onPressOut={handlePressOut}\n        disabled={isLoading || disabled}\n        style={({ pressed }) => handlePressStyle(pressed)}\n      >\n        <Animated.View style={boxAnimation}>\n          <AnimatedWrapper\n            color={color}\n            isAnimation={isAnimation}\n            elevationLevel={elevationLevel}\n            style={props.style}\n          >\n            {props.children}\n          </AnimatedWrapper>\n        </Animated.View>\n      </Pressable>\n    </View>\n  );\n}\n\nexport default React.memo(ZSPressable);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSPressable/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useRef } from \"react\";\nimport { Pressable, View, ViewProps } from \"react-native\";\nimport Animated, { interpolate, useAnimatedStyle, useSharedValue, withTiming } from \"react-native-reanimated\";\nimport AnimatedWrapper from \"../atoms/AnimatedWrapper\";\nimport type { ShadowLevel, ViewColorOptions } from \"../../theme/types\";\n\nconst DEFAULT_DURATION = { duration: 100 } as const;\nconst SCALE_VALUES = [1, 0.96] as const;\nconst DEBOUNCE_TIME = 300;\n\ninterface ZSPressableProps extends ViewProps {\n  onPress?: (value?: any) => void;\n  onLongPress?: (value?: any) => void;\n  pressedBackgroundColor?: string;\n  pressedBackgroundBorderRadius?: number;\n  isAnimation?: boolean;\n  elevationLevel?: ShadowLevel;\n  fullWidth?: boolean;\n  color?: ViewColorOptions;\n  isLoading?: boolean;\n  disabled?: boolean;\n}\n\nfunction ZSPressable({\n  onPress,\n  onLongPress,\n  isAnimation = true,\n  pressedBackgroundColor = 'rgba(180, 180, 180, 0.1)',\n  pressedBackgroundBorderRadius = 16,\n  elevationLevel,\n  fullWidth = false,\n  color,\n  isLoading = false,\n  disabled = false,\n  ...props\n}: ZSPressableProps) {\n  const isButtonPress = useSharedValue(0);\n  const lastClickTime = useRef<number>(0);\n\n  // ------------------------------------------------------------\n\n  const createPressHandler = (callback?: () => void) => {\n    return () => {\n      const now = Date.now();\n      if (now - lastClickTime.current < DEBOUNCE_TIME) return;\n      if (isLoading || disabled) return;\n      lastClickTime.current = now;\n\n      callback?.();\n    };\n  };\n\n  const handlePress = createPressHandler(onPress);\n  const handleLongPress = createPressHandler(onLongPress);\n\n  // ------------------------------------------------------------\n\n  const boxAnimation = useAnimatedStyle(() => {\n    const scale = interpolate(\n      isButtonPress.value,\n      [0, 1],\n      SCALE_VALUES,\n      'clamp'\n    );\n    return {\n      transform: [{ scale }],\n    };\n  }, []);\n\n  const handlePressIn = () => {\n    isButtonPress.value = withTiming(1, DEFAULT_DURATION);\n  };\n\n  const handlePressOut = () => {\n    isButtonPress.value = withTiming(0, DEFAULT_DURATION);\n  };\n\n  const handlePressStyle = (pressed: boolean) => {\n    return pressed\n      ? {\n        backgroundColor: pressedBackgroundColor,\n        borderRadius: pressedBackgroundBorderRadius,\n      }\n      : {\n        backgroundColor: 'transparent',\n        borderRadius: pressedBackgroundBorderRadius,\n      };\n  };\n\n  return (\n    <View style={[fullWidth ? { width: '100%' as const } : undefined, { opacity: (isLoading || disabled) ? 0.55 : 1 }]}>\n      <Pressable\n        {...props}\n        onPress={handlePress}\n        onLongPress={handleLongPress}\n        onPressIn={handlePressIn}\n        onPressOut={handlePressOut}\n        disabled={isLoading || disabled}\n        style={({ pressed }) => handlePressStyle(pressed)}\n      >\n        <Animated.View style={boxAnimation}>\n          <AnimatedWrapper\n            color={color}\n            isAnimation={isAnimation}\n            elevationLevel={elevationLevel}\n            style={props.style}\n          >\n            {props.children}\n          </AnimatedWrapper>\n        </Animated.View>\n      </Pressable>\n    </View>\n  );\n}\n\nexport default React.memo(ZSPressable);\n"]}

package/build/ui/ZSSkeleton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSSkeleton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAc,KAAK,SAAS,EAAoB,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAM5G,UAAU,eAAgB,SAAQ,SAAS;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,iBAAS,UAAU,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,mSAwC3F;AAED,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSSkeleton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAc,KAAK,SAAS,EAAoB,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAM5G,UAAU,eAAgB,SAAQ,SAAS;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,iBAAS,UAAU,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,mSAuC3F;AAED,eAAe,UAAU,CAAC"}

package/build/ui/ZSSkeleton/index.js

@@ -20,7 +20,6 @@ function ZSSkeleton({ isFetching, style, children, overlayColor, ...props }) {
         };
     }, [isFetching]);
     const animatedStyle = useAnimatedStyle(() => {
-        "worklet";
         return {
             transform: [{ translateX: translateX.value }],
         };

package/build/ui/ZSSkeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSSkeleton/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from \"react\";\nimport { Dimensions, type StyleProp, StyleSheet, View, type ViewStyle, type ViewProps } from \"react-native\";\nimport Animated, { useSharedValue, useAnimatedStyle, withRepeat, withTiming, cancelAnimation } from \"react-native-reanimated\";\nimport { useTheme } from \"../../context/ThemeContext\";\n\nconst DEVICE_WIDTH = Dimensions.get(\"window\").width;\n\ninterface ZSSkeletonProps extends ViewProps {\n    isFetching?: boolean;\n    style?: StyleProp<ViewStyle>;\n    children?: React.ReactNode;\n    overlayColor?: string;\n}\n\nfunction ZSSkeleton({ isFetching, style, children, overlayColor, ...props }: ZSSkeletonProps) {\n    const translateX = useSharedValue(-DEVICE_WIDTH * 1.2);\n    const { palette } = useTheme();\n    const effectColor = overlayColor || palette.background.base;\n\n    useEffect(() => {\n        if (isFetching) {\n            translateX.value = withRepeat(withTiming(DEVICE_WIDTH * 1.2, { duration: 800 }), -1, false);\n        } else {\n            cancelAnimation(translateX);\n            translateX.value = -DEVICE_WIDTH * 1.2;\n        }\n\n        return () => {\n            cancelAnimation(translateX);\n        };\n    }, [isFetching]);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        \"worklet\";\n        return {\n            transform: [{ translateX: translateX.value }],\n        };\n    });\n\n    return isFetching ? (\n        <View style={[style, { overflow: \"hidden\" }]} {...props}>\n            <View style={styles.container}>\n                {children}\n\n                <Animated.View style={[styles.shimmer, animatedStyle]}>\n                    <View style={[styles.shimmerSub, { backgroundColor: effectColor }]} />\n                    <View style={[styles.shimmerCenter, { backgroundColor: effectColor }]} />\n                    <View style={[styles.shimmerSub, { backgroundColor: effectColor }]} />\n                </Animated.View>\n            </View>\n        </View>\n    ) : (\n        children\n    );\n}\n\nexport default ZSSkeleton;\n\nconst styles = StyleSheet.create({\n    container: {\n        overflow: \"hidden\",\n        opacity: 0.6,\n        width: \"100%\",\n    },\n    shimmer: {\n        width: \"100%\",\n        height: \"100%\",\n        position: \"absolute\",\n        flexDirection: \"row\",\n    },\n    shimmerSub: {\n        height: \"100%\",\n        opacity: 0.3,\n        width: DEVICE_WIDTH * 0.3,\n    },\n    shimmerCenter: {\n        height: \"100%\",\n        opacity: 0.6,\n        width: DEVICE_WIDTH * 0.4,\n    },\n});\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSSkeleton/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from \"react\";\nimport { Dimensions, type StyleProp, StyleSheet, View, type ViewStyle, type ViewProps } from \"react-native\";\nimport Animated, { useSharedValue, useAnimatedStyle, withRepeat, withTiming, cancelAnimation } from \"react-native-reanimated\";\nimport { useTheme } from \"../../context/ThemeContext\";\n\nconst DEVICE_WIDTH = Dimensions.get(\"window\").width;\n\ninterface ZSSkeletonProps extends ViewProps {\n    isFetching?: boolean;\n    style?: StyleProp<ViewStyle>;\n    children?: React.ReactNode;\n    overlayColor?: string;\n}\n\nfunction ZSSkeleton({ isFetching, style, children, overlayColor, ...props }: ZSSkeletonProps) {\n    const translateX = useSharedValue(-DEVICE_WIDTH * 1.2);\n    const { palette } = useTheme();\n    const effectColor = overlayColor || palette.background.base;\n\n    useEffect(() => {\n        if (isFetching) {\n            translateX.value = withRepeat(withTiming(DEVICE_WIDTH * 1.2, { duration: 800 }), -1, false);\n        } else {\n            cancelAnimation(translateX);\n            translateX.value = -DEVICE_WIDTH * 1.2;\n        }\n\n        return () => {\n            cancelAnimation(translateX);\n        };\n    }, [isFetching]);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        return {\n            transform: [{ translateX: translateX.value }],\n        };\n    });\n\n    return isFetching ? (\n        <View style={[style, { overflow: \"hidden\" }]} {...props}>\n            <View style={styles.container}>\n                {children}\n\n                <Animated.View style={[styles.shimmer, animatedStyle]}>\n                    <View style={[styles.shimmerSub, { backgroundColor: effectColor }]} />\n                    <View style={[styles.shimmerCenter, { backgroundColor: effectColor }]} />\n                    <View style={[styles.shimmerSub, { backgroundColor: effectColor }]} />\n                </Animated.View>\n            </View>\n        </View>\n    ) : (\n        children\n    );\n}\n\nexport default ZSSkeleton;\n\nconst styles = StyleSheet.create({\n    container: {\n        overflow: \"hidden\",\n        opacity: 0.6,\n        width: \"100%\",\n    },\n    shimmer: {\n        width: \"100%\",\n        height: \"100%\",\n        position: \"absolute\",\n        flexDirection: \"row\",\n    },\n    shimmerSub: {\n        height: \"100%\",\n        opacity: 0.3,\n        width: DEVICE_WIDTH * 0.3,\n    },\n    shimmerCenter: {\n        height: \"100%\",\n        opacity: 0.6,\n        width: DEVICE_WIDTH * 0.4,\n    },\n});\n"]}

package/build/ui/ZSSkeletonBox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSSkeletonBox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAc,KAAK,SAAS,EAAoB,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAI5G,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAIrD,UAAU,kBAAmB,SAAQ,SAAS;IAC1C,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC5B;AAED,iBAAS,aAAa,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,KAAiB,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,qBAwCtG;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSSkeletonBox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAc,KAAK,SAAS,EAAoB,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAI5G,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAIrD,UAAU,kBAAmB,SAAQ,SAAS;IAC1C,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC5B;AAED,iBAAS,aAAa,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,KAAiB,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,qBAuCtG;AAED,eAAe,aAAa,CAAC"}

package/build/ui/ZSSkeletonBox/index.js

@@ -15,7 +15,6 @@ function ZSSkeletonBox({ height, style, overlayColor, color = 'neutral', ...prop
         };
     }, []);
     const animatedStyle = useAnimatedStyle(() => {
-        "worklet";
         return {
             transform: [{ translateX: translateX.value }],
         };

package/build/ui/ZSSkeletonBox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSSkeletonBox/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from \"react\";\nimport { Dimensions, type StyleProp, StyleSheet, View, type ViewStyle, type ViewProps } from \"react-native\";\nimport Animated, { useSharedValue, useAnimatedStyle, withRepeat, withTiming, cancelAnimation } from \"react-native-reanimated\";\nimport { useTheme } from \"../../context/ThemeContext\";\nimport ZSView from \"../ZSView\";\nimport { ViewColorOptions } from \"../../theme/types\";\n\nconst DEVICE_WIDTH = Dimensions.get(\"window\").width;\n\ninterface ZSSkeletonBoxProps extends ViewProps {\n    height: number;\n    style?: StyleProp<ViewStyle>;\n    overlayColor?: string;\n    color?: ViewColorOptions;\n}\n\nfunction ZSSkeletonBox({ height, style, overlayColor, color = 'neutral', ...props }: ZSSkeletonBoxProps) {\n    const translateX = useSharedValue(-DEVICE_WIDTH * 1.2);\n    const { palette } = useTheme();\n    const effectColor = overlayColor || palette.background.layer1;\n\n    useEffect(() => {\n        translateX.value = withRepeat(withTiming(DEVICE_WIDTH * 1.2, { duration: 800 }), -1, false);\n\n        return () => {\n            cancelAnimation(translateX);\n        };\n    }, []);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        \"worklet\";\n        return {\n            transform: [{ translateX: translateX.value }],\n        };\n    });\n\n    return (\n        <View style={[{ width: '100%' }, style, { height, overflow: \"hidden\" }]} {...props}>\n            <ZSView\n                style={[\n                    styles.container,\n                    {\n                        width: DEVICE_WIDTH,\n                        height,\n                    },\n                ]}\n                color={color}\n            >\n                <Animated.View style={[styles.shimmer, animatedStyle]}>\n                    <View style={[styles.shimmerSub, { backgroundColor: effectColor }]} />\n                    <View style={[styles.shimmerCenter, { backgroundColor: effectColor }]} />\n                    <View style={[styles.shimmerSub, { backgroundColor: effectColor }]} />\n                </Animated.View>\n            </ZSView>\n        </View>\n    );\n}\n\nexport default ZSSkeletonBox;\n\nconst styles = StyleSheet.create({\n    container: {\n        overflow: \"hidden\",\n        opacity: 0.4,\n    },\n    shimmer: {\n        width: \"100%\",\n        height: \"100%\",\n        position: \"absolute\",\n        flexDirection: \"row\",\n    },\n    shimmerSub: {\n        height: \"100%\",\n        backgroundColor: \"#ebebeb\",\n        opacity: 0.3,\n        width: DEVICE_WIDTH * 0.3,\n    },\n    shimmerCenter: {\n        height: \"100%\",\n        backgroundColor: \"#f5f5f5\",\n        opacity: 0.7,\n        width: DEVICE_WIDTH * 0.4,\n    },\n});\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSSkeletonBox/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from \"react\";\nimport { Dimensions, type StyleProp, StyleSheet, View, type ViewStyle, type ViewProps } from \"react-native\";\nimport Animated, { useSharedValue, useAnimatedStyle, withRepeat, withTiming, cancelAnimation } from \"react-native-reanimated\";\nimport { useTheme } from \"../../context/ThemeContext\";\nimport ZSView from \"../ZSView\";\nimport { ViewColorOptions } from \"../../theme/types\";\n\nconst DEVICE_WIDTH = Dimensions.get(\"window\").width;\n\ninterface ZSSkeletonBoxProps extends ViewProps {\n    height: number;\n    style?: StyleProp<ViewStyle>;\n    overlayColor?: string;\n    color?: ViewColorOptions;\n}\n\nfunction ZSSkeletonBox({ height, style, overlayColor, color = 'neutral', ...props }: ZSSkeletonBoxProps) {\n    const translateX = useSharedValue(-DEVICE_WIDTH * 1.2);\n    const { palette } = useTheme();\n    const effectColor = overlayColor || palette.background.layer1;\n\n    useEffect(() => {\n        translateX.value = withRepeat(withTiming(DEVICE_WIDTH * 1.2, { duration: 800 }), -1, false);\n\n        return () => {\n            cancelAnimation(translateX);\n        };\n    }, []);\n\n    const animatedStyle = useAnimatedStyle(() => {\n        return {\n            transform: [{ translateX: translateX.value }],\n        };\n    });\n\n    return (\n        <View style={[{ width: '100%' }, style, { height, overflow: \"hidden\" }]} {...props}>\n            <ZSView\n                style={[\n                    styles.container,\n                    {\n                        width: DEVICE_WIDTH,\n                        height,\n                    },\n                ]}\n                color={color}\n            >\n                <Animated.View style={[styles.shimmer, animatedStyle]}>\n                    <View style={[styles.shimmerSub, { backgroundColor: effectColor }]} />\n                    <View style={[styles.shimmerCenter, { backgroundColor: effectColor }]} />\n                    <View style={[styles.shimmerSub, { backgroundColor: effectColor }]} />\n                </Animated.View>\n            </ZSView>\n        </View>\n    );\n}\n\nexport default ZSSkeletonBox;\n\nconst styles = StyleSheet.create({\n    container: {\n        overflow: \"hidden\",\n        opacity: 0.4,\n    },\n    shimmer: {\n        width: \"100%\",\n        height: \"100%\",\n        position: \"absolute\",\n        flexDirection: \"row\",\n    },\n    shimmerSub: {\n        height: \"100%\",\n        backgroundColor: \"#ebebeb\",\n        opacity: 0.3,\n        width: DEVICE_WIDTH * 0.3,\n    },\n    shimmerCenter: {\n        height: \"100%\",\n        backgroundColor: \"#f5f5f5\",\n        opacity: 0.7,\n        width: DEVICE_WIDTH * 0.4,\n    },\n});\n"]}

package/build/ui/ZSSwitch/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSSwitch/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAa,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAUzF,UAAU,aAAc,SAAQ,SAAS;IACvC,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,iBAAS,QAAQ,CAAC,EAChB,QAAgB,EAChB,QAAQ,EACR,KAAK,EACL,KAAU,EACV,kBAAkB,EAClB,gBAAgB,EAChB,UAAsB,EACtB,GAAG,KAAK,EACT,EAAE,aAAa,qBAkEf;AAED,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSSwitch/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAa,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAUzF,UAAU,aAAc,SAAQ,SAAS;IACvC,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,iBAAS,QAAQ,CAAC,EAChB,QAAgB,EAChB,QAAQ,EACR,KAAK,EACL,KAAU,EACV,kBAAkB,EAClB,gBAAgB,EAChB,UAAsB,EACtB,GAAG,KAAK,EACT,EAAE,aAAa,qBAyCf;AAED,eAAe,QAAQ,CAAC"}

package/build/ui/ZSSwitch/index.js

@@ -1,9 +1,13 @@
-import React, { useState } from "react";
+import React from "react";
 import { Pressable } from "react-native";
-import Animated, { interpolate, interpolateColor, useAnimatedStyle, withTiming, useDerivedValue, } from "react-native-reanimated";
+import Animated from "react-native-reanimated";
 import { useTheme } from "../../context/ThemeContext";
+const SWITCH_TRANSITION_DURATION = 200;
+const SWITCH_TRANSITION = {
+    transitionDuration: SWITCH_TRANSITION_DURATION,
+    transitionTimingFunction: 'ease-in-out',
+};
 function ZSSwitch({ isActive = false, onToggle, style, width = 50, trackColorInactive, trackColorActive, thumbColor = '#ffffff', ...props }) {
-    const [toggledWidth, setToggledWidth] = useState(0);
     const { palette } = useTheme();
     const height = width * 0.6;
     const padding = width * 0.04;
@@ -12,37 +16,30 @@ function ZSSwitch({ isActive = false, onToggle, style, width = 50, trackColorIna
     const thumbBorderRadius = thumbSize / 2;
     const inactiveColor = trackColorInactive ?? palette.grey[30];
     const activeColor = trackColorActive ?? palette.primary.main;
-    const toggleProgress = useDerivedValue(() => {
-        return withTiming(isActive ? 1 : 0, { duration: 200 });
-    }, [isActive]);
-    const colorAnimation = useAnimatedStyle(() => {
-        'worklet';
-        const color = interpolateColor(toggleProgress.value, [0, 1], [inactiveColor, activeColor]);
-        return { backgroundColor: color };
-    }, [inactiveColor, activeColor]);
-    const togglePositionAnimation = useAnimatedStyle(() => {
-        'worklet';
-        const positionStyle = interpolate(toggleProgress.value, [0, 1], [0, toggledWidth - thumbSize - padding * 2], 'clamp');
-        return {
-            transform: [{ translateX: positionStyle }],
-        };
-    }, [toggledWidth, thumbSize, padding]);
+    const thumbTranslateX = isActive ? width - thumbSize - padding * 2 : 0;
     const toggleStyle = {
         width,
         height,
         borderRadius: toggleBorderRadius,
         padding,
         justifyContent: "center",
+        backgroundColor: isActive ? activeColor : inactiveColor,
+        transitionProperty: 'backgroundColor',
+        ...SWITCH_TRANSITION,
     };
     const thumbStyle = {
         width: thumbSize,
         height: thumbSize,
         borderRadius: thumbBorderRadius,
         justifyContent: "center",
+        backgroundColor: thumbColor,
+        transform: [{ translateX: thumbTranslateX }],
+        transitionProperty: 'transform',
+        ...SWITCH_TRANSITION,
     };
     return (<Pressable onPress={onToggle} style={style} {...props}>
-      <Animated.View style={[colorAnimation, toggleStyle]} onLayout={e => setToggledWidth(e.nativeEvent.layout.width)}>
-        <Animated.View style={[togglePositionAnimation, thumbStyle, { backgroundColor: thumbColor }]}/>
+      <Animated.View style={toggleStyle}>
+        <Animated.View style={thumbStyle}/>
       </Animated.View>
     </Pressable>);
 }

package/build/ui/ZSSwitch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSSwitch/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState } from \"react\";\nimport { type StyleProp, type ViewStyle, Pressable, type ViewProps } from \"react-native\";\nimport Animated, {\n  interpolate,\n  interpolateColor,\n  useAnimatedStyle,\n  withTiming,\n  useDerivedValue,\n} from \"react-native-reanimated\";\nimport { useTheme } from \"../../context/ThemeContext\";\n\ninterface ZSSwitchProps extends ViewProps {\n  isActive: boolean;\n  onToggle: () => void;\n  style?: StyleProp<ViewStyle>;\n  width?: number;\n  trackColorInactive?: string;\n  trackColorActive?: string;\n  thumbColor?: string;\n}\n\nfunction ZSSwitch({\n  isActive = false,\n  onToggle,\n  style,\n  width = 50,\n  trackColorInactive,\n  trackColorActive,\n  thumbColor = '#ffffff',\n  ...props\n}: ZSSwitchProps) {\n  const [toggledWidth, setToggledWidth] = useState(0);\n  const { palette } = useTheme();\n  const height = width * 0.6;\n  const padding = width * 0.04;\n  const thumbSize = height - padding * 2;\n  const toggleBorderRadius = height * 1.2;\n  const thumbBorderRadius = thumbSize / 2;\n\n  const inactiveColor = trackColorInactive ?? palette.grey[30];\n  const activeColor = trackColorActive ?? palette.primary.main;\n\n  const toggleProgress = useDerivedValue(() => {\n    return withTiming(isActive ? 1 : 0, { duration: 200 });\n  }, [isActive]);\n\n  const colorAnimation = useAnimatedStyle(() => {\n    'worklet';\n    const color = interpolateColor(\n      toggleProgress.value,\n      [0, 1],\n      [inactiveColor, activeColor],\n    );\n\n    return { backgroundColor: color };\n  }, [inactiveColor, activeColor]);\n\n  const togglePositionAnimation = useAnimatedStyle(() => {\n    'worklet';\n    const positionStyle = interpolate(\n      toggleProgress.value,\n      [0, 1],\n      [0, toggledWidth - thumbSize - padding * 2],\n      'clamp',\n    );\n\n    return {\n      transform: [{ translateX: positionStyle }],\n    };\n  }, [toggledWidth, thumbSize, padding]);\n\n  const toggleStyle = {\n    width,\n    height,\n    borderRadius: toggleBorderRadius,\n    padding,\n    justifyContent: \"center\" as const,\n  };\n\n  const thumbStyle = {\n    width: thumbSize,\n    height: thumbSize,\n    borderRadius: thumbBorderRadius,\n    justifyContent: \"center\" as const,\n  };\n\n  return (\n    <Pressable onPress={onToggle} style={style} {...props}>\n      <Animated.View\n        style={[colorAnimation, toggleStyle]}\n        onLayout={e => setToggledWidth(e.nativeEvent.layout.width)}\n      >\n        <Animated.View style={[togglePositionAnimation, thumbStyle, { backgroundColor: thumbColor }]} />\n      </Animated.View>\n    </Pressable>\n  );\n};\n\nexport default ZSSwitch;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSSwitch/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAkC,SAAS,EAAkB,MAAM,cAAc,CAAC;AACzF,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAEtD,MAAM,0BAA0B,GAAG,GAAG,CAAC;AACvC,MAAM,iBAAiB,GAAG;IACxB,kBAAkB,EAAE,0BAA0B;IAC9C,wBAAwB,EAAE,aAAa;CAC/B,CAAC;AAYX,SAAS,QAAQ,CAAC,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,KAAK,EACL,KAAK,GAAG,EAAE,EACV,kBAAkB,EAClB,gBAAgB,EAChB,UAAU,GAAG,SAAS,EACtB,GAAG,KAAK,EACM;IACd,MAAM,EAAE,OAAO,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC/B,MAAM,MAAM,GAAG,KAAK,GAAG,GAAG,CAAC;IAC3B,MAAM,OAAO,GAAG,KAAK,GAAG,IAAI,CAAC;IAC7B,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,CAAC,CAAC;IACvC,MAAM,kBAAkB,GAAG,MAAM,GAAG,GAAG,CAAC;IACxC,MAAM,iBAAiB,GAAG,SAAS,GAAG,CAAC,CAAC;IAExC,MAAM,aAAa,GAAG,kBAAkB,IAAI,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAC7D,MAAM,WAAW,GAAG,gBAAgB,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC;IAC7D,MAAM,eAAe,GAAG,QAAQ,CAAC,CAAC,CAAC,KAAK,GAAG,SAAS,GAAG,OAAO,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAEvE,MAAM,WAAW,GAAG;QAClB,KAAK;QACL,MAAM;QACN,YAAY,EAAE,kBAAkB;QAChC,OAAO;QACP,cAAc,EAAE,QAAiB;QACjC,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa;QACvD,kBAAkB,EAAE,iBAA0B;QAC9C,GAAG,iBAAiB;KACrB,CAAC;IAEF,MAAM,UAAU,GAAG;QACjB,KAAK,EAAE,SAAS;QAChB,MAAM,EAAE,SAAS;QACjB,YAAY,EAAE,iBAAiB;QAC/B,cAAc,EAAE,QAAiB;QACjC,eAAe,EAAE,UAAU;QAC3B,SAAS,EAAE,CAAC,EAAE,UAAU,EAAE,eAAe,EAAE,CAAC;QAC5C,kBAAkB,EAAE,WAAoB;QACxC,GAAG,iBAAiB;KACrB,CAAC;IAEF,OAAO,CACL,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,KAAK,CAAC,CACpD;MAAA,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,CAChC;QAAA,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,EACnC;MAAA,EAAE,QAAQ,CAAC,IAAI,CACjB;IAAA,EAAE,SAAS,CAAC,CACb,CAAC;AACJ,CAAC;AAAA,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import React from \"react\";\nimport { type StyleProp, type ViewStyle, Pressable, type ViewProps } from \"react-native\";\nimport Animated from \"react-native-reanimated\";\nimport { useTheme } from \"../../context/ThemeContext\";\n\nconst SWITCH_TRANSITION_DURATION = 200;\nconst SWITCH_TRANSITION = {\n  transitionDuration: SWITCH_TRANSITION_DURATION,\n  transitionTimingFunction: 'ease-in-out',\n} as const;\n\ninterface ZSSwitchProps extends ViewProps {\n  isActive: boolean;\n  onToggle: () => void;\n  style?: StyleProp<ViewStyle>;\n  width?: number;\n  trackColorInactive?: string;\n  trackColorActive?: string;\n  thumbColor?: string;\n}\n\nfunction ZSSwitch({\n  isActive = false,\n  onToggle,\n  style,\n  width = 50,\n  trackColorInactive,\n  trackColorActive,\n  thumbColor = '#ffffff',\n  ...props\n}: ZSSwitchProps) {\n  const { palette } = useTheme();\n  const height = width * 0.6;\n  const padding = width * 0.04;\n  const thumbSize = height - padding * 2;\n  const toggleBorderRadius = height * 1.2;\n  const thumbBorderRadius = thumbSize / 2;\n\n  const inactiveColor = trackColorInactive ?? palette.grey[30];\n  const activeColor = trackColorActive ?? palette.primary.main;\n  const thumbTranslateX = isActive ? width - thumbSize - padding * 2 : 0;\n\n  const toggleStyle = {\n    width,\n    height,\n    borderRadius: toggleBorderRadius,\n    padding,\n    justifyContent: \"center\" as const,\n    backgroundColor: isActive ? activeColor : inactiveColor,\n    transitionProperty: 'backgroundColor' as const,\n    ...SWITCH_TRANSITION,\n  };\n\n  const thumbStyle = {\n    width: thumbSize,\n    height: thumbSize,\n    borderRadius: thumbBorderRadius,\n    justifyContent: \"center\" as const,\n    backgroundColor: thumbColor,\n    transform: [{ translateX: thumbTranslateX }],\n    transitionProperty: 'transform' as const,\n    ...SWITCH_TRANSITION,\n  };\n\n  return (\n    <Pressable onPress={onToggle} style={style} {...props}>\n      <Animated.View style={toggleStyle}>\n        <Animated.View style={thumbStyle} />\n      </Animated.View>\n    </Pressable>\n  );\n};\n\nexport default ZSSwitch;\n"]}

package/build/ui/ZSTextField/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSTextField/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAA0C,SAAS,EAAE,cAAc,EAAa,MAAM,cAAc,CAAC;AAI5G,OAAO,EAAE,WAAW,EAA2B,MAAM,mBAAmB,CAAC;AAKzE,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,CAAC;AAMzD,UAAU,cAAc;IACtB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,aAAa,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC;AAEvC,QAAA,MAAM,WAAW,sGA+Pf,CAAC;AAIH,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSTextField/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAA0C,SAAS,EAAE,cAAc,EAAa,MAAM,cAAc,CAAC;AAI5G,OAAO,EAAE,WAAW,EAA2B,MAAM,mBAAmB,CAAC;AAKzE,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,CAAC;AAMzD,UAAU,cAAc;IACtB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,aAAa,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC;AAEvC,QAAA,MAAM,WAAW,sGAkPf,CAAC;AAIH,eAAe,WAAW,CAAC"}

package/build/ui/ZSTextField/index.js

@@ -1,4 +1,4 @@
-import { useMemo, useCallback, useState, forwardRef, useEffect } from 'react';
+import { useMemo, useCallback, useState, forwardRef, useEffect, useRef } from 'react';
 import { Platform, TextInput } from 'react-native';
 import Animated, { interpolate, useAnimatedStyle, useSharedValue, withTiming, ReduceMotion } from 'react-native-reanimated';
 import ButtonClose from './ui/ButtonClose';
@@ -15,19 +15,20 @@ const ZSTextField = forwardRef(({ typo = 'body.2', status = 'default', value, on
     const fErrorColor = errorColor || palette.danger.main;
     const fontSize = extractStyle(typography[primaryStyle][subStyle], 'fontSize') || 17;
     const fontFamily = extractStyle(typography[primaryStyle][subStyle], 'fontFamily') || '';
-    const labelProgress = useSharedValue(value !== '' ? 1 : 0);
-    const focusProgress = useSharedValue(0);
-    const errorProgress = useSharedValue(0);
+    const floatProgress = useSharedValue(value !== '' ? 1 : 0);
     const [isFocusedForUI, setIsFocusedForUI] = useState(false);
     const boxHeightValue = useSharedValue(0);
     const isError = status === 'error';
     const hasValue = value !== '';
+    const isFocusedRef = useRef(false);
+    const hasValueRef = useRef(hasValue);
+    hasValueRef.current = hasValue;
     useEffect(() => {
-        labelProgress.value = withTiming(hasValue ? 1 : 0, TIMING_CONFIG);
+        const target = hasValue ? 1 : 0;
+        if (!isFocusedRef.current && floatProgress.value !== target) {
+            floatProgress.value = withTiming(target, TIMING_CONFIG);
+        }
     }, [hasValue]);
-    useEffect(() => {
-        errorProgress.value = withTiming(isError ? 1 : 0, TIMING_CONFIG);
-    }, [isError]);
     const animationConstants = useMemo(() => ({
         baseFontSize: fontSize + (boxStyle === 'inbox' ? 1 : 0),
         targetFontSize: boxStyle === 'inbox' ? 10 : 11,
@@ -35,16 +36,13 @@ const ZSTextField = forwardRef(({ typo = 'body.2', status = 'default', value, on
         targetTopOffset: boxStyle === 'inbox' ? 17 : 2,
     }), [fontSize, boxStyle, isTextArea]);
     const animatedLabelStyle = useAnimatedStyle(() => {
-        'worklet';
-        const progress = Math.max(labelProgress.value, focusProgress.value);
+        const progress = floatProgress.value;
         const labelTranslateY = interpolate(progress, [0, 1], [
             0,
             isTextArea ? -24 : -(boxHeightValue.value / 2) - 1 + animationConstants.targetTopOffset - animationConstants.baseTop,
         ], 'clamp');
         const labelScale = interpolate(progress, [0, 1], [1, animationConstants.targetFontSize / animationConstants.baseFontSize], 'clamp');
         return {
-            top: animationConstants.baseTop,
-            transformOrigin: 'left center',
             transform: [
                 { translateY: labelTranslateY },
                 { scale: labelScale },
@@ -56,11 +54,18 @@ const ZSTextField = forwardRef(({ typo = 'body.2', status = 'default', value, on
         boxHeightValue.value = height;
     }, []);
     const handleFocus = useCallback(() => {
-        focusProgress.value = withTiming(1, TIMING_CONFIG);
+        isFocusedRef.current = true;
+        if (floatProgress.value !== 1) {
+            floatProgress.value = withTiming(1, TIMING_CONFIG);
+        }
         setIsFocusedForUI(true);
     }, []);
     const handleBlur = useCallback(() => {
-        focusProgress.value = withTiming(0, TIMING_CONFIG);
+        isFocusedRef.current = false;
+        const target = hasValueRef.current ? 1 : 0;
+        if (floatProgress.value !== target) {
+            floatProgress.value = withTiming(target, TIMING_CONFIG);
+        }
         setIsFocusedForUI(false);
     }, []);
     const colorConfig = useMemo(() => ({
@@ -70,31 +75,18 @@ const ZSTextField = forwardRef(({ typo = 'body.2', status = 'default', value, on
         placeholderColor: placeHolderColor || palette.grey[40],
         errorColor: fErrorColor,
     }), [focusColor, palette.primary.main, borderColor, palette.grey, labelColor, palette.text.secondary, placeHolderColor, fErrorColor]);
-    const animatedColorStyle = useAnimatedStyle(() => {
-        'worklet';
-        const borderColor = errorProgress.value > 0
-            ? colorConfig.errorColor
-            : focusProgress.value > 0
-                ? colorConfig.primaryColor
-                : colorConfig.defaultBorderColor;
-        return {
-            borderColor,
-        };
-    }, [colorConfig]);
-    const animatedLabelColorStyle = useAnimatedStyle(() => {
-        'worklet';
-        const floatProgress = Math.max(labelProgress.value, focusProgress.value);
-        const labelColor = errorProgress.value > 0
-            ? colorConfig.errorColor
-            : focusProgress.value > 0
-                ? colorConfig.primaryColor
-                : floatProgress > 0
-                    ? colorConfig.defaultLabelColor
-                    : colorConfig.placeholderColor;
-        return {
-            color: labelColor,
-        };
-    }, [colorConfig]);
+    const currentBorderColor = isError
+        ? colorConfig.errorColor
+        : isFocusedForUI
+            ? colorConfig.primaryColor
+            : colorConfig.defaultBorderColor;
+    const currentLabelColor = isError
+        ? colorConfig.errorColor
+        : isFocusedForUI
+            ? colorConfig.primaryColor
+            : hasValue
+                ? colorConfig.defaultLabelColor
+                : colorConfig.placeholderColor;
     const styleConfig = useMemo(() => {
         const baseStyle = {
             width: '100%',
@@ -137,22 +129,24 @@ const ZSTextField = forwardRef(({ typo = 'body.2', status = 'default', value, on
         }
         return { ...baseStyle, ...borderStyle, ...innerStyle };
     }, [isTextArea, borderRadius, paddingHorizontal, inputBgColor, borderWidth, boxStyle, innerBoxStyle, palette.background.base]);
-    const labelTextStyle = {
+    const labelTextStyle = useMemo(() => ({
         fontSize,
+        top: animationConstants.baseTop,
         left: paddingHorizontal,
+        transformOrigin: 'left center',
         backgroundColor: labelBgColor || palette.background.base,
         paddingHorizontal: boxStyle === 'outline' ? 5 : 0,
         paddingVertical: 2,
         textAlignVertical: 'center',
         fontFamily,
         borderRadius: boxStyle === 'outline' ? 5 : 0,
-        overflow: 'hidden',
-    };
+        ...(Platform.OS === 'android' ? { overflow: 'hidden' } : {}),
+    }), [fontSize, animationConstants.baseTop, paddingHorizontal, labelBgColor, palette.background.base, boxStyle, fontFamily]);
     const handleTextChange = (text) => {
         if (onChangeText)
             onChangeText(text);
     };
-    const textInputStyle = [
+    const textInputStyle = useMemo(() => [
         {
             paddingTop: 7 + iosOffset,
             paddingBottom: 5 + iosOffset,
@@ -164,21 +158,21 @@ const ZSTextField = forwardRef(({ typo = 'body.2', status = 'default', value, on
             ...(Platform.OS === 'web' ? { outline: 'none' } : {}),
         },
         textInputProps?.style,
-    ];
+    ], [palette.text.base, fontSize, fontFamily, textInputProps?.style]);
     const shouldShowCloseButton = value && isFocusedForUI;
     const shouldShowError = status === 'error' && errorMessage;
     return (<ViewAtom style={{ alignSelf: 'stretch', width: '100%' }}>
-      <Animated.View style={[styleConfig, animatedColorStyle]} onLayout={handleLayout} pointerEvents={disabled ? 'none' : 'auto'}>
+      <ViewAtom style={[styleConfig, { borderColor: currentBorderColor }]} onLayout={handleLayout} pointerEvents={disabled ? 'none' : 'auto'}>
         <TextInput {...textInputProps} ref={ref} style={textInputStyle} value={value} onFocus={handleFocus} onBlur={handleBlur} onChangeText={handleTextChange} allowFontScaling={allowFontScaling} selectionColor={palette.grey[50]} autoCorrect={false} spellCheck={false}/>
 
         <ViewAtom pointerEvents="none" style={{ position: 'absolute' }}>
-          <Animated.Text allowFontScaling={allowFontScaling} style={[animatedLabelStyle, labelTextStyle, animatedLabelColorStyle]}>
+          <Animated.Text allowFontScaling={allowFontScaling} style={[labelTextStyle, { color: currentLabelColor }, animatedLabelStyle]}>
             {label}
           </Animated.Text>
         </ViewAtom>
 
         {shouldShowCloseButton && (<ButtonClose marginTop={isTextArea ? 13 : undefined} onChangeText={onChangeText}/>)}
-      </Animated.View>
+      </ViewAtom>
 
       {shouldShowError && (<ErrorComponent errorMessage={errorMessage} errorColor={fErrorColor}/>)}
     </ViewAtom>);

package/build/ui/ZSTextField/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSTextField/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useCallback, useState, forwardRef, useEffect } from 'react';\nimport { LayoutChangeEvent, Platform, StyleProp, TextInput, TextInputProps, TextStyle } from 'react-native';\nimport Animated, { interpolate, useAnimatedStyle, useSharedValue, withTiming, ReduceMotion } from 'react-native-reanimated';\nimport ButtonClose from './ui/ButtonClose';\nimport ErrorComponent from './ui/ErrorComponent';\nimport { TypoOptions, TypoStyle, TypoSubStyle } from '../../theme/types';\nimport { extractStyle } from '../../model/utils';\nimport { useTheme } from '../../context/ThemeContext';\nimport ViewAtom from '../atoms/ViewAtom';\n\nexport type BoxStyle = 'outline' | 'underline' | 'inbox';\n\nconst iosOffset = Platform.OS === 'ios' ? 8 : 4;\nconst ANIM_DURATION = 150;\nconst TIMING_CONFIG = { duration: ANIM_DURATION, reduceMotion: ReduceMotion.System };\n\ninterface TextFieldProps {\n  typo?: TypoOptions;\n  status?: 'default' | 'error';\n  value: string;\n  onChangeText?: (text: string) => void;\n  inputBgColor?: string;\n  labelBgColor?: string;\n  label?: string;\n  labelColor?: string;\n  placeHolderColor?: string;\n  fontSize?: number;\n  borderColor?: string;\n  borderRadius?: number;\n  focusColor?: string;\n  errorColor?: string;\n  paddingHorizontal?: number;\n  borderWidth?: number;\n  errorMessage?: string;\n  textInputProps?: TextInputProps;\n  boxStyle?: BoxStyle;\n  innerBoxStyle?: 'top' | 'middle' | 'bottom';\n  disabled?: boolean;\n  allowFontScaling?: boolean;\n  isTextArea?: boolean;\n}\n\nexport type ZSTextFieldRef = TextInput;\n\nconst ZSTextField = forwardRef<ZSTextFieldRef, TextFieldProps>(({\n  typo = 'body.2',\n  status = 'default',\n  value,\n  onChangeText,\n  label = 'Placeholder',\n  labelColor,\n  placeHolderColor,\n  inputBgColor,\n  labelBgColor,\n  borderWidth = 1.2,\n  borderColor,\n  focusColor,\n  errorColor,\n  borderRadius = 14,\n  paddingHorizontal = 15,\n  errorMessage,\n  textInputProps,\n  boxStyle = 'outline',\n  innerBoxStyle,\n  disabled = false,\n  allowFontScaling = true,\n  isTextArea = false,\n}, ref) => {\n  const { typography, palette } = useTheme();\n  const [primaryStyle, subStyle] = typo.split('.') as [TypoStyle, TypoSubStyle];\n  const fErrorColor = errorColor || palette.danger.main;\n\n  const fontSize = extractStyle(typography[primaryStyle][subStyle], 'fontSize') as number || 17;\n  const fontFamily = extractStyle(typography[primaryStyle][subStyle], 'fontFamily') as string || '';\n\n  const labelProgress = useSharedValue(value !== '' ? 1 : 0);\n  const focusProgress = useSharedValue(0);\n  const errorProgress = useSharedValue(0);\n  const [isFocusedForUI, setIsFocusedForUI] = useState<boolean>(false);\n  const boxHeightValue = useSharedValue(0);\n  \n  const isError = status === 'error';\n  const hasValue = value !== '';\n\n  useEffect(() => {\n    labelProgress.value = withTiming(hasValue ? 1 : 0, TIMING_CONFIG);\n  }, [hasValue]);\n\n  useEffect(() => {\n    errorProgress.value = withTiming(isError ? 1 : 0, TIMING_CONFIG);\n  }, [isError]);\n\n  const animationConstants = useMemo(() => ({\n    baseFontSize: fontSize + (boxStyle === 'inbox' ? 1 : 0),\n    targetFontSize: boxStyle === 'inbox' ? 10 : 11,\n    baseTop: isTextArea ? 12 : 0,\n    targetTopOffset: boxStyle === 'inbox' ? 17 : 2,\n  }), [fontSize, boxStyle, isTextArea]);\n\n  const animatedLabelStyle = useAnimatedStyle(() => {\n    'worklet';\n    \n    const progress = Math.max(labelProgress.value, focusProgress.value);\n    \n    const labelTranslateY = interpolate(\n      progress,\n      [0, 1],\n      [\n        0,\n        isTextArea ? -24 : -(boxHeightValue.value / 2) - 1 + animationConstants.targetTopOffset - animationConstants.baseTop,\n      ],\n      'clamp'\n    );\n\n    const labelScale = interpolate(\n      progress,\n      [0, 1],\n      [1, animationConstants.targetFontSize / animationConstants.baseFontSize],\n      'clamp'\n    );\n\n    return {\n      top: animationConstants.baseTop,\n      transformOrigin: 'left center',\n      transform: [\n        { translateY: labelTranslateY },\n        { scale: labelScale },\n      ],\n    };\n  }, [animationConstants, isTextArea]);\n\n  const handleLayout = useCallback((event: LayoutChangeEvent) => {\n    const { height } = event.nativeEvent.layout;\n    boxHeightValue.value = height;\n  }, []);\n\n  const handleFocus = useCallback(() => {\n    focusProgress.value = withTiming(1, TIMING_CONFIG);\n    setIsFocusedForUI(true);\n  }, []);\n\n  const handleBlur = useCallback(() => {\n    focusProgress.value = withTiming(0, TIMING_CONFIG);\n    setIsFocusedForUI(false);\n  }, []);\n\n  const colorConfig = useMemo(() => ({\n    primaryColor: focusColor || palette.primary.main,\n    defaultBorderColor: borderColor || palette.grey[30],\n    defaultLabelColor: labelColor || palette.text.secondary,\n    placeholderColor: placeHolderColor || palette.grey[40],\n    errorColor: fErrorColor,\n  }), [focusColor, palette.primary.main, borderColor, palette.grey, labelColor, palette.text.secondary, placeHolderColor, fErrorColor]);\n\n  const animatedColorStyle = useAnimatedStyle(() => {\n    'worklet';\n    \n    const borderColor = errorProgress.value > 0 \n      ? colorConfig.errorColor\n      : focusProgress.value > 0\n        ? colorConfig.primaryColor\n        : colorConfig.defaultBorderColor;\n    \n    return {\n      borderColor,\n    };\n  }, [colorConfig]);\n\n  const animatedLabelColorStyle = useAnimatedStyle(() => {\n    'worklet';\n    \n    const floatProgress = Math.max(labelProgress.value, focusProgress.value);\n    \n    const labelColor = errorProgress.value > 0\n      ? colorConfig.errorColor\n      : focusProgress.value > 0\n        ? colorConfig.primaryColor\n        : floatProgress > 0\n          ? colorConfig.defaultLabelColor\n          : colorConfig.placeholderColor;\n    \n    return {\n      color: labelColor,\n    };\n  }, [colorConfig]);\n\n  const styleConfig = useMemo(() => {\n    const baseStyle = {\n      width: '100%' as const,\n      justifyContent: isTextArea ? 'flex-start' as const : 'center' as const,\n      borderRadius,\n      paddingHorizontal,\n      backgroundColor: inputBgColor || palette.background.base,\n      paddingTop: boxStyle === 'inbox' ? 13 : 0,\n    };\n\n    // 박스 스타일에 따른 테두리 설정\n    let borderStyle = {};\n    if (boxStyle === 'outline' || boxStyle === 'inbox') {\n      borderStyle = { borderWidth };\n    } else if (boxStyle === 'underline') {\n      borderStyle = { borderBottomWidth: borderWidth };\n    }\n\n    // innerBoxStyle에 따른 스타일 설정\n    let innerStyle = {};\n    if (innerBoxStyle === 'top') {\n      innerStyle = { \n        borderBottomLeftRadius: 0, \n        borderBottomRightRadius: 0, \n        borderBottomWidth: borderWidth / 2 \n      };\n    } else if (innerBoxStyle === 'middle') {\n      innerStyle = { \n        borderRadius: 0, \n        borderTopWidth: borderWidth / 2, \n        borderBottomWidth: borderWidth / 2 \n      };\n    } else if (innerBoxStyle === 'bottom') {\n      innerStyle = { \n        borderTopLeftRadius: 0, \n        borderTopRightRadius: 0, \n        borderTopWidth: borderWidth / 2 \n      };\n    }\n\n    return { ...baseStyle, ...borderStyle, ...innerStyle };\n  }, [isTextArea, borderRadius, paddingHorizontal, inputBgColor, borderWidth, boxStyle, innerBoxStyle, palette.background.base]);\n\n  const labelTextStyle: StyleProp<TextStyle> = {\n    fontSize,\n    left: paddingHorizontal,\n    backgroundColor: labelBgColor || palette.background.base,\n    paddingHorizontal: boxStyle === 'outline' ? 5 : 0,\n    paddingVertical: 2,\n    textAlignVertical: 'center',\n    fontFamily,\n    borderRadius: boxStyle === 'outline' ? 5 : 0,\n    overflow: 'hidden',\n  };\n\n  const handleTextChange = (text: string) => {\n    if (onChangeText) onChangeText(text);\n  };\n\n  const textInputStyle = [\n    { \n      paddingTop: 7 + iosOffset, \n      paddingBottom: 5 + iosOffset, \n      color: palette.text.base,\n      fontSize, \n      width: '100%' as const, \n      paddingRight: 25, \n      fontFamily,\n      ...(Platform.OS === 'web' ? { outline: 'none' } : {}),\n    },\n    textInputProps?.style,\n  ];\n\n  const shouldShowCloseButton = value && isFocusedForUI;\n  const shouldShowError = status === 'error' && errorMessage;\n\n  return (\n    <ViewAtom style={{ alignSelf: 'stretch', width: '100%' }}>\n      <Animated.View\n        style={[styleConfig, animatedColorStyle]}\n        onLayout={handleLayout}\n        pointerEvents={disabled ? 'none' : 'auto'}\n      >\n        <TextInput\n          {...textInputProps}\n          ref={ref}\n          style={textInputStyle}\n          value={value}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          onChangeText={handleTextChange}\n          allowFontScaling={allowFontScaling}\n          selectionColor={palette.grey[50]}\n          autoCorrect={false}\n          spellCheck={false}\n        />\n\n        <ViewAtom pointerEvents=\"none\" style={{ position: 'absolute' }}>\n          <Animated.Text allowFontScaling={allowFontScaling} style={[animatedLabelStyle, labelTextStyle, animatedLabelColorStyle]}>\n            {label}\n          </Animated.Text>\n        </ViewAtom>\n\n        {shouldShowCloseButton && (\n          <ButtonClose marginTop={isTextArea ? 13 : undefined} onChangeText={onChangeText} />\n        )}\n      </Animated.View>\n\n      {shouldShowError && (\n        <ErrorComponent errorMessage={errorMessage} errorColor={fErrorColor} />\n      )}\n    </ViewAtom>\n  );\n});\n\nZSTextField.displayName = 'ZSTextField';\n\nexport default ZSTextField;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSTextField/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useCallback, useState, forwardRef, useEffect, useRef } from 'react';\nimport { LayoutChangeEvent, Platform, StyleProp, TextInput, TextInputProps, TextStyle } from 'react-native';\nimport Animated, { interpolate, useAnimatedStyle, useSharedValue, withTiming, ReduceMotion } from 'react-native-reanimated';\nimport ButtonClose from './ui/ButtonClose';\nimport ErrorComponent from './ui/ErrorComponent';\nimport { TypoOptions, TypoStyle, TypoSubStyle } from '../../theme/types';\nimport { extractStyle } from '../../model/utils';\nimport { useTheme } from '../../context/ThemeContext';\nimport ViewAtom from '../atoms/ViewAtom';\n\nexport type BoxStyle = 'outline' | 'underline' | 'inbox';\n\nconst iosOffset = Platform.OS === 'ios' ? 8 : 4;\nconst ANIM_DURATION = 150;\nconst TIMING_CONFIG = { duration: ANIM_DURATION, reduceMotion: ReduceMotion.System };\n\ninterface TextFieldProps {\n  typo?: TypoOptions;\n  status?: 'default' | 'error';\n  value: string;\n  onChangeText?: (text: string) => void;\n  inputBgColor?: string;\n  labelBgColor?: string;\n  label?: string;\n  labelColor?: string;\n  placeHolderColor?: string;\n  fontSize?: number;\n  borderColor?: string;\n  borderRadius?: number;\n  focusColor?: string;\n  errorColor?: string;\n  paddingHorizontal?: number;\n  borderWidth?: number;\n  errorMessage?: string;\n  textInputProps?: TextInputProps;\n  boxStyle?: BoxStyle;\n  innerBoxStyle?: 'top' | 'middle' | 'bottom';\n  disabled?: boolean;\n  allowFontScaling?: boolean;\n  isTextArea?: boolean;\n}\n\nexport type ZSTextFieldRef = TextInput;\n\nconst ZSTextField = forwardRef<ZSTextFieldRef, TextFieldProps>(({\n  typo = 'body.2',\n  status = 'default',\n  value,\n  onChangeText,\n  label = 'Placeholder',\n  labelColor,\n  placeHolderColor,\n  inputBgColor,\n  labelBgColor,\n  borderWidth = 1.2,\n  borderColor,\n  focusColor,\n  errorColor,\n  borderRadius = 14,\n  paddingHorizontal = 15,\n  errorMessage,\n  textInputProps,\n  boxStyle = 'outline',\n  innerBoxStyle,\n  disabled = false,\n  allowFontScaling = true,\n  isTextArea = false,\n}, ref) => {\n  const { typography, palette } = useTheme();\n  const [primaryStyle, subStyle] = typo.split('.') as [TypoStyle, TypoSubStyle];\n  const fErrorColor = errorColor || palette.danger.main;\n\n  const fontSize = extractStyle(typography[primaryStyle][subStyle], 'fontSize') as number || 17;\n  const fontFamily = extractStyle(typography[primaryStyle][subStyle], 'fontFamily') as string || '';\n  const floatProgress = useSharedValue(value !== '' ? 1 : 0);\n  const [isFocusedForUI, setIsFocusedForUI] = useState<boolean>(false);\n  const boxHeightValue = useSharedValue(0);\n\n  const isError = status === 'error';\n  const hasValue = value !== '';\n\n  const isFocusedRef = useRef(false);\n  const hasValueRef = useRef(hasValue);\n  hasValueRef.current = hasValue;\n\n  useEffect(() => {\n    const target = hasValue ? 1 : 0;\n    if (!isFocusedRef.current && floatProgress.value !== target) {\n      floatProgress.value = withTiming(target, TIMING_CONFIG);\n    }\n  }, [hasValue]);\n\n  const animationConstants = useMemo(() => ({\n    baseFontSize: fontSize + (boxStyle === 'inbox' ? 1 : 0),\n    targetFontSize: boxStyle === 'inbox' ? 10 : 11,\n    baseTop: isTextArea ? 12 : 0,\n    targetTopOffset: boxStyle === 'inbox' ? 17 : 2,\n  }), [fontSize, boxStyle, isTextArea]);\n\n  const animatedLabelStyle = useAnimatedStyle(() => {\n    const progress = floatProgress.value;\n\n    const labelTranslateY = interpolate(\n      progress,\n      [0, 1],\n      [\n        0,\n        isTextArea ? -24 : -(boxHeightValue.value / 2) - 1 + animationConstants.targetTopOffset - animationConstants.baseTop,\n      ],\n      'clamp'\n    );\n\n    const labelScale = interpolate(\n      progress,\n      [0, 1],\n      [1, animationConstants.targetFontSize / animationConstants.baseFontSize],\n      'clamp'\n    );\n\n    return {\n      transform: [\n        { translateY: labelTranslateY },\n        { scale: labelScale },\n      ],\n    };\n  }, [animationConstants, isTextArea]);\n\n  const handleLayout = useCallback((event: LayoutChangeEvent) => {\n    const { height } = event.nativeEvent.layout;\n    boxHeightValue.value = height;\n  }, []);\n\n  const handleFocus = useCallback(() => {\n    isFocusedRef.current = true;\n    if (floatProgress.value !== 1) {\n      floatProgress.value = withTiming(1, TIMING_CONFIG);\n    }\n    setIsFocusedForUI(true);\n  }, []);\n\n  const handleBlur = useCallback(() => {\n    isFocusedRef.current = false;\n    const target = hasValueRef.current ? 1 : 0;\n    if (floatProgress.value !== target) {\n      floatProgress.value = withTiming(target, TIMING_CONFIG);\n    }\n    setIsFocusedForUI(false);\n  }, []);\n\n  const colorConfig = useMemo(() => ({\n    primaryColor: focusColor || palette.primary.main,\n    defaultBorderColor: borderColor || palette.grey[30],\n    defaultLabelColor: labelColor || palette.text.secondary,\n    placeholderColor: placeHolderColor || palette.grey[40],\n    errorColor: fErrorColor,\n  }), [focusColor, palette.primary.main, borderColor, palette.grey, labelColor, palette.text.secondary, placeHolderColor, fErrorColor]);\n\n  const currentBorderColor = isError\n    ? colorConfig.errorColor\n    : isFocusedForUI\n      ? colorConfig.primaryColor\n      : colorConfig.defaultBorderColor;\n\n  const currentLabelColor = isError\n    ? colorConfig.errorColor\n    : isFocusedForUI\n      ? colorConfig.primaryColor\n      : hasValue\n        ? colorConfig.defaultLabelColor\n        : colorConfig.placeholderColor;\n\n  const styleConfig = useMemo(() => {\n    const baseStyle = {\n      width: '100%' as const,\n      justifyContent: isTextArea ? 'flex-start' as const : 'center' as const,\n      borderRadius,\n      paddingHorizontal,\n      backgroundColor: inputBgColor || palette.background.base,\n      paddingTop: boxStyle === 'inbox' ? 13 : 0,\n    };\n\n    // 박스 스타일에 따른 테두리 설정\n    let borderStyle = {};\n    if (boxStyle === 'outline' || boxStyle === 'inbox') {\n      borderStyle = { borderWidth };\n    } else if (boxStyle === 'underline') {\n      borderStyle = { borderBottomWidth: borderWidth };\n    }\n\n    // innerBoxStyle에 따른 스타일 설정\n    let innerStyle = {};\n    if (innerBoxStyle === 'top') {\n      innerStyle = {\n        borderBottomLeftRadius: 0,\n        borderBottomRightRadius: 0,\n        borderBottomWidth: borderWidth / 2\n      };\n    } else if (innerBoxStyle === 'middle') {\n      innerStyle = {\n        borderRadius: 0,\n        borderTopWidth: borderWidth / 2,\n        borderBottomWidth: borderWidth / 2\n      };\n    } else if (innerBoxStyle === 'bottom') {\n      innerStyle = {\n        borderTopLeftRadius: 0,\n        borderTopRightRadius: 0,\n        borderTopWidth: borderWidth / 2\n      };\n    }\n\n    return { ...baseStyle, ...borderStyle, ...innerStyle };\n  }, [isTextArea, borderRadius, paddingHorizontal, inputBgColor, borderWidth, boxStyle, innerBoxStyle, palette.background.base]);\n\n  const labelTextStyle: StyleProp<TextStyle> = useMemo(() => ({\n    fontSize,\n    top: animationConstants.baseTop,\n    left: paddingHorizontal,\n    transformOrigin: 'left center',\n    backgroundColor: labelBgColor || palette.background.base,\n    paddingHorizontal: boxStyle === 'outline' ? 5 : 0,\n    paddingVertical: 2,\n    textAlignVertical: 'center' as const,\n    fontFamily,\n    borderRadius: boxStyle === 'outline' ? 5 : 0,\n    ...(Platform.OS === 'android' ? { overflow: 'hidden' as const } : {}),\n  }), [fontSize, animationConstants.baseTop, paddingHorizontal, labelBgColor, palette.background.base, boxStyle, fontFamily]);\n\n  const handleTextChange = (text: string) => {\n    if (onChangeText) onChangeText(text);\n  };\n\n  const textInputStyle = useMemo(() => [\n    {\n      paddingTop: 7 + iosOffset,\n      paddingBottom: 5 + iosOffset,\n      color: palette.text.base,\n      fontSize,\n      width: '100%' as const,\n      paddingRight: 25,\n      fontFamily,\n      ...(Platform.OS === 'web' ? { outline: 'none' } : {}),\n    },\n    textInputProps?.style,\n  ], [palette.text.base, fontSize, fontFamily, textInputProps?.style]);\n\n  const shouldShowCloseButton = value && isFocusedForUI;\n  const shouldShowError = status === 'error' && errorMessage;\n\n  return (\n    <ViewAtom style={{ alignSelf: 'stretch', width: '100%' }}>\n      <ViewAtom\n        style={[styleConfig, { borderColor: currentBorderColor }]}\n        onLayout={handleLayout}\n        pointerEvents={disabled ? 'none' : 'auto'}\n      >\n        <TextInput\n          {...textInputProps}\n          ref={ref}\n          style={textInputStyle}\n          value={value}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          onChangeText={handleTextChange}\n          allowFontScaling={allowFontScaling}\n          selectionColor={palette.grey[50]}\n          autoCorrect={false}\n          spellCheck={false}\n        />\n\n        <ViewAtom pointerEvents=\"none\" style={{ position: 'absolute' }}>\n          <Animated.Text allowFontScaling={allowFontScaling} style={[labelTextStyle, { color: currentLabelColor }, animatedLabelStyle]}>\n            {label}\n          </Animated.Text>\n        </ViewAtom>\n\n        {shouldShowCloseButton && (\n          <ButtonClose marginTop={isTextArea ? 13 : undefined} onChangeText={onChangeText} />\n        )}\n      </ViewAtom>\n\n      {shouldShowError && (\n        <ErrorComponent errorMessage={errorMessage} errorColor={fErrorColor} />\n      )}\n    </ViewAtom>\n  );\n});\n\nZSTextField.displayName = 'ZSTextField';\n\nexport default ZSTextField;\n"]}

package/build/ui/atoms/AnimatedWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AnimatedWrapper.d.ts","sourceRoot":"","sources":["../../../src/ui/atoms/AnimatedWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAQ,SAAS,EAAY,MAAM,cAAc,CAAC;AAGzD,OAAO,EAAgB,WAAW,EAAmB,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAajG,UAAU,oBAAqB,SAAQ,SAAS;IAC9C,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B;AAED,iBAAS,eAAe,CAAC,EACvB,WAAkB,EAClB,cAAkB,EAClB,QAA2B,EAC3B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACT,EAAE,oBAAoB,qBAkFtB;;AAED,wBAA2C"}
+{"version":3,"file":"AnimatedWrapper.d.ts","sourceRoot":"","sources":["../../../src/ui/atoms/AnimatedWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAQ,SAAS,EAAY,MAAM,cAAc,CAAC;AAGzD,OAAO,EAAgB,WAAW,EAAmB,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAajG,UAAU,oBAAqB,SAAQ,SAAS;IAC9C,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B;AAED,iBAAS,eAAe,CAAC,EACvB,WAAkB,EAClB,cAAkB,EAClB,QAA2B,EAC3B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACT,EAAE,oBAAoB,qBAiFtB;;AAED,wBAA2C"}

package/build/ui/atoms/AnimatedWrapper.js

@@ -45,7 +45,6 @@ function AnimatedWrapper({ isAnimation = true, elevationLevel = 0, duration = DE
         return 0;
     }, []);
     const animatedStyle = useAnimatedStyle(() => {
-        'worklet';
         const shadowValue = shadowProgress.value;
         if (staticConfig.isIOS) {
             return { shadowOpacity: shadowValue * staticConfig.maxShadowOpacity };

package/build/ui/atoms/AnimatedWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnimatedWrapper.js","sourceRoot":"","sources":["../../../src/ui/atoms/AnimatedWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useMemo } from 'react';\nimport { View, ViewProps, Platform } from 'react-native';\nimport Animated, { FadeInDown, FadeOut, useAnimatedStyle, withTiming, useSharedValue, useDerivedValue } from 'react-native-reanimated';\nimport { useTheme } from '../../context/ThemeContext';\nimport { ColorPalette, ShadowLevel, ThemeBackground, ViewColorOptions } from '../../theme/types';\nimport { IOS_SHADOW } from '../../theme/elevation';\n\nconst DEFAULT_DURATION = 200 as const;\nconst SHADOW_DURATION = 50 as const;\nconst IS_IOS = Platform.OS === 'ios';\ntype SemanticPaletteKey = 'primary' | 'secondary' | 'danger' | 'warning' | 'success' | 'information' | 'grey';\ntype PaletteShade = keyof ColorPalette;\n\nfunction isColorMap(value: unknown): value is Record<string, string> {\n  return typeof value === 'object' && value !== null;\n}\n\ninterface AnimatedWrapperProps extends ViewProps {\n  isAnimation: boolean;\n  elevationLevel?: ShadowLevel;\n  duration?: number;\n  color?: ViewColorOptions;\n}\n\nfunction AnimatedWrapper({\n  isAnimation = true,\n  elevationLevel = 0,\n  duration = DEFAULT_DURATION,\n  style,\n  children,\n  color,\n  ...props\n}: AnimatedWrapperProps) {\n  const { elevation, palette } = useTheme();\n  const animationFinished = useSharedValue(false);\n  \n  const staticConfig = useMemo(() => ({\n    isIOS: IS_IOS,\n    maxShadowOpacity: IS_IOS ? IOS_SHADOW[elevationLevel].shadowOpacity : 0,\n    maxElevation: IS_IOS ? 0 : elevationLevel,\n  }), [elevationLevel]);\n  \n  const backgroundColor = useMemo(() => {\n    if (!color) {\n      return elevationLevel ? palette.background.base : undefined;\n    }\n    \n    const [c01, c02] = color.split('.') as [string, string | undefined];\n    if (c02) {\n      if (c01 === 'background') return palette.background[c02 as keyof ThemeBackground];\n      if (c01 === 'text') return palette.text[c02 as keyof typeof palette.text];\n\n      const semanticPalette = palette[c01 as SemanticPaletteKey];\n      return isColorMap(semanticPalette) ? semanticPalette[c02 as PaletteShade] : undefined;\n    }\n    if (c01) return palette.background[c01 as keyof ThemeBackground] ?? palette[c01 as SemanticPaletteKey]?.main;\n    if (elevationLevel) return palette.background.base;\n    return undefined;\n  }, [color, palette, elevationLevel]);\n\n  const staticStyle = elevation[elevationLevel];\n\n  const shadowProgress = useDerivedValue(() => {\n    'worklet';\n    if (animationFinished.value) {\n      return withTiming(1, { duration: SHADOW_DURATION });\n    }\n    return 0;\n  }, []);\n\n  const animatedStyle = useAnimatedStyle(() => {\n    'worklet';\n    const shadowValue = shadowProgress.value;\n    \n    if (staticConfig.isIOS) {\n      return { shadowOpacity: shadowValue * staticConfig.maxShadowOpacity };\n    }\n    return { elevation: shadowValue * staticConfig.maxElevation };\n  }, [staticConfig]);\n\n  const animationProps = useMemo(() => ({\n    entering: FadeInDown.duration(duration).withCallback((finished) => {\n      'worklet';\n      if (finished) {\n        animationFinished.value = true;\n      }\n    }),\n    exiting: FadeOut.duration(50),\n  }), [duration]);\n\n  const baseStyle = [\n    style,\n    backgroundColor && { backgroundColor },\n    staticStyle\n  ];\n\n  const animatedStyleArray = [\n    ...baseStyle,\n    animatedStyle\n  ];\n\n  if (!isAnimation) {\n    return <View style={baseStyle} {...props}>{children}</View>;\n  }\n\n  return (\n    <Animated.View\n      style={animatedStyleArray}\n      {...animationProps}\n      {...props}\n    >\n      {children}\n    </Animated.View>\n  );\n}\n\nexport default React.memo(AnimatedWrapper);\n"]}
+{"version":3,"file":"AnimatedWrapper.js","sourceRoot":"","sources":["../../../src/ui/atoms/AnimatedWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useMemo } from 'react';\nimport { View, ViewProps, Platform } from 'react-native';\nimport Animated, { FadeInDown, FadeOut, useAnimatedStyle, withTiming, useSharedValue, useDerivedValue } from 'react-native-reanimated';\nimport { useTheme } from '../../context/ThemeContext';\nimport { ColorPalette, ShadowLevel, ThemeBackground, ViewColorOptions } from '../../theme/types';\nimport { IOS_SHADOW } from '../../theme/elevation';\n\nconst DEFAULT_DURATION = 200 as const;\nconst SHADOW_DURATION = 50 as const;\nconst IS_IOS = Platform.OS === 'ios';\ntype SemanticPaletteKey = 'primary' | 'secondary' | 'danger' | 'warning' | 'success' | 'information' | 'grey';\ntype PaletteShade = keyof ColorPalette;\n\nfunction isColorMap(value: unknown): value is Record<string, string> {\n  return typeof value === 'object' && value !== null;\n}\n\ninterface AnimatedWrapperProps extends ViewProps {\n  isAnimation: boolean;\n  elevationLevel?: ShadowLevel;\n  duration?: number;\n  color?: ViewColorOptions;\n}\n\nfunction AnimatedWrapper({\n  isAnimation = true,\n  elevationLevel = 0,\n  duration = DEFAULT_DURATION,\n  style,\n  children,\n  color,\n  ...props\n}: AnimatedWrapperProps) {\n  const { elevation, palette } = useTheme();\n  const animationFinished = useSharedValue(false);\n  \n  const staticConfig = useMemo(() => ({\n    isIOS: IS_IOS,\n    maxShadowOpacity: IS_IOS ? IOS_SHADOW[elevationLevel].shadowOpacity : 0,\n    maxElevation: IS_IOS ? 0 : elevationLevel,\n  }), [elevationLevel]);\n  \n  const backgroundColor = useMemo(() => {\n    if (!color) {\n      return elevationLevel ? palette.background.base : undefined;\n    }\n    \n    const [c01, c02] = color.split('.') as [string, string | undefined];\n    if (c02) {\n      if (c01 === 'background') return palette.background[c02 as keyof ThemeBackground];\n      if (c01 === 'text') return palette.text[c02 as keyof typeof palette.text];\n\n      const semanticPalette = palette[c01 as SemanticPaletteKey];\n      return isColorMap(semanticPalette) ? semanticPalette[c02 as PaletteShade] : undefined;\n    }\n    if (c01) return palette.background[c01 as keyof ThemeBackground] ?? palette[c01 as SemanticPaletteKey]?.main;\n    if (elevationLevel) return palette.background.base;\n    return undefined;\n  }, [color, palette, elevationLevel]);\n\n  const staticStyle = elevation[elevationLevel];\n\n  const shadowProgress = useDerivedValue(() => {\n    'worklet';\n    if (animationFinished.value) {\n      return withTiming(1, { duration: SHADOW_DURATION });\n    }\n    return 0;\n  }, []);\n\n  const animatedStyle = useAnimatedStyle(() => {\n    const shadowValue = shadowProgress.value;\n    \n    if (staticConfig.isIOS) {\n      return { shadowOpacity: shadowValue * staticConfig.maxShadowOpacity };\n    }\n    return { elevation: shadowValue * staticConfig.maxElevation };\n  }, [staticConfig]);\n\n  const animationProps = useMemo(() => ({\n    entering: FadeInDown.duration(duration).withCallback((finished) => {\n      'worklet';\n      if (finished) {\n        animationFinished.value = true;\n      }\n    }),\n    exiting: FadeOut.duration(50),\n  }), [duration]);\n\n  const baseStyle = [\n    style,\n    backgroundColor && { backgroundColor },\n    staticStyle\n  ];\n\n  const animatedStyleArray = [\n    ...baseStyle,\n    animatedStyle\n  ];\n\n  if (!isAnimation) {\n    return <View style={baseStyle} {...props}>{children}</View>;\n  }\n\n  return (\n    <Animated.View\n      style={animatedStyleArray}\n      {...animationProps}\n      {...props}\n    >\n      {children}\n    </Animated.View>\n  );\n}\n\nexport default React.memo(AnimatedWrapper);\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@0610studio/zs-ui",
-  "version": "0.17.0",
+  "version": "0.17.1",
   "private": false,
   "description": "EXPO ZS-UI",
   "type": "commonjs",