React 19 refactoring: Removed forwardRef references in all UI Components (#99)
* React 19 refactoring: Removed forwardRef references in all UI Components * Added Progress UI component from Shadcn * Updated dependencies * Formatted files * Fix Mobile Dropdowns
This commit is contained in:
committed by
GitHub
parent
970f901d05
commit
cec47cef78
@@ -3,42 +3,38 @@ import React from 'react';
|
||||
import { cn } from '../lib/utils';
|
||||
import { Button } from '../shadcn/button';
|
||||
|
||||
const EmptyStateHeading = React.forwardRef<
|
||||
HTMLHeadingElement,
|
||||
React.HTMLAttributes<HTMLHeadingElement>
|
||||
>(({ className, ...props }, ref) => (
|
||||
const EmptyStateHeading: React.FC<React.HTMLAttributes<HTMLHeadingElement>> = ({
|
||||
className,
|
||||
...props
|
||||
}) => (
|
||||
<h3
|
||||
ref={ref}
|
||||
className={cn('text-2xl font-bold tracking-tight', className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
);
|
||||
EmptyStateHeading.displayName = 'EmptyStateHeading';
|
||||
|
||||
const EmptyStateText = React.forwardRef<
|
||||
HTMLParagraphElement,
|
||||
React.HTMLAttributes<HTMLParagraphElement>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<p
|
||||
ref={ref}
|
||||
className={cn('text-sm text-muted-foreground', className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
const EmptyStateText: React.FC<React.HTMLAttributes<HTMLParagraphElement>> = ({
|
||||
className,
|
||||
...props
|
||||
}) => (
|
||||
<p className={cn('text-sm text-muted-foreground', className)} {...props} />
|
||||
);
|
||||
EmptyStateText.displayName = 'EmptyStateText';
|
||||
|
||||
const EmptyStateButton = React.forwardRef<
|
||||
HTMLButtonElement,
|
||||
const EmptyStateButton: React.FC<
|
||||
React.ComponentPropsWithoutRef<typeof Button>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<Button ref={ref} className={cn('mt-4', className)} {...props} />
|
||||
));
|
||||
> = ({ className, ...props }) => (
|
||||
<Button className={cn('mt-4', className)} {...props} />
|
||||
);
|
||||
|
||||
EmptyStateButton.displayName = 'EmptyStateButton';
|
||||
|
||||
const EmptyState = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({ children, className, ...props }, ref) => {
|
||||
const EmptyState: React.FC<React.HTMLAttributes<HTMLDivElement>> = ({
|
||||
children,
|
||||
className,
|
||||
...props
|
||||
}) => {
|
||||
const childrenArray = React.Children.toArray(children);
|
||||
|
||||
const heading = childrenArray.find(
|
||||
@@ -63,7 +59,6 @@ const EmptyState = React.forwardRef<
|
||||
|
||||
return (
|
||||
<div
|
||||
ref={ref}
|
||||
className={cn(
|
||||
'flex flex-1 items-center justify-center rounded-lg border border-dashed shadow-sm',
|
||||
className,
|
||||
@@ -78,7 +73,7 @@ const EmptyState = React.forwardRef<
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
};
|
||||
EmptyState.displayName = 'EmptyState';
|
||||
|
||||
export { EmptyState, EmptyStateHeading, EmptyStateText, EmptyStateButton };
|
||||
|
||||
Reference in New Issue
Block a user