expose as PeekMenu
This commit is contained in:
@@ -0,0 +1,12 @@
|
|||||||
|
export type {
|
||||||
|
MenuItemSpec,
|
||||||
|
PreviewContent,
|
||||||
|
} from '../../../modules/expo-bluesky-context-menu'
|
||||||
|
export {
|
||||||
|
Menu,
|
||||||
|
MenuItem,
|
||||||
|
MenuItemIcon,
|
||||||
|
MenuItemText,
|
||||||
|
Root,
|
||||||
|
Trigger,
|
||||||
|
} from '../../../modules/expo-bluesky-context-menu'
|
||||||
@@ -0,0 +1,54 @@
|
|||||||
|
import {type ReactNode} from 'react'
|
||||||
|
import {type StyleProp, View, type ViewStyle} from 'react-native'
|
||||||
|
|
||||||
|
import {type IconWithSvgMeta} from '#/components/icons/TEMPLATE'
|
||||||
|
import {type PreviewContent} from '../../../modules/expo-bluesky-context-menu'
|
||||||
|
|
||||||
|
export type {
|
||||||
|
MenuItemSpec,
|
||||||
|
PreviewContent,
|
||||||
|
} from '../../../modules/expo-bluesky-context-menu'
|
||||||
|
|
||||||
|
export function Root({
|
||||||
|
children,
|
||||||
|
style,
|
||||||
|
}: {
|
||||||
|
children: ReactNode
|
||||||
|
style?: StyleProp<ViewStyle>
|
||||||
|
}) {
|
||||||
|
return <View style={style}>{children}</View>
|
||||||
|
}
|
||||||
|
|
||||||
|
export function Trigger({
|
||||||
|
children,
|
||||||
|
}: {
|
||||||
|
preview?: PreviewContent
|
||||||
|
onPreviewPress?: () => void
|
||||||
|
borderRadius?: number
|
||||||
|
style?: StyleProp<ViewStyle>
|
||||||
|
children: ReactNode
|
||||||
|
}) {
|
||||||
|
return <>{children}</>
|
||||||
|
}
|
||||||
|
|
||||||
|
export function Menu(_: {children: ReactNode}): null {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
export function MenuItem(_: {
|
||||||
|
id: string
|
||||||
|
destructive?: boolean
|
||||||
|
disabled?: boolean
|
||||||
|
onSelect: () => void
|
||||||
|
children: ReactNode
|
||||||
|
}): null {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
export function MenuItemIcon(_: {icon: IconWithSvgMeta}): null {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
export function MenuItemText(_: {children: string}): null {
|
||||||
|
return null
|
||||||
|
}
|
||||||
@@ -1,14 +1,13 @@
|
|||||||
import {type ReactNode} from 'react'
|
import {type ReactNode} from 'react'
|
||||||
import {type StyleProp, type ViewStyle} from 'react-native'
|
import {type StyleProp, type ViewStyle} from 'react-native'
|
||||||
import {msg} from '@lingui/core/macro'
|
import {useLingui} from '@lingui/react/macro'
|
||||||
import {useLingui} from '@lingui/react'
|
|
||||||
|
|
||||||
import {shareImageModal} from '#/lib/media/manip'
|
import {shareImageModal} from '#/lib/media/manip'
|
||||||
import {useSaveImageToMediaLibrary} from '#/lib/media/save-image'
|
import {useSaveImageToMediaLibrary} from '#/lib/media/save-image'
|
||||||
import {ArrowShareRight_Stroke2_Corner2_Rounded as ShareIcon} from '#/components/icons/ArrowShareRight'
|
import {ArrowShareRight_Stroke2_Corner2_Rounded as ShareIcon} from '#/components/icons/ArrowShareRight'
|
||||||
import {Download_Stroke2_Corner0_Rounded as DownloadIcon} from '#/components/icons/Download'
|
import {Download_Stroke2_Corner0_Rounded as DownloadIcon} from '#/components/icons/Download'
|
||||||
|
import * as PeekMenu from '#/components/PeekMenu'
|
||||||
import {IS_IOS} from '#/env'
|
import {IS_IOS} from '#/env'
|
||||||
import * as ContextMenu from '../../../../modules/expo-bluesky-context-menu'
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Wraps an image embed with the iOS peek-and-menu interaction. On non-iOS
|
* Wraps an image embed with the iOS peek-and-menu interaction. On non-iOS
|
||||||
@@ -38,7 +37,7 @@ export function ImageContextMenu({
|
|||||||
style?: StyleProp<ViewStyle>
|
style?: StyleProp<ViewStyle>
|
||||||
children: ReactNode
|
children: ReactNode
|
||||||
}) {
|
}) {
|
||||||
const {_} = useLingui()
|
const {t: l} = useLingui()
|
||||||
const saveImage = useSaveImageToMediaLibrary()
|
const saveImage = useSaveImageToMediaLibrary()
|
||||||
|
|
||||||
if (!IS_IOS) {
|
if (!IS_IOS) {
|
||||||
@@ -53,8 +52,8 @@ export function ImageContextMenu({
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ContextMenu.Root style={style}>
|
<PeekMenu.Root style={style}>
|
||||||
<ContextMenu.Trigger
|
<PeekMenu.Trigger
|
||||||
preview={{
|
preview={{
|
||||||
type: 'image',
|
type: 'image',
|
||||||
uri: fullsizeUri,
|
uri: fullsizeUri,
|
||||||
@@ -64,19 +63,17 @@ export function ImageContextMenu({
|
|||||||
borderRadius={borderRadius}
|
borderRadius={borderRadius}
|
||||||
onPreviewPress={onPreviewPress}>
|
onPreviewPress={onPreviewPress}>
|
||||||
{children}
|
{children}
|
||||||
</ContextMenu.Trigger>
|
</PeekMenu.Trigger>
|
||||||
<ContextMenu.Menu>
|
<PeekMenu.Menu>
|
||||||
<ContextMenu.MenuItem id="save" onSelect={handleSave}>
|
<PeekMenu.MenuItem id="save" onSelect={handleSave}>
|
||||||
<ContextMenu.MenuItemIcon icon={DownloadIcon} />
|
<PeekMenu.MenuItemIcon icon={DownloadIcon} />
|
||||||
<ContextMenu.MenuItemText>
|
<PeekMenu.MenuItemText>{l`Save image`}</PeekMenu.MenuItemText>
|
||||||
{_(msg`Save image`)}
|
</PeekMenu.MenuItem>
|
||||||
</ContextMenu.MenuItemText>
|
<PeekMenu.MenuItem id="share" onSelect={handleShare}>
|
||||||
</ContextMenu.MenuItem>
|
<PeekMenu.MenuItemIcon icon={ShareIcon} />
|
||||||
<ContextMenu.MenuItem id="share" onSelect={handleShare}>
|
<PeekMenu.MenuItemText>{l`Share`}</PeekMenu.MenuItemText>
|
||||||
<ContextMenu.MenuItemIcon icon={ShareIcon} />
|
</PeekMenu.MenuItem>
|
||||||
<ContextMenu.MenuItemText>{_(msg`Share`)}</ContextMenu.MenuItemText>
|
</PeekMenu.Menu>
|
||||||
</ContextMenu.MenuItem>
|
</PeekMenu.Root>
|
||||||
</ContextMenu.Menu>
|
|
||||||
</ContextMenu.Root>
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user