@baishuyun/ai-design 2.0.37 → 2.1.0-alpha.0

package/src/components/ui/button.tsx

@@ -1,51 +1,51 @@
-import * as React from 'react';
-import { Slot } from '@radix-ui/react-slot';
-import { cva, type VariantProps } from 'class-variance-authority';
-
-import { cn } from '../../lib/utils';
-
-const buttonVariants = cva(
-  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-[14px] transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 rounded-[4px]',
-  {
-    variants: {
-      variant: {
-        default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',
-        destructive: 'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
-        outline:
-          'border border-[#e0e0e0] bg-white hover:bg-[#e0e0e0] text-[#121111]',
-        secondary: 'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
-        ghost: 'hover:bg-accent hover:text-accent-foreground',
-        link: 'text-primary underline-offset-4 hover:underline',
-        entry: '',
-      },
-      size: {
-        default: 'h-[34px] px-4 py-2',
-        sm: 'h-8 rounded-md px-3 text-xs',
-        lg: 'h-10 rounded-md px-8',
-        icon: 'h-[24px] w-[24px]',
-        entry: 'h-[30px] px-1.5 py-0 gap-1.5',
-      },
-    },
-    defaultVariants: {
-      variant: 'default',
-      size: 'default',
-    },
-  }
-);
-
-export interface ButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
-  asChild?: boolean;
-}
-
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-  ({ className, variant, size, asChild = false, ...props }, ref) => {
-    const Comp = asChild ? Slot : 'button';
-    return (
-      <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />
-    );
-  }
-);
-Button.displayName = 'Button';
-
-export { Button, buttonVariants };
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { cva, type VariantProps } from 'class-variance-authority';
+
+import { cn } from '../../lib/utils';
+
+const buttonVariants = cva(
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-[14px] transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 rounded-[4px]',
+  {
+    variants: {
+      variant: {
+        default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',
+        destructive: 'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
+        outline:
+          'border border-[#e0e0e0] bg-white hover:bg-[#e0e0e0] text-[#121111]',
+        secondary: 'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
+        ghost: 'hover:bg-accent hover:text-accent-foreground',
+        link: 'text-primary underline-offset-4 hover:underline',
+        entry: '',
+      },
+      size: {
+        default: 'h-[34px] px-4 py-2',
+        sm: 'h-8 rounded-md px-3 text-xs',
+        lg: 'h-10 rounded-md px-8',
+        icon: 'h-[24px] w-[24px]',
+        entry: 'h-[30px] px-1.5 py-0 gap-1.5',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default',
+    },
+  }
+);
+
+export interface ButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+  asChild?: boolean;
+}
+
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : 'button';
+    return (
+      <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />
+    );
+  }
+);
+Button.displayName = 'Button';
+
+export { Button, buttonVariants };

package/src/components/ui/calendar.tsx

