@vendure-platform/create 0.4.0 → 0.5.1

package/dist/assets/storefront/src/components/ui/toggle-group.tsx

@@ -1,73 +1,67 @@
-"use client"
+'use client';
 
-import * as React from "react"
-import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group"
-import { type VariantProps } from "class-variance-authority"
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 
-import { cn } from "@/lib/utils"
-import { toggleVariants } from "@/components/ui/toggle"
+import { toggleVariants } from '@/components/ui/toggle';
+import { cn } from '@/lib/utils';
 
-const ToggleGroupContext = React.createContext<
-  VariantProps<typeof toggleVariants>
->({
-  size: "default",
-  variant: "default",
-})
+const ToggleGroupContext = React.createContext<VariantProps<typeof toggleVariants>>({
+    size: 'default',
+    variant: 'default',
+});
 
 function ToggleGroup({
-  className,
-  variant,
-  size,
-  children,
-  ...props
-}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &
-  VariantProps<typeof toggleVariants>) {
-  return (
-    <ToggleGroupPrimitive.Root
-      data-slot="toggle-group"
-      data-variant={variant}
-      data-size={size}
-      className={cn(
-        "group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs",
-        className
-      )}
-      {...props}
-    >
-      <ToggleGroupContext.Provider value={{ variant, size }}>
-        {children}
-      </ToggleGroupContext.Provider>
-    </ToggleGroupPrimitive.Root>
-  )
+    className,
+    variant,
+    size,
+    children,
+    ...props
+}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>) {
+    return (
+        <ToggleGroupPrimitive.Root
+            data-slot="toggle-group"
+            data-variant={variant}
+            data-size={size}
+            className={cn(
+                'group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs',
+                className,
+            )}
+            {...props}
+        >
+            <ToggleGroupContext.Provider value={{ variant, size }}>{children}</ToggleGroupContext.Provider>
+        </ToggleGroupPrimitive.Root>
+    );
 }
 
 function ToggleGroupItem({
-  className,
-  children,
-  variant,
-  size,
-  ...props
-}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &
-  VariantProps<typeof toggleVariants>) {
-  const context = React.useContext(ToggleGroupContext)
+    className,
+    children,
+    variant,
+    size,
+    ...props
+}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>) {
+    const context = React.useContext(ToggleGroupContext);
 
-  return (
-    <ToggleGroupPrimitive.Item
-      data-slot="toggle-group-item"
-      data-variant={context.variant || variant}
-      data-size={context.size || size}
-      className={cn(
-        toggleVariants({
-          variant: context.variant || variant,
-          size: context.size || size,
-        }),
-        "min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l",
-        className
-      )}
-      {...props}
-    >
-      {children}
-    </ToggleGroupPrimitive.Item>
-  )
+    return (
+        <ToggleGroupPrimitive.Item
+            data-slot="toggle-group-item"
+            data-variant={context.variant || variant}
+            data-size={context.size || size}
+            className={cn(
+                toggleVariants({
+                    variant: context.variant || variant,
+                    size: context.size || size,
+                }),
+                'min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l',
+                className,
+            )}
+            {...props}
+        >
+            {children}
+        </ToggleGroupPrimitive.Item>
+    );
 }
 
-export { ToggleGroup, ToggleGroupItem }
+export { ToggleGroup, ToggleGroupItem };

package/dist/assets/storefront/src/components/ui/toggle.tsx

@@ -1,47 +1,46 @@
-"use client"
+'use client';
 
