RowMenu

import { PencilSimpleIcon, PhoneIcon, ProhibitIcon, WhatsappLogoIcon } from '@phosphor-icons/react';
import { RowMenu } from '@arbol-ai/ui';

<div className="rounded-card flex max-w-md items-center justify-between border px-4 py-2">
  <span className="text-sm">Ana Torres · +57 300 555 0101</span>
  <RowMenu
    actions={[
      { label: 'Edit', icon: <PencilSimpleIcon /> },
      { label: 'Call', icon: <PhoneIcon />, href: 'tel:+573005550101' },
      {
        label: 'WhatsApp',
        icon: <WhatsappLogoIcon />,
        href: 'https://wa.me/573005550101',
        target: '_blank',
      },
      { label: 'Deactivate', icon: <ProhibitIcon />, isDestructive: true },
    ]}
    label="Actions for Ana Torres"
  />
</div>