@@ -1,57 +1,57 @@
-import {
-  DayPicker,
-  type DayPickerProps,
-} from 'react-day-picker';
-import 'react-day-picker/style.css';
-
-import { cn } from '../../lib/utils';
-
-export type CalendarProps = DayPickerProps;
-
-function Calendar({
-  className,
-  classNames,
-  showOutsideDays = true,
-  ...props
-}: CalendarProps) {
-  return (
-    <DayPicker
-      showOutsideDays={showOutsideDays}
-      className={cn('p-2', className)}
-      classNames={{
-        months: 'flex flex-col gap-2',
-        month: 'flex flex-col gap-2',
-        month_caption: 'flex justify-center pt-1 relative items-center w-full',
-        caption_label: 'text-[12px] font-medium text-[#121111]',
-        nav: 'flex items-center gap-1',
-        button_previous:
-          'absolute left-1 h-5 w-5 flex items-center justify-center rounded-[2px] hover:bg-[#EFF0F6] text-[#666666]',
-        button_next:
-          'absolute right-1 h-5 w-5 flex items-center justify-center rounded-[2px] hover:bg-[#EFF0F6] text-[#666666]',
-        month_grid: 'w-full border-collapse',
-        weekdays: 'flex',
-        weekday:
-          'flex-1 h-7 flex items-center justify-center text-[12px] text-[#999999] font-normal',
-        week: 'flex w-full mt-0.5',
-        day: 'flex-1 h-7 flex items-center justify-center text-[12px] text-[#121111] rounded-[2px] hover:bg-[#EFF0F6] cursor-pointer aria-selected:opacity-100',
-        day_button: 'w-full h-full flex items-center justify-center',
-        range_start:
-          'bg-[#0265FF] text-white rounded-r-none hover:bg-[#0265FF]',
-        range_end:
-          'bg-[#0265FF] text-white rounded-l-none hover:bg-[#0265FF]',
-        range_middle:
-          'bg-[#F0F6FF] text-[#0265FF] rounded-none hover:bg-[#E6EEFF]',
-        selected: 'bg-[#0265FF] text-white hover:bg-[#0265FF]',
-        today: 'text-[#0265FF] font-bold',
-        outside:
-          'text-[#CCCCCC] aria-selected:text-[#CCCCCC]',
-        disabled: 'text-[#CCCCCC] opacity-50',
-        hidden: 'invisible',
-        ...classNames,
-      }}
-      {...props}
-    />
-  );
-}
-
-export { Calendar };
+import {
+  DayPicker,
+  type DayPickerProps,
+} from 'react-day-picker';
+import 'react-day-picker/style.css';
+
+import { cn } from '../../lib/utils';
+
+export type CalendarProps = DayPickerProps;
+
+function Calendar({
+  className,
+  classNames,
+  showOutsideDays = true,
+  ...props
+}: CalendarProps) {
+  return (
+    <DayPicker
+      showOutsideDays={showOutsideDays}
+      className={cn('p-2', className)}
+      classNames={{
+        months: 'flex flex-col gap-2',
+        month: 'flex flex-col gap-2',
+        month_caption: 'flex justify-center pt-1 relative items-center w-full',
+        caption_label: 'text-[12px] font-medium text-[#121111]',
+        nav: 'flex items-center gap-1',
+        button_previous:
+          'absolute left-1 h-5 w-5 flex items-center justify-center rounded-[2px] hover:bg-[#EFF0F6] text-[#666666]',
+        button_next:
+          'absolute right-1 h-5 w-5 flex items-center justify-center rounded-[2px] hover:bg-[#EFF0F6] text-[#666666]',
+        month_grid: 'w-full border-collapse',
+        weekdays: 'flex',
+        weekday:
+          'flex-1 h-7 flex items-center justify-center text-[12px] text-[#999999] font-normal',
+        week: 'flex w-full mt-0.5',
+        day: 'flex-1 h-7 flex items-center justify-center text-[12px] text-[#121111] rounded-[2px] hover:bg-[#EFF0F6] cursor-pointer aria-selected:opacity-100',
+        day_button: 'w-full h-full flex items-center justify-center',
+        range_start:
+          'bg-[#0265FF] text-white rounded-r-none hover:bg-[#0265FF]',
+        range_end:
+          'bg-[#0265FF] text-white rounded-l-none hover:bg-[#0265FF]',
+        range_middle:
+          'bg-[#F0F6FF] text-[#0265FF] rounded-none hover:bg-[#E6EEFF]',
+        selected: 'bg-[#0265FF] text-white hover:bg-[#0265FF]',
+        today: 'text-[#0265FF] font-bold',
+        outside:
+          'text-[#CCCCCC] aria-selected:text-[#CCCCCC]',
+        disabled: 'text-[#CCCCCC] opacity-50',
+        hidden: 'invisible',
+        ...classNames,
+      }}
+      {...props}
+    />
+  );
+}
+
+export { Calendar };

package/src/components/ui/dialog.tsx

