back to lab

Popover Slide Selector

June 2024

A popover slide selector component that reveals a list of items on click. The list items are avatars from my last 10 GitHub followers. The component is inspired by the Telegram iOS app.

Unlock code snippet

Enter your email to access all code snippets and subscribe to my newsletter for updates.

import { useState } from "react";
import Button from "./ui/Button";


// Nice try lol, I promise I will not send you a tons of spam emails
// I just want to build a newsletter list to share my latest content with you 🥹


const INIT = "INIT";
const SUBMITTING = "SUBMITTING";
const ERROR = "ERROR";
const SUCCESS = "SUCCESS";


const formStates = [INIT, SUBMITTING, ERROR, SUCCESS] as const;




function NewsletterForm() {
  return (
    <form>
      <input type="email" placeholder="
        Enter your email" />
        <Button type="submit">Subscribe</Button>
        </form>
        );
    }
}
Draggable Curved Menu
Run Stats Stacks