-import * as React from "react"
-import * as TogglePrimitive from "@radix-ui/react-toggle"
-import { cva, type VariantProps } from "class-variance-authority"
+import * as TogglePrimitive from '@radix-ui/react-toggle';
+import { cva, type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
 const toggleVariants = cva(
-  "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
-  {
-    variants: {
-      variant: {
-        default: "bg-transparent",
-        outline:
-          "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground",
-      },
-      size: {
-        default: "h-9 px-2 min-w-9",
-        sm: "h-8 px-1.5 min-w-8",
-        lg: "h-10 px-2.5 min-w-10",
-      },
+    "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
+    {
+        variants: {
+            variant: {
+                default: 'bg-transparent',
+                outline:
+                    'border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground',
+            },
+            size: {
+                default: 'h-9 px-2 min-w-9',
+                sm: 'h-8 px-1.5 min-w-8',
+                lg: 'h-10 px-2.5 min-w-10',
+            },
+        },
+        defaultVariants: {
+            variant: 'default',
+            size: 'default',
+        },
     },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  }
-)
+);
 
 function Toggle({
-  className,
-  variant,
-  size,
-  ...props
-}: React.ComponentProps<typeof TogglePrimitive.Root> &
-  VariantProps<typeof toggleVariants>) {
-  return (
-    <TogglePrimitive.Root
-      data-slot="toggle"
-      className={cn(toggleVariants({ variant, size, className }))}
-      {...props}
-    />
-  )
+    className,
+    variant,
+    size,
+    ...props
+}: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>) {
+    return (
+        <TogglePrimitive.Root
+            data-slot="toggle"
+            className={cn(toggleVariants({ variant, size, className }))}
+            {...props}
+        />
+    );
 }
 
-export { Toggle, toggleVariants }
+export { Toggle, toggleVariants };

package/dist/assets/storefront/src/components/ui/tooltip.tsx

@@ -1,61 +1,53 @@
-"use client"
+'use client';
 
-import * as React from "react"
-import * as TooltipPrimitive from "@radix-ui/react-tooltip"
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import * as React from 'react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
 function TooltipProvider({
-  delayDuration = 0,
-  ...props
+    delayDuration = 0,
+    ...props
 }: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
-  return (
-    <TooltipPrimitive.Provider
-      data-slot="tooltip-provider"
-      delayDuration={delayDuration}
-      {...props}
-    />
-  )
+    return (
+        <TooltipPrimitive.Provider data-slot="tooltip-provider" delayDuration={delayDuration} {...props} />
+    );
 }
 
