f6ac399c06
Deskripsi: - ui menu bottom dan header saat file dokumen sedang keselect - modal informasi - ui accordion - nb : scroll view di modal masih blm bisa No Issues
37 lines
1.0 KiB
TypeScript
37 lines
1.0 KiB
TypeScript
import Styles from "@/constants/Styles";
|
|
import { View } from "react-native";
|
|
import Animated, { useAnimatedStyle, useDerivedValue, useSharedValue, withTiming } from "react-native-reanimated";
|
|
|
|
type Props = {
|
|
isExpanded: any,
|
|
children: React.ReactNode,
|
|
viewKey: string,
|
|
duration: number,
|
|
}
|
|
|
|
export default function ItemAccordion({ isExpanded, children, viewKey, duration = 500, }: Props) {
|
|
const height = useSharedValue(0);
|
|
|
|
const derivedHeight = useDerivedValue(() =>
|
|
withTiming(height.value * Number(isExpanded.value), {
|
|
duration,
|
|
})
|
|
);
|
|
const bodyStyle = useAnimatedStyle(() => ({
|
|
height: derivedHeight.value,
|
|
}));
|
|
|
|
return (
|
|
<Animated.View
|
|
key={`accordionItem_${viewKey}`}
|
|
style={[Styles.animatedView, bodyStyle]}>
|
|
<View
|
|
onLayout={(e) => {
|
|
height.value = e.nativeEvent.layout.height;
|
|
}}
|
|
style={Styles.wrapperAccordion}>
|
|
{children}
|
|
</View>
|
|
</Animated.View>
|
|
)
|
|
} |