@@ -1,104 +1,104 @@
-import * as React from 'react';
-import * as DialogPrimitive from '@radix-ui/react-dialog';
-
-import { cn } from '../../lib/utils';
-
-const Dialog = DialogPrimitive.Root;
-
-const DialogTrigger = DialogPrimitive.Trigger;
-
-const DialogPortal = DialogPrimitive.Portal;
-
-const DialogClose = DialogPrimitive.Close;
-
-const DialogOverlay = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Overlay>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay> & {
-    position?: 'fixed' | 'absolute';
-  }
->(({ className, position = 'fixed', ...props }, ref) => (
-  <DialogPrimitive.Overlay
-    ref={ref}
-    className={cn(
-      'inset-0 z-50 bg-black/30 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
-      position === 'absolute' ? 'absolute' : 'fixed',
-      className
-    )}
-    {...props}
-  />
-));
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-
-const DialogContent = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & { container?: HTMLElement }
->(({ className, children, container, ...props }, ref) => {
-  return (
-    <DialogPortal container={container}>
-      <DialogOverlay position={container ? 'absolute' : 'fixed'} />
-      <DialogPrimitive.Content
-        style={{ padding: 0 }}
-        ref={ref}
-        className={cn(
-          'left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 sm:rounded-lg',
-          container ? 'absolute' : 'fixed',
-          className
-        )}
-        {...props}
-      >
-        {children}
-      </DialogPrimitive.Content>
-    </DialogPortal>
-  );
-});
-DialogContent.displayName = DialogPrimitive.Content.displayName;
-
-const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
-  <div className={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)} {...props} />
-);
-DialogHeader.displayName = 'DialogHeader';
-
-const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
-    {...props}
-  />
-);
-DialogFooter.displayName = 'DialogFooter';
-
-const DialogTitle = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Title>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>
->(({ className, ...props }, ref) => (
-  <DialogPrimitive.Title
-    ref={ref}
-    className={cn('text-lg font-semibold leading-none tracking-tight', className)}
-    {...props}
-  />
-));
-DialogTitle.displayName = DialogPrimitive.Title.displayName;
-
-const DialogDescription = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Description>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>
->(({ className, ...props }, ref) => (
-  <DialogPrimitive.Description
-    ref={ref}
-    className={cn('text-sm text-muted-foreground', className)}
-    {...props}
-  />
-));
-DialogDescription.displayName = DialogPrimitive.Description.displayName;
-
-export {
-  Dialog,
-  DialogPortal,
-  DialogOverlay,
-  DialogTrigger,
-  DialogClose,
-  DialogContent,
-  DialogHeader,
-  DialogFooter,
-  DialogTitle,
-  DialogDescription,
-};
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+
+import { cn } from '../../lib/utils';
+
+const Dialog = DialogPrimitive.Root;
+
+const DialogTrigger = DialogPrimitive.Trigger;
+
+const DialogPortal = DialogPrimitive.Portal;
+
+const DialogClose = DialogPrimitive.Close;
+
+const DialogOverlay = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Overlay>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay> & {
+    position?: 'fixed' | 'absolute';
+  }
+>(({ className, position = 'fixed', ...props }, ref) => (
+  <DialogPrimitive.Overlay
+    ref={ref}
+    className={cn(
+      'inset-0 z-50 bg-black/30 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
+      position === 'absolute' ? 'absolute' : 'fixed',
+      className
+    )}
+    {...props}
+  />
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+
+const DialogContent = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & { container?: HTMLElement }
+>(({ className, children, container, ...props }, ref) => {
+  return (
+    <DialogPortal container={container}>
+      <DialogOverlay position={container ? 'absolute' : 'fixed'} />
+      <DialogPrimitive.Content
+        style={{ padding: 0 }}
+        ref={ref}
+        className={cn(
+          'left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 sm:rounded-lg',
+          container ? 'absolute' : 'fixed',
+          className
+        )}
+        {...props}
+      >
+        {children}
+      </DialogPrimitive.Content>
+    </DialogPortal>
+  );
+});
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+
+const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+  <div className={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)} {...props} />
+);
+DialogHeader.displayName = 'DialogHeader';
+
+const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+  <div
+    className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
+    {...props}
+  />
+);
+DialogFooter.displayName = 'DialogFooter';
+
+const DialogTitle = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Title>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>
+>(({ className, ...props }, ref) => (
+  <DialogPrimitive.Title
+    ref={ref}
+    className={cn('text-lg font-semibold leading-none tracking-tight', className)}
+    {...props}
+  />
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+
+const DialogDescription = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Description>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>
+>(({ className, ...props }, ref) => (
+  <DialogPrimitive.Description
+    ref={ref}
+    className={cn('text-sm text-muted-foreground', className)}
+    {...props}
+  />
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+
+export {
+  Dialog,
+  DialogPortal,
+  DialogOverlay,
+  DialogTrigger,
+  DialogClose,
+  DialogContent,
+  DialogHeader,
+  DialogFooter,
+  DialogTitle,
+  DialogDescription,
+};