-function Tooltip({
-  ...props
-}: React.ComponentProps<typeof TooltipPrimitive.Root>) {
-  return (
-    <TooltipProvider>
-      <TooltipPrimitive.Root data-slot="tooltip" {...props} />
-    </TooltipProvider>
-  )
+function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {
+    return (
+        <TooltipProvider>
+            <TooltipPrimitive.Root data-slot="tooltip" {...props} />
+        </TooltipProvider>
+    );
 }
 
-function TooltipTrigger({
-  ...props
-}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
-  return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
+function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
+    return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />;
 }
 
 function TooltipContent({
-  className,
-  sideOffset = 0,
-  children,
-  ...props
+    className,
+    sideOffset = 0,
+    children,
+    ...props
 }: React.ComponentProps<typeof TooltipPrimitive.Content>) {
-  return (
-    <TooltipPrimitive.Portal>
-      <TooltipPrimitive.Content
-        data-slot="tooltip-content"
-        sideOffset={sideOffset}
-        className={cn(
-          "bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
-          className
-        )}
-        {...props}
-      >
-        {children}
-        <TooltipPrimitive.Arrow className="bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
-      </TooltipPrimitive.Content>
-    </TooltipPrimitive.Portal>
-  )
+    return (
+        <TooltipPrimitive.Portal>
+            <TooltipPrimitive.Content
+                data-slot="tooltip-content"
+                sideOffset={sideOffset}
+                className={cn(
+                    'bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance',
+                    className,
+                )}
+                {...props}
+            >
+                {children}
+                <TooltipPrimitive.Arrow className="bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
+            </TooltipPrimitive.Content>
+        </TooltipPrimitive.Portal>
+    );
 }
 
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/dist/assets/storefront/src/config/scenario-meta.ts

@@ -1,5 +1,5 @@
-import type {Locale} from '@/i18n/locales';
-import {customerMeta} from '@/scenarios/customer/meta';
+import type { Locale } from '@/i18n/locales';
+import { customerMeta } from '@/scenarios/customer/meta';
 
 /**
  * Client-safe scenario metadata.

package/dist/assets/storefront/src/config/scenario.ts

@@ -1,12 +1,12 @@
-import type { ReactElement } from 'react';
-import type { ConfiguratorSystem, ProductDetail } from '@/lib/vendure/queries';
 import type { ShoppingListInfo } from '@/app/[locale]/account/shopping-lists/actions';
+import type { ProductImageCarouselProps } from '@/components/commerce/product-image-carousel';
 import type { ProductInfoProps } from '@/components/commerce/product-info';
 import type { ProductSidebarProps } from '@/components/commerce/product-sidebar';
-import type { ProductImageCarouselProps } from '@/components/commerce/product-image-carousel';
 import type { RelatedProductsProps } from '@/components/commerce/related-products';
 import type { ShopByCategoryProps } from '@/components/commerce/shop-by-category';
+import type { ConfiguratorSystem, ProductDetail } from '@/lib/vendure/queries';
 import { customerScenario } from '@/scenarios/customer';
+import type { ReactElement } from 'react';
 
 // =============================================================
 // Branding — pure serializable data (no React components)
@@ -197,16 +197,12 @@ export interface ScenarioConfig {
  * component returning a slot map), this guard breaks. Only add object-valued
  * variants to the override unions.
  */
-export function isFullPageOverride(
-    override: unknown,
-): override is (...args: unknown[]) => unknown {
+export function isFullPageOverride(override: unknown): override is (...args: unknown[]) => unknown {
     return typeof override === 'function';
 }
 
 /** Type guard: is the override a conditional `{ shouldApply, component }` form? */
-export function isConditionalPdpOverride(
-    override: unknown,
-): override is ConditionalPdpOverride {
+export function isConditionalPdpOverride(override: unknown): override is ConditionalPdpOverride {
     return (
         typeof override === 'object' &&
         override !== null &&
@@ -233,7 +229,7 @@ export function getScenarioConfig(): ScenarioConfig {
     if (!registry[scenario]) {
         console.warn(
             `[scenario] Unknown scenario "${scenario}" — falling back to "customer". ` +
-            `Did you register it in scenario.ts?`,
+                `Did you register it in scenario.ts?`,
         );
     }
     _cached = registry[scenario] ?? registry.customer;
@@ -250,12 +246,14 @@ export function getChannelsConfig(): ChannelsConfig | undefined {
 
 const _brandingStyleTag = (() => {
     const { colors, fonts } = getBranding();
-    const darkVars = Object.entries(colors.dark)
-        .map(([k, v]) => `${k}: ${v}`)
-        .join('; ') + ';';
-    const lightVars = Object.entries(colors.light)
-        .map(([k, v]) => `${k}: ${v}`)
-        .join('; ') + ';';
+    const darkVars =
+        Object.entries(colors.dark)
+            .map(([k, v]) => `${k}: ${v}`)
+            .join('; ') + ';';
+    const lightVars =
+        Object.entries(colors.light)
+            .map(([k, v]) => `${k}: ${v}`)
+            .join('; ') + ';';
 
     let base = `:root { ${darkVars} } .light { ${lightVars} }`;
 

package/dist/assets/storefront/src/contexts/auth-context.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import {createContext, ReactNode, useContext} from 'react';
-import {ResultOf} from '@/graphql';
-import {ActiveCustomerFragment} from '@/lib/vendure/fragments';
+import { ResultOf } from '@/graphql';
+import { ActiveCustomerFragment } from '@/lib/vendure/fragments';
+import { createContext, ReactNode, useContext } from 'react';
 
 type ActiveCustomer = ResultOf<typeof ActiveCustomerFragment>;
 
@@ -17,10 +17,9 @@ interface AuthProviderProps {
     initialActiveCustomerPromise: Promise<ActiveCustomer | null>;
 }
 
-export function AuthProvider({children, initialActiveCustomerPromise}: AuthProviderProps) {
-
+export function AuthProvider({ children, initialActiveCustomerPromise }: AuthProviderProps) {
     return (
-        <AuthContext.Provider value={{activeCustomer: initialActiveCustomerPromise}}>
+        <AuthContext.Provider value={{ activeCustomer: initialActiveCustomerPromise }}>
             {children}
         </AuthContext.Provider>
     );