mirror of
https://github.com/johndoe6345789/metabuilder.git
synced 2026-04-24 13:54:57 +00:00
johndoe6345789
3ad0ca1bc7
New shared components for cross-project reuse: **vanilla/notifications/** - NotificationContainer - renders notification list (Redux-agnostic) - NotificationItem - individual notification with auto-dismiss - useNotificationState - local state hook for notifications - Supports success/error/warning/info types - Configurable position (top-left, top-right, bottom-*, etc.) **vanilla/status-indicators/** - StatusBadge - generic status badge with variants - ConnectionStatus - connected/disconnected indicator - BackendStatus - multi-state backend indicator (connected/local/connecting/error) - All with proper ARIA labels and CSS animations **radix/dialogs/** - KeyboardShortcutsContent - generic shortcuts display - ShortcutRow - single shortcut key + description row - getPlatformModifier - detects ⌘ vs Ctrl - createShortcut - helper for platform-aware shortcuts - Accepts shortcuts as props (not hardcoded) All components follow accessibility best practices with data-testid, ARIA attributes, and reduced-motion support. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
94 lines
1.8 KiB
TypeScript
94 lines
1.8 KiB
TypeScript
/**
|
|
* Vanilla React Components
|
|
*
|
|
* Pure React components with no external UI library dependencies.
|
|
* These components use only React and inline styles.
|
|
*/
|
|
|
|
// Loading components
|
|
export {
|
|
LoadingIndicator,
|
|
InlineLoader,
|
|
AsyncLoading,
|
|
loadingStyles,
|
|
type LoadingIndicatorProps,
|
|
type InlineLoaderProps,
|
|
type AsyncLoadingProps,
|
|
} from './loading'
|
|
|
|
// Error handling components
|
|
export {
|
|
ErrorBoundary,
|
|
withErrorBoundary,
|
|
ErrorDisplay,
|
|
type ErrorBoundaryProps,
|
|
type ErrorReporter,
|
|
type ErrorDisplayProps,
|
|
} from './error'
|
|
|
|
// Empty state components
|
|
export {
|
|
EmptyState,
|
|
NoDataFound,
|
|
NoResultsFound,
|
|
NoItemsYet,
|
|
AccessDeniedState,
|
|
ErrorState,
|
|
NoConnectionState,
|
|
LoadingCompleteState,
|
|
emptyStateStyles,
|
|
type EmptyStateProps,
|
|
} from './empty-state'
|
|
|
|
// Skeleton components
|
|
export {
|
|
Skeleton,
|
|
TableSkeleton,
|
|
CardSkeleton,
|
|
ListSkeleton,
|
|
FormSkeleton,
|
|
AvatarSkeleton,
|
|
TextSkeleton,
|
|
skeletonStyles,
|
|
type SkeletonProps,
|
|
type TableSkeletonProps,
|
|
type CardSkeletonProps,
|
|
type ListSkeletonProps,
|
|
type FormSkeletonProps,
|
|
type AvatarSkeletonProps,
|
|
type TextSkeletonProps,
|
|
} from './skeleton'
|
|
|
|
// Access denied component
|
|
export {
|
|
AccessDenied,
|
|
accessDeniedStyles,
|
|
type AccessDeniedProps,
|
|
} from './access-denied'
|
|
|
|
// Notification components
|
|
export {
|
|
NotificationContainer,
|
|
NotificationItem,
|
|
useNotificationState,
|
|
notificationStyles,
|
|
type NotificationData,
|
|
type NotificationType,
|
|
type NotificationPosition,
|
|
type NotificationContainerProps,
|
|
type NotificationItemProps,
|
|
} from './notifications'
|
|
|
|
// Status indicator components
|
|
export {
|
|
StatusBadge,
|
|
ConnectionStatus,
|
|
BackendStatus,
|
|
statusIndicatorStyles,
|
|
type StatusVariant,
|
|
type BackendStatusType,
|
|
type StatusBadgeProps,
|
|
type ConnectionStatusProps,
|
|
type BackendStatusProps,
|
|
} from './status-indicators'
|