Components

8 components available

'use client';

import { useState } from 'react';

interface BottomSheetProps {
  isOpen: boolean;
  onClose: () => void;
}

const BottomSheet = ({ isOpen, onClose }: BottomSheetProps) => {
  const [isDragging, setIsDragging] = useState(false);
  const [offset, setOffset] = useState(0);

  const handleDrag = (e: React.TouchEvent<HTMLDivElement> | Re
BottomSheet
BottomSheet
Overlays
react
'use client';

import { useState } from 'react';

interface PopoverProps {
  title: string;
  content: string;
  actionText: string;
}

const Popover: React.FC<PopoverProps> = ({ title, content, actionText }) => {
  const [isOpen, setIsOpen] = useState(false);

  const handleToggle = () => {
    setIsOpen(!isOpen);
  };

  const handleClose = () =>
Popover
Popover
Overlays
react
'use client';

import React, { useState } from 'react';

interface TooltipProps {
  children: React.ReactNode;
  content: string;
  direction?: 'top' | 'bottom' | 'left' | 'right';
}

const Tooltip: React.FC<TooltipProps> = ({ children, content, direction = 'top' }) => {
  const [show, setShow] = useState(false);
  const [x, setX] = useState(0);
  
Tooltip
Tooltip
Overlays
react
'use client';

import { useState, useEffect } from 'react';

interface Command {
  id: number;
  title: string;
  description: string;
}

const commands: Command[] = [
  { id: 1, title: 'New File', description: 'Create a new file' },
  { id: 2, title: 'Open File', description: 'Open an existing file' },
  { id: 3, title: 'Save File', description: '
CommandPalette
CommandPalette
Overlays
react
'use client';

import React, { useState } from 'react';

interface AlertDialogProps {
  isOpen: boolean;
  onClose: () => void;
  onConfirm: () => void;
  title: string;
  description: string;
}

const AlertDialog: React.FC<AlertDialogProps> = ({
  isOpen,
  onClose,
  onConfirm,
  title,
  description,
}) => {
  if (!isOpen) return null;

  const 
AlertDialog
AlertDialog
Overlays
react
PRO
ContextMenu
Overlays
react
PRO
ToastNotification
Overlays
react
PRO
SlideDrawer
Overlays
react