@vendure/dashboard 3.2.0 → 3.2.1

package/src/lib/components/ui/breadcrumb.tsx

@@ -1,102 +1,102 @@
-import * as React from 'react';
-import { Slot } from '@radix-ui/react-slot';
-import { ChevronRight, MoreHorizontal } from 'lucide-react';
-
-import { cn } from '@/lib/utils.js';
-
-function Breadcrumb({ ...props }: React.ComponentProps<'nav'>) {
-    return <nav aria-label="breadcrumb" data-slot="breadcrumb" {...props} />;
-}
-
-function BreadcrumbList({ className, ...props }: React.ComponentProps<'ol'>) {
-    return (
-        <ol
-            data-slot="breadcrumb-list"
-            className={cn(
-                'text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5',
-                className,
-            )}
-            {...props}
-        />
-    );
-}
-
-function BreadcrumbItem({ className, ...props }: React.ComponentProps<'li'>) {
-    return (
-        <li
-            data-slot="breadcrumb-item"
-            className={cn('inline-flex items-center gap-1.5', className)}
-            {...props}
-        />
-    );
-}
-
-function BreadcrumbLink({
-    asChild,
-    className,
-    ...props
-}: React.ComponentProps<'a'> & {
-    asChild?: boolean;
-}) {
-    const Comp = asChild ? Slot : 'a';
-
-    return (
-        <Comp
-            data-slot="breadcrumb-link"
-            className={cn('hover:text-foreground transition-colors', className)}
-            {...props}
-        />
-    );
-}
-
-function BreadcrumbPage({ className, ...props }: React.ComponentProps<'span'>) {
-    return (
-        <span
-            data-slot="breadcrumb-page"
-            role="link"
-            aria-disabled="true"
-            aria-current="page"
-            className={cn('text-foreground font-normal', className)}
-            {...props}
-        />
-    );
-}
-
-function BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<'li'>) {
-    return (
-        <li
-            data-slot="breadcrumb-separator"
-            role="presentation"
-            aria-hidden="true"
-            className={cn('[&>svg]:size-3.5', className)}
-            {...props}
-        >
-            {children ?? <ChevronRight />}
-        </li>
-    );
-}
-
-function BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<'span'>) {
-    return (
-        <span
-            data-slot="breadcrumb-ellipsis"
-            role="presentation"
-            aria-hidden="true"
-            className={cn('flex size-9 items-center justify-center', className)}
-            {...props}
-        >
-            <MoreHorizontal className="size-4" />
-            <span className="sr-only">More</span>
-        </span>
-    );
-}
-
-export {
-    Breadcrumb,
-    BreadcrumbList,
-    BreadcrumbItem,
-    BreadcrumbLink,
-    BreadcrumbPage,
-    BreadcrumbSeparator,
-    BreadcrumbEllipsis,
-};
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { ChevronRight, MoreHorizontal } from 'lucide-react';
+
+import { cn } from '@/lib/utils.js';
+
+function Breadcrumb({ ...props }: React.ComponentProps<'nav'>) {
+    return <nav aria-label="breadcrumb" data-slot="breadcrumb" {...props} />;
+}
+
+function BreadcrumbList({ className, ...props }: React.ComponentProps<'ol'>) {
+    return (
+        <ol
+            data-slot="breadcrumb-list"
+            className={cn(
+                'text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5',
+                className,
+            )}
+            {...props}
+        />
+    );
+}
+
+function BreadcrumbItem({ className, ...props }: React.ComponentProps<'li'>) {
+    return (
+        <li
+            data-slot="breadcrumb-item"
+            className={cn('inline-flex items-center gap-1.5', className)}
+            {...props}
+        />
+    );
+}
+
+function BreadcrumbLink({
+    asChild,
+    className,
+    ...props
+}: React.ComponentProps<'a'> & {
+    asChild?: boolean;
+}) {
+    const Comp = asChild ? Slot : 'a';
+
+    return (
+        <Comp
+            data-slot="breadcrumb-link"
+            className={cn('hover:text-foreground transition-colors', className)}
+            {...props}
+        />
+    );
+}
+
+function BreadcrumbPage({ className, ...props }: React.ComponentProps<'span'>) {
+    return (
+        <span
+            data-slot="breadcrumb-page"
+            role="link"
+            aria-disabled="true"
+            aria-current="page"
+            className={cn('text-foreground font-normal', className)}
+            {...props}
+        />
+    );
+}
+
+function BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<'li'>) {
+    return (
+        <li
+            data-slot="breadcrumb-separator"
+            role="presentation"
+            aria-hidden="true"
+            className={cn('[&>svg]:size-3.5', className)}
+            {...props}
+        >
+            {children ?? <ChevronRight />}
+        </li>
+    );
+}
+
+function BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<'span'>) {
+    return (
+        <span
+            data-slot="breadcrumb-ellipsis"
+            role="presentation"
+            aria-hidden="true"
+            className={cn('flex size-9 items-center justify-center', className)}
+            {...props}
+        >
+            <MoreHorizontal className="size-4" />
+            <span className="sr-only">More</span>
+        </span>
+    );
+}
+
+export {
+    Breadcrumb,
+    BreadcrumbList,
+    BreadcrumbItem,
+    BreadcrumbLink,
+    BreadcrumbPage,
+    BreadcrumbSeparator,
+    BreadcrumbEllipsis,
+};

