Compose Email Card

Renders a compact card for composing emails with recipient, subject, and actions. It includes tools for adding attachments, links, and emojis. The card allows users to send or close the email. Use when building an email interface with basic composition features.

byWatermelon Corp from Watermelon

Installation

terminal

pnpm dlx layro-cli add @watermeloncorp/compose-email-card

npx layro-cli add @watermeloncorp/compose-email-card

npx layro-cli add @watermeloncorp/compose-email-card

bunx layro-cli add @watermeloncorp/compose-email-card

New project? Start with init. Writes third-party code and installs packages with scripts off.

Code

Demo

'use client';

import { useState, useRef, useEffect, useLayoutEffect, type FC } from 'react';
import { motion, AnimatePresence } from 'motion/react';
import {
  X,
  Minus,
  Maximize2,
  Mail,
  ChevronDown,
  Smile,
  Paperclip,
  Link2,
  Sparkles,