import ActionSheetThemed from '@/components/ActionSheetThemed';

import { useRef } from 'react';
import { View, Button, Pressable, Text } from 'react-native';
import ActionSheetThemed from '@/components/ActionSheetThemed';
import { ActionSheetRef } from 'react-native-actions-sheet';
 
// Create a reference to control the action sheet
const actionSheetRef = useRef<ActionSheetRef>(null);
 
// Open the action sheet
const openSheet = () => actionSheetRef.current?.show();
 
// Component with action sheet
<View>
  <Button title="Show Options" onPress={openSheet} />
  
  <ActionSheetThemed ref={actionSheetRef}>
    <View className="p-4">
      <Text className="text-xl font-bold mb-4">Select an option</Text>
      
      <Pressable 
        className="py-3" 
        onPress={() => {
          actionSheetRef.current?.hide();
          // Handle option 1
        }}
      >
        <Text>Option 1</Text>
      </Pressable>
      
      <Pressable 
        className="py-3 mt-4"
        onPress={() => actionSheetRef.current?.hide()}
      >
        <Text>Cancel</Text>
      </Pressable>
    </View>
  </ActionSheetThemed>
</View>