mirror of
https://github.com/Xevion/rdap.git
synced 2025-12-12 01:11:02 -06:00
feat: add CopyButton and StatusBadge components with enhanced RDAP card UX
This commit introduces two new reusable components and significantly improves the user experience across all RDAP cards: New Components: - CopyButton: Provides one-click copying functionality for handles, addresses, and other identifiers - StatusBadge: Displays color-coded status badges with proper type safety RDAP Card Enhancements: - Replace deprecated ClipboardCopyIcon with ClipboardIcon - Add copy buttons next to all handles, addresses, and identifiers - Migrate status displays from PropertyList to StatusBadge components with color coding - Replace PropertyList with proper DataList components for roles and public IDs - Improve Events table layout and styling - Wrap all copyable values in Code components for better visual distinction Type Safety Improvements: - Add rdapStatusColors mapping with proper Radix UI badge color types - Update IpNetwork and AutonomousNumber schemas to use typed StatusEnum arrays
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
import type { FunctionComponent, ReactNode } from "react";
|
||||
import React from "react";
|
||||
import { useBoolean } from "usehooks-ts";
|
||||
import { Link2Icon, CodeIcon, DownloadIcon, ClipboardCopyIcon } from "@radix-ui/react-icons";
|
||||
import { Link2Icon, CodeIcon, DownloadIcon, ClipboardIcon } from "@radix-ui/react-icons";
|
||||
import { Card, Flex, Box, IconButton, Code, ScrollArea } from "@radix-ui/themes";
|
||||
|
||||
type AbstractCardProps = {
|
||||
@@ -75,7 +75,7 @@ const AbstractCard: FunctionComponent<AbstractCardProps> = ({
|
||||
}}
|
||||
aria-label="Copy JSON to clipboard"
|
||||
>
|
||||
<ClipboardCopyIcon width="18" height="18" />
|
||||
<ClipboardIcon width="18" height="18" />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
variant="ghost"
|
||||
|
||||
Reference in New Issue
Block a user