Action Sheet

'use client'

import React, { useState } from 'react'
import { ActionSheet, ActionSheetAction, Button, Stack } from 'biibaos'
import { Download, Star, Trash } from 'lucide-react'

export default function App() {
  const [isOpen, setIsOpen] = useState(false)

  const actions: ActionSheetAction[] = [
    { label: 'Save Image', icon: <Download size={16} />, onClick: () => alert('Saved') },
    { label: 'Copy Link', icon: <LinkIcon size={16} />, onClick: () => alert('Copied') },
    { label: 'Add to Favorites', icon: <Star size={16} />, onClick: () => alert('Added') },
    { label: 'Delete Photo', icon: <Trash size={16} />, destructive: true, onClick: () => alert('Deleted') }
  ]

  return (
    <Stack align="center" justify="center" style={{ padding: 24 }}>
      <Button onClick={() => setIsOpen(true)}>Open Action Sheet</Button>
      
      <ActionSheet 
        isOpen={isOpen} 
        onClose={() => setIsOpen(false)}
        title="Photo Options"
        description="Select an action to perform on this photo."
        actions={actions}
        cancelLabel="Cancel"
      />
    </Stack>
  )
}