@codefast/ui 0.0.50 → 0.0.52

package/src/react/command.tsx

@@ -13,18 +13,16 @@ import { Dialog, DialogContent } from './dialog';
 type CommandElement = React.ElementRef<typeof CommandPrimitive>;
 type CommandProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive>;
 
-const Command = React.forwardRef<CommandElement, CommandProps>(
-  ({ className, ...props }, ref) => (
-    <CommandPrimitive
-      ref={ref}
-      className={cn(
-        'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md',
-        className,
-      )}
-      {...props}
-    />
-  ),
-);
+const Command = React.forwardRef<CommandElement, CommandProps>(({ className, ...props }, ref) => (
+  <CommandPrimitive
+    ref={ref}
+    className={cn(
+      'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md',
+      className,
+    )}
+    {...props}
+  />
+));
 
 Command.displayName = CommandPrimitive.displayName;
 
@@ -34,10 +32,7 @@ Command.displayName = CommandPrimitive.displayName;
 
 type CommandDialogProps = React.ComponentProps<typeof Dialog>;
 
-function CommandDialog({
-  children,
-  ...props
-}: CommandDialogProps): React.JSX.Element {
+function CommandDialog({ children, ...props }: CommandDialogProps): React.JSX.Element {
   return (
     <Dialog {...props}>
       <DialogContent className="p-0">
@@ -54,28 +49,21 @@ function CommandDialog({
  * -------------------------------------------------------------------------- */
 
 type CommandInputElement = React.ElementRef<typeof CommandPrimitive.Input>;
-type CommandInputProps = React.ComponentPropsWithoutRef<
-  typeof CommandPrimitive.Input
->;
+type CommandInputProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>;
 
-const CommandInput = React.forwardRef<CommandInputElement, CommandInputProps>(
-  ({ className, ...props }, ref) => (
-    <div
-      className="flex items-center gap-2 border-b px-3"
-      cmdk-input-wrapper=""
-    >
-      <MagnifyingGlassIcon className="size-5 shrink-0 opacity-50" />
-      <CommandPrimitive.Input
-        ref={ref}
-        className={cn(
-          'placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent text-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',
-          className,
-        )}
-        {...props}
-      />
-    </div>
-  ),
-);
+const CommandInput = React.forwardRef<CommandInputElement, CommandInputProps>(({ className, ...props }, ref) => (
+  <div className="flex items-center gap-2 border-b px-3" cmdk-input-wrapper="">
+    <MagnifyingGlassIcon className="size-5 shrink-0 opacity-50" />
+    <CommandPrimitive.Input
+      ref={ref}
+      className={cn(
+        'placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent text-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',
+        className,
+      )}
+      {...props}
+    />
+  </div>
+));
 
 CommandInput.displayName = CommandPrimitive.Input.displayName;
 
@@ -84,19 +72,11 @@ CommandInput.displayName = CommandPrimitive.Input.displayName;
  * -------------------------------------------------------------------------- */
 
 type CommandListElement = React.ElementRef<typeof CommandPrimitive.List>;
-type CommandListProps = React.ComponentPropsWithoutRef<
-  typeof CommandPrimitive.List
->;
+type CommandListProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>;
 
-const CommandList = React.forwardRef<CommandListElement, CommandListProps>(
-  ({ className, ...props }, ref) => (
-    <CommandPrimitive.List
-      ref={ref}
-      className={cn('max-h-72 overflow-y-auto overflow-x-hidden', className)}
-      {...props}
-    />
-  ),
-);
+const CommandList = React.forwardRef<CommandListElement, CommandListProps>(({ className, ...props }, ref) => (
+  <CommandPrimitive.List ref={ref} className={cn('max-h-72 overflow-y-auto overflow-x-hidden', className)} {...props} />
+));
 
 CommandList.displayName = CommandPrimitive.List.displayName;
 
@@ -105,19 +85,11 @@ CommandList.displayName = CommandPrimitive.List.displayName;
  * -------------------------------------------------------------------------- */
 
 type CommandEmptyElement = React.ElementRef<typeof CommandPrimitive.Empty>;
-type CommandEmptyProps = React.ComponentPropsWithoutRef<
-  typeof CommandPrimitive.Empty
->;
+type CommandEmptyProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>;
 
-const CommandEmpty = React.forwardRef<CommandEmptyElement, CommandEmptyProps>(
-  (props, ref) => (
-    <CommandPrimitive.Empty
-      ref={ref}
-      className="py-6 text-center text-sm"
-      {...props}
-    />
-  ),
-);
+const CommandEmpty = React.forwardRef<CommandEmptyElement, CommandEmptyProps>((props, ref) => (
+  <CommandPrimitive.Empty ref={ref} className="py-6 text-center text-sm" {...props} />
+));
 
 CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
 
@@ -126,22 +98,18 @@ CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
  * -------------------------------------------------------------------------- */
 
 type CommandGroupElement = React.ElementRef<typeof CommandPrimitive.Group>;
-type CommandGroupProps = React.ComponentPropsWithoutRef<
-  typeof CommandPrimitive.Group
->;
+type CommandGroupProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>;
 
-const CommandGroup = React.forwardRef<CommandGroupElement, CommandGroupProps>(
-  ({ className, ...props }, ref) => (
-    <CommandPrimitive.Group
-      ref={ref}
-      className={cn(
-        'text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium',
-        className,
-      )}
-      {...props}
-    />
-  ),
-);
+const CommandGroup = React.forwardRef<CommandGroupElement, CommandGroupProps>(({ className, ...props }, ref) => (
+  <CommandPrimitive.Group
+    ref={ref}
+    className={cn(
+      'text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium',
+      className,
+    )}
+    {...props}
+  />
+));
 
 CommandGroup.displayName = CommandPrimitive.Group.displayName;
 
@@ -149,23 +117,14 @@ CommandGroup.displayName = CommandPrimitive.Group.displayName;
  * Component: CommandSeparator
  * -------------------------------------------------------------------------- */
 
-type CommandSeparatorElement = React.ElementRef<
-  typeof CommandPrimitive.Separator
->;
-type CommandSeparatorProps = React.ComponentPropsWithoutRef<
-  typeof CommandPrimitive.Separator
->;
-
-const CommandSeparator = React.forwardRef<
-  CommandSeparatorElement,
-  CommandSeparatorProps
->(({ className, ...props }, ref) => (
-  <CommandPrimitive.Separator
-    ref={ref}
-    className={cn('bg-border -mx-1 h-px', className)}
-    {...props}
-  />
-));
+type CommandSeparatorElement = React.ElementRef<typeof CommandPrimitive.Separator>;
+type CommandSeparatorProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>;
+
+const CommandSeparator = React.forwardRef<CommandSeparatorElement, CommandSeparatorProps>(
+  ({ className, ...props }, ref) => (
+    <CommandPrimitive.Separator ref={ref} className={cn('bg-border -mx-1 h-px', className)} {...props} />
+  ),
+);
 
 CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
 
@@ -174,22 +133,18 @@ CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
  * -------------------------------------------------------------------------- */
 
 type CommandItemElement = React.ElementRef<typeof CommandPrimitive.Item>;
-type CommandItemProps = React.ComponentPropsWithoutRef<
-  typeof CommandPrimitive.Item
->;
+type CommandItemProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>;
 
-const CommandItem = React.forwardRef<CommandItemElement, CommandItemProps>(
-  ({ className, ...props }, ref) => (
-    <CommandPrimitive.Item
-      ref={ref}
-      className={cn(
-        'aria-selected:bg-accent aria-selected:text-accent-foreground relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-selected:outline-none',
-        className,
-      )}
-      {...props}
-    />
-  ),
-);
+const CommandItem = React.forwardRef<CommandItemElement, CommandItemProps>(({ className, ...props }, ref) => (
+  <CommandPrimitive.Item
+    ref={ref}
+    className={cn(
+      'aria-selected:bg-accent aria-selected:text-accent-foreground relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-selected:outline-none',
+      className,
+    )}
+    {...props}
+  />
+));
 
 CommandItem.displayName = CommandPrimitive.Item.displayName;
 
@@ -198,19 +153,10 @@ CommandItem.displayName = CommandPrimitive.Item.displayName;
  * -------------------------------------------------------------------------- */
 
 type CommandLoadingElement = React.ElementRef<typeof CommandPrimitive.Loading>;
-type CommandLoadingProps = React.ComponentPropsWithoutRef<
-  typeof CommandPrimitive.Loading
->;
-
-const CommandLoading = React.forwardRef<
-  CommandLoadingElement,
-  CommandLoadingProps
->(({ className, ...props }, ref) => (
-  <CommandPrimitive.Loading
-    ref={ref}
-    className={cn('flex justify-center p-2', className)}
-    {...props}
-  />
+type CommandLoadingProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Loading>;
+
+const CommandLoading = React.forwardRef<CommandLoadingElement, CommandLoadingProps>(({ className, ...props }, ref) => (
+  <CommandPrimitive.Loading ref={ref} className={cn('flex justify-center p-2', className)} {...props} />
 ));
 
 CommandLoading.displayName = CommandPrimitive.Loading.displayName;
@@ -221,19 +167,8 @@ CommandLoading.displayName = CommandPrimitive.Loading.displayName;
 
 type CommandShortcutProps = React.HTMLAttributes<HTMLSpanElement>;
 
-function CommandShortcut({
-  className,
-  ...props
-}: CommandShortcutProps): React.JSX.Element {
-  return (
-    <span
-      className={cn(
-        'text-muted-foreground ml-auto text-xs tracking-widest',
-        className,
-      )}
-      {...props}
-    />
-  );
+function CommandShortcut({ className, ...props }: CommandShortcutProps): React.JSX.Element {
+  return <span className={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)} {...props} />;
 }
 
 /* -----------------------------------------------------------------------------

package/src/react/container.tsx

@@ -12,15 +12,11 @@ interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
   asChild?: boolean;
 }
 
-const Container = React.forwardRef<ContainerElement, ContainerProps>(
-  ({ className, asChild, ...props }, ref) => {
-    const Component = asChild ? Slot : 'div';
-
-    return (
-      <Component ref={ref} className={cn('container', className)} {...props} />
-    );
-  },
-);
+const Container = React.forwardRef<ContainerElement, ContainerProps>(({ className, asChild, ...props }, ref) => {
+  const Component = asChild ? Slot : 'div';
+
+  return <Component ref={ref} className={cn('container', className)} {...props} />;
+});
 
 Container.displayName = 'Container';