test(accordion-native): restore callapsible view

mendix · Nov 27, 2023 · 5f9cfee · 5f9cfee
1 parent e6d27f6
commit 5f9cfee
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/packages/pluggableWidgets/accordion-native/src/components/AccordionGroup.tsx b/packages/pluggableWidgets/accordion-native/src/components/AccordionGroup.tsx
@@ -3,6 +3,7 @@ import { View, Pressable, Text } from "react-native";
 import { DynamicValue, NativeIcon } from "mendix";
 
 import { GroupIcon } from "./GroupIcon";
+import { AnimatedCollapsibleView } from "./CollapsibleView";
 import { GroupsType, IconEnum } from "../../typings/AccordionProps";
 import { AccordionGroupStyle } from "../ui/Styles";
 
@@ -53,9 +54,9 @@ export function AccordionGroup({
                     />
                 ) : null}
             </Pressable>
-            <View style={{ overflow: "hidden" }}>
-                {isExpanded && <View style={style.content}>{group.content}</View>}
-            </View>
+            <AnimatedCollapsibleView isExpanded={isExpanded} style={style.content}>
+                {group.content}
+            </AnimatedCollapsibleView>
         </View>
     ) : null;
 }
diff --git a/packages/pluggableWidgets/accordion-native/src/components/CollapsibleView.tsx b/packages/pluggableWidgets/accordion-native/src/components/CollapsibleView.tsx
@@ -0,0 +1,12 @@
+import { createElement, ReactElement, ReactNode } from "react";
+import { View, ViewStyle } from "react-native";
+
+interface CollapsibleViewProps {
+    isExpanded: boolean;
+    style: ViewStyle;
+    children: ReactNode;
+}
+
+export function AnimatedCollapsibleView({ isExpanded, style, children }: CollapsibleViewProps): ReactElement {
+    return <View style={{ overflow: "hidden" }}>{isExpanded && <View style={style}>{children}</View>}</View>;
+}