package/src/lib/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.js';
-
-const buttonVariants = cva(
-    'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium 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',
-    {
-        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-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
-                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',
-            },
-            size: {
-                default: 'h-9 px-4 py-2',
-                sm: 'h-8 rounded-md px-3 text-xs',
-                lg: 'h-10 rounded-md px-8',
-                icon: 'h-9 w-9',
-                xs: 'h-5 rounded-md px-2 text-xs',
-                'icon-sm': 'h-7 w-7 text-xs',
-                'icon-xs': 'h-5 w-5 text-xs',
-            },
-        },
-        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.js';
+
+const buttonVariants = cva(
+    'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium 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',
+    {
+        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-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
+                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',
+            },
+            size: {
+                default: 'h-9 px-4 py-2',
+                sm: 'h-8 rounded-md px-3 text-xs',
+                lg: 'h-10 rounded-md px-8',
+                icon: 'h-9 w-9',
+                xs: 'h-5 rounded-md px-2 text-xs',
+                'icon-sm': 'h-7 w-7 text-xs',
+                'icon-xs': 'h-5 w-5 text-xs',
+            },
+        },
+        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/lib/components/ui/calendar.tsx

@@ -1,69 +1,69 @@
-import * as React from 'react';
-import { ChevronLeft, ChevronRight } from 'lucide-react';
-import { DayPicker } from 'react-day-picker';
-
-import { cn } from '@/lib/utils.js';
-import { buttonVariants } from '@/components/ui/button.js';
-
-function Calendar({
-    className,
-    classNames,
-    showOutsideDays = true,
-    ...props
-}: React.ComponentProps<typeof DayPicker>) {
-    return (
-        <DayPicker
-            showOutsideDays={showOutsideDays}
-            className={cn('p-3', className)}
-            classNames={{
-                months: 'flex flex-col sm:flex-row gap-2',
-                month: 'flex flex-col gap-4',
-                caption: 'flex justify-center pt-1 relative items-center w-full',
-                caption_label: 'text-sm font-medium',
-                nav: 'flex items-center gap-1',
-                nav_button: cn(
-                    buttonVariants({ variant: 'outline' }),
-                    'size-7 bg-transparent p-0 opacity-50 hover:opacity-100',
-                ),
-                nav_button_previous: 'absolute left-1',
-                nav_button_next: 'absolute right-1',
-                table: 'w-full border-collapse space-x-1',
-                head_row: 'flex',
-                head_cell: 'text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]',
-                row: 'flex w-full mt-2',
-                cell: cn(
-                    'relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].day-range-end)]:rounded-r-md',
-                    props.mode === 'range'
-                        ? '[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md'
-                        : '[&:has([aria-selected])]:rounded-md',
-                ),
-                day: cn(
-                    buttonVariants({ variant: 'ghost' }),
-                    'size-8 p-0 font-normal aria-selected:opacity-100',
-                ),
-                day_range_start:
-                    'day-range-start aria-selected:bg-primary aria-selected:text-primary-foreground',
-                day_range_end: 'day-range-end aria-selected:bg-primary aria-selected:text-primary-foreground',
-                day_selected:
-                    'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',
-                day_today: 'bg-accent text-accent-foreground',
-                day_outside: 'day-outside text-muted-foreground aria-selected:text-muted-foreground',
-                day_disabled: 'text-muted-foreground opacity-50',
-                day_range_middle: 'aria-selected:bg-accent aria-selected:text-accent-foreground',
-                day_hidden: 'invisible',
-                ...classNames,
-            }}
-            components={{
-                IconLeft: ({ className, ...props }) => (
-                    <ChevronLeft className={cn('size-4', className)} {...props} />
-                ),
-                IconRight: ({ className, ...props }) => (
-                    <ChevronRight className={cn('size-4', className)} {...props} />
-                ),
-            }}
-            {...props}
-        />
-    );
-}
-
-export { Calendar };
+import * as React from 'react';
+import { ChevronLeft, ChevronRight } from 'lucide-react';
+import { DayPicker } from 'react-day-picker';
+
+import { cn } from '@/lib/utils.js';
+import { buttonVariants } from '@/components/ui/button.js';
+
+function Calendar({
+    className,
+    classNames,
+    showOutsideDays = true,
+    ...props
+}: React.ComponentProps<typeof DayPicker>) {
+    return (
+        <DayPicker
+            showOutsideDays={showOutsideDays}
+            className={cn('p-3', className)}
+            classNames={{
+                months: 'flex flex-col sm:flex-row gap-2',
+                month: 'flex flex-col gap-4',
+                caption: 'flex justify-center pt-1 relative items-center w-full',
+                caption_label: 'text-sm font-medium',
+                nav: 'flex items-center gap-1',
+                nav_button: cn(
+                    buttonVariants({ variant: 'outline' }),
+                    'size-7 bg-transparent p-0 opacity-50 hover:opacity-100',
+                ),
+                nav_button_previous: 'absolute left-1',
+                nav_button_next: 'absolute right-1',
+                table: 'w-full border-collapse space-x-1',
+                head_row: 'flex',
+                head_cell: 'text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]',
+                row: 'flex w-full mt-2',
+                cell: cn(
+                    'relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].day-range-end)]:rounded-r-md',
+                    props.mode === 'range'
+                        ? '[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md'
+                        : '[&:has([aria-selected])]:rounded-md',
+                ),
+                day: cn(
+                    buttonVariants({ variant: 'ghost' }),
+                    'size-8 p-0 font-normal aria-selected:opacity-100',
+                ),
+                day_range_start:
+                    'day-range-start aria-selected:bg-primary aria-selected:text-primary-foreground',
+                day_range_end: 'day-range-end aria-selected:bg-primary aria-selected:text-primary-foreground',
+                day_selected:
+                    'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',
+                day_today: 'bg-accent text-accent-foreground',
+                day_outside: 'day-outside text-muted-foreground aria-selected:text-muted-foreground',
+                day_disabled: 'text-muted-foreground opacity-50',
+                day_range_middle: 'aria-selected:bg-accent aria-selected:text-accent-foreground',
+                day_hidden: 'invisible',
+                ...classNames,
+            }}
+            components={{
+                IconLeft: ({ className, ...props }) => (
+                    <ChevronLeft className={cn('size-4', className)} {...props} />
+                ),
+                IconRight: ({ className, ...props }) => (
+                    <ChevronRight className={cn('size-4', className)} {...props} />
+                ),
+            }}
+            {...props}
+        />
+    );
+}
+
+export { Calendar };

