diff options
Diffstat (limited to 'src/components/Menu')
-rw-r--r-- | src/components/Menu/index.tsx | 37 | ||||
-rw-r--r-- | src/components/Menu/index.web.tsx | 4 |
2 files changed, 39 insertions, 2 deletions
diff --git a/src/components/Menu/index.tsx b/src/components/Menu/index.tsx index 76fc74dc1..c5ccfa5ec 100644 --- a/src/components/Menu/index.tsx +++ b/src/components/Menu/index.tsx @@ -244,6 +244,38 @@ export function ItemRadio({selected}: {selected: boolean}) { ) } +/** + * NATIVE ONLY - for adding non-pressable items to the menu + * + * @platform ios, android + */ +export function ContainerItem({ + children, + style, +}: { + children: React.ReactNode + style?: StyleProp<ViewStyle> +}) { + const t = useTheme() + return ( + <View + style={[ + a.flex_row, + a.align_center, + a.gap_sm, + a.px_md, + a.rounded_md, + a.border, + t.atoms.bg_contrast_25, + t.atoms.border_contrast_low, + {paddingVertical: 10}, + style, + ]}> + {children} + </View> + ) +} + export function LabelText({children}: {children: React.ReactNode}) { const t = useTheme() return ( @@ -272,13 +304,14 @@ export function Group({children, style}: GroupProps) { style, ]}> {flattenReactChildren(children).map((child, i) => { - return React.isValidElement(child) && child.type === Item ? ( + return React.isValidElement(child) && + (child.type === Item || child.type === ContainerItem) ? ( <React.Fragment key={i}> {i > 0 ? ( <View style={[a.border_b, t.atoms.border_contrast_low]} /> ) : null} {React.cloneElement(child, { - // @ts-ignore + // @ts-expect-error cloneElement is not aware of the types style: { borderRadius: 0, borderWidth: 0, diff --git a/src/components/Menu/index.web.tsx b/src/components/Menu/index.web.tsx index 27678bf2f..7d6e50556 100644 --- a/src/components/Menu/index.web.tsx +++ b/src/components/Menu/index.web.tsx @@ -390,3 +390,7 @@ export function Divider() { /> ) } + +export function ContainerItem() { + return null +} |