mirror of
https://github.com/johndoe6345789/metabuilder.git
synced 2026-04-29 08:14:57 +00:00
johndoe6345789
d23f4a8be4
FakeMUI Components (MUI API compatibility): - Add sx prop support to all components via sxToStyle utility - Add MUI-style variants to Button (contained, outlined) - Add component prop to Typography for polymorphic rendering - Add label prop to Chip (MUI uses label vs children) - Add edge/color/size props to IconButton - Add component prop to List for nav rendering - Add href support to ListItemButton - Add variant prop to Avatar - Add PaperProps to Drawer New @metabuilder/components package: - vanilla/loading - LoadingIndicator, InlineLoader, AsyncLoading - vanilla/error - ErrorBoundary, ErrorDisplay, withErrorBoundary - vanilla/empty-state - EmptyState + 7 specialized variants - vanilla/skeleton - Skeleton + 6 specialized variants - Organized by framework: vanilla/, radix/, fakemui/ Hooks consolidation (FakeMUI → root hooks/): - useAccessible (5 accessibility hooks) - useToast with ToastProvider - FakeMUI re-exports from hooks for backward compatibility WorkflowUI fixes: - Fix showNotification → useUI error/success methods - Fix Redux reducer setTimeout (Immer proxy issue) - Fix useRef type error - Update to Next.js 16.1.6 with webpack mode - Add @metabuilder/fakemui dependency Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
24 lines
630 B
TypeScript
24 lines
630 B
TypeScript
import React, { forwardRef } from 'react'
|
|
import { sxToStyle } from '../utils/sx'
|
|
|
|
export interface BoxProps extends React.HTMLAttributes<HTMLElement> {
|
|
children?: React.ReactNode
|
|
component?: React.ElementType
|
|
sx?: Record<string, unknown> // MUI sx prop for styling compatibility
|
|
}
|
|
|
|
export const Box = forwardRef<HTMLElement, BoxProps>(
|
|
({ children, component: Component = 'div', className = '', sx, style, ...props }, ref) => (
|
|
<Component
|
|
ref={ref}
|
|
className={className}
|
|
style={{ ...sxToStyle(sx), ...style }}
|
|
{...props}
|
|
>
|
|
{children}
|
|
</Component>
|
|
)
|
|
)
|
|
|
|
Box.displayName = 'Box'
|