package/src/lib/components/ui/card.tsx

@@ -1,47 +1,47 @@
-import * as React from 'react';
-
-import { cn } from '@/lib/utils.js';
-
-function Card({ className, ...props }: React.ComponentProps<'div'>) {
-    return (
-        <div
-            data-slot="card"
-            className={cn('bg-card text-card-foreground rounded-xl border shadow-sm', className)}
-            {...props}
-        />
-    );
-}
-
-function CardHeader({ className, ...props }: React.ComponentProps<'div'>) {
-    return <div data-slot="card-header" className={cn('flex flex-col gap-1.5 p-6', className)} {...props} />;
-}
-
-function CardTitle({ className, ...props }: React.ComponentProps<'div'>) {
-    return (
-        <div
-            data-slot="card-title"
-            className={cn('leading-none font-semibold tracking-tight', className)}
-            {...props}
-        />
-    );
-}
-
-function CardDescription({ className, ...props }: React.ComponentProps<'div'>) {
-    return (
-        <div
-            data-slot="card-description"
-            className={cn('text-muted-foreground text-sm', className)}
-            {...props}
-        />
-    );
-}
-
-function CardContent({ className, ...props }: React.ComponentProps<'div'>) {
-    return <div data-slot="card-content" className={cn('p-6 pt-0', className)} {...props} />;
-}
-
-function CardFooter({ className, ...props }: React.ComponentProps<'div'>) {
-    return <div data-slot="card-footer" className={cn('flex items-center p-6 pt-0', className)} {...props} />;
-}
-
-export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };
+import * as React from 'react';
+
+import { cn } from '@/lib/utils.js';
+
+function Card({ className, ...props }: React.ComponentProps<'div'>) {
+    return (
+        <div
+            data-slot="card"
+            className={cn('bg-card text-card-foreground rounded-xl border shadow-sm', className)}
+            {...props}
+        />
+    );
+}
+
+function CardHeader({ className, ...props }: React.ComponentProps<'div'>) {
+    return <div data-slot="card-header" className={cn('flex flex-col gap-1.5 p-6', className)} {...props} />;
+}
+
+function CardTitle({ className, ...props }: React.ComponentProps<'div'>) {
+    return (
+        <div
+            data-slot="card-title"
+            className={cn('leading-none font-semibold tracking-tight', className)}
+            {...props}
+        />
+    );
+}
+
+function CardDescription({ className, ...props }: React.ComponentProps<'div'>) {
+    return (
+        <div
+            data-slot="card-description"
+            className={cn('text-muted-foreground text-sm', className)}
+            {...props}
+        />
+    );
+}
+
+function CardContent({ className, ...props }: React.ComponentProps<'div'>) {
+    return <div data-slot="card-content" className={cn('p-6 pt-0', className)} {...props} />;
+}
+
+function CardFooter({ className, ...props }: React.ComponentProps<'div'>) {
+    return <div data-slot="card-footer" className={cn('flex items-center p-6 pt-0', className)} {...props} />;
+}
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };

package/src/lib/components/ui/checkbox.tsx

@@ -1,27 +1,27 @@
-import * as React from 'react';
-import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import { CheckIcon } from 'lucide-react';
-
-import { cn } from '@/lib/utils.js';
-
-function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>) {
-    return (
-        <CheckboxPrimitive.Root
-            data-slot="checkbox"
-            className={cn(
-                'peer border-input data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50',
-                className,
-            )}
-            {...props}
-        >
-            <CheckboxPrimitive.Indicator
-                data-slot="checkbox-indicator"
-                className="flex items-center justify-center text-current transition-none"
-            >
-                <CheckIcon className="size-3.5" />
-            </CheckboxPrimitive.Indicator>
-        </CheckboxPrimitive.Root>
-    );
-}
-
-export { Checkbox };
+import * as React from 'react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { CheckIcon } from 'lucide-react';
+
+import { cn } from '@/lib/utils.js';
+
+function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>) {
+    return (
+        <CheckboxPrimitive.Root
+            data-slot="checkbox"
+            className={cn(
+                'peer border-input data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50',
+                className,
+            )}
+            {...props}
+        >
+            <CheckboxPrimitive.Indicator
+                data-slot="checkbox-indicator"
+                className="flex items-center justify-center text-current transition-none"
+            >
+                <CheckIcon className="size-3.5" />
+            </CheckboxPrimitive.Indicator>
+        </CheckboxPrimitive.Root>
+    );
+}
+
+export { Checkbox };