@vendure/dashboard 3.3.6-master-202507020234 → 3.3.6-master-202507021511

package/src/lib/components/layout/nav-user.tsx

@@ -1,8 +1,8 @@
-import { useAuth } from '@/hooks/use-auth.js';
+import { useAuth } from '@/vdb/hooks/use-auth.js';
 import { Link, useNavigate, useRouter } from '@tanstack/react-router';
 import { ChevronsUpDown, LogOut, Monitor, Moon, Sparkles, Sun } from 'lucide-react';
 
-// import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar.js';
+// import { Avatar, AvatarFallback, AvatarImage } from '@/vdb/components/ui/avatar.js';
 import {
     DropdownMenu,
     DropdownMenuContent,
@@ -17,11 +17,11 @@ import {
     DropdownMenuSubContent,
     DropdownMenuSubTrigger,
     DropdownMenuTrigger,
-} from '@/components/ui/dropdown-menu.js';
-import { SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar } from '@/components/ui/sidebar.js';
-import { useUserSettings } from '@/hooks/use-user-settings.js';
-import { Trans } from '@/lib/trans.js';
-import { Theme } from '@/providers/theme-provider.js';
+} from '@/vdb/components/ui/dropdown-menu.js';
+import { SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar } from '@/vdb/components/ui/sidebar.js';
+import { useUserSettings } from '@/vdb/hooks/use-user-settings.js';
+import { Trans } from '@/vdb/lib/trans.js';
+import { Theme } from '@/vdb/providers/theme-provider.js';
 import { useMemo } from 'react';
 import { Dialog, DialogTrigger } from '../ui/dialog.js';
 import { LanguageDialog } from './language-dialog.js';

package/src/lib/components/layout/prerelease-popup.tsx

@@ -1,4 +1,4 @@
-import { useUserSettings } from '@/hooks/use-user-settings.js';
+import { useUserSettings } from '@/vdb/hooks/use-user-settings.js';
 import { useState } from 'react';
 import { toast } from 'sonner';
 

package/src/lib/components/login/login-form.tsx

@@ -1,8 +1,8 @@
-import { Button } from '@/components/ui/button.js';
-import { Card, CardContent } from '@/components/ui/card.js';
-import { Input } from '@/components/ui/input.js';
-import { Trans } from '@/lib/trans.js';
-import { cn } from '@/lib/utils.js';
+import { Button } from '@/vdb/components/ui/button.js';
+import { Card, CardContent } from '@/vdb/components/ui/card.js';
+import { Input } from '@/vdb/components/ui/input.js';
+import { Trans } from '@/vdb/lib/trans.js';
+import { cn } from '@/vdb/lib/utils.js';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { Loader2 } from 'lucide-react';
 import * as React from 'react';

package/src/lib/components/shared/alerts.tsx

@@ -1,10 +1,10 @@
+import { useAlerts } from '@/vdb/framework/alert/alert-extensions.js';
+import { AlertItem } from '@/vdb/framework/alert/alert-item.js';
+import { AlertsIndicator } from '@/vdb/framework/alert/alerts-indicator.js';
 import { BellIcon } from 'lucide-react';
 import { Button } from '../ui/button.js';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from '../ui/dialog.js';
-import { useAlerts } from '../../framework/alert/alert-extensions.js';
-import { AlertItem } from '../../framework/alert/alert-item.js';
 import { ScrollArea } from '../ui/scroll-area.js';
-import { AlertsIndicator } from '../../framework/alert/alerts-indicator.js';
 
 export function Alerts() {
     const { alerts } = useAlerts();

package/src/lib/components/shared/animated-number.tsx

@@ -1,5 +1,5 @@
-import { useChannel } from '@/index.js';
-import { useLocalFormat } from '@/index.js';
+import { useChannel } from '@/vdb/hooks/use-channel.js';
+import { useLocalFormat } from '@/vdb/hooks/use-local-format.js';
 import { motion, useSpring, useTransform } from 'motion/react';
 import { useEffect } from 'react';
 

package/src/lib/components/shared/asset/asset-bulk-actions.tsx

@@ -1,16 +1,16 @@
 'use client';
 
-import { Button } from '@/components/ui/button.js';
+import { Button } from '@/vdb/components/ui/button.js';
 import {
     DropdownMenu,
     DropdownMenuContent,
     DropdownMenuItem,
     DropdownMenuTrigger,
-} from '@/components/ui/dropdown-menu.js';
-import { getBulkActions } from '@/framework/data-table/data-table-extensions.js';
-import { usePageBlock } from '@/hooks/use-page-block.js';
-import { usePage } from '@/hooks/use-page.js';
-import { Trans } from '@/lib/trans.js';
+} from '@/vdb/components/ui/dropdown-menu.js';
+import { getBulkActions } from '@/vdb/framework/data-table/data-table-extensions.js';
+import { usePageBlock } from '@/vdb/hooks/use-page-block.js';
+import { usePage } from '@/vdb/hooks/use-page.js';
+import { Trans } from '@/vdb/lib/trans.js';
 import { ChevronDown } from 'lucide-react';
 import { Asset } from './asset-gallery.js';
 
@@ -76,7 +76,11 @@ export function AssetBulkActions({ selection, bulkActions, refetch }: AssetBulkA
                 <DropdownMenuContent align="start">
                     {allBulkActions.length > 0 ? (
                         allBulkActions.map((action, index) => (
-                            <action.component key={`asset-bulk-action-${index}`} selection={selection} refetch={refetch} />
+                            <action.component
+                                key={`asset-bulk-action-${index}`}
+                                selection={selection}
+                                refetch={refetch}
+                            />
                         ))
                     ) : (
                         <DropdownMenuItem className="text-muted-foreground" disabled>

package/src/lib/components/shared/asset/asset-focal-point-editor.tsx

@@ -1,11 +1,11 @@
-import { Button } from "@/components/ui/button.js";
-import { cn } from "@/lib/utils.js";
-import { Crosshair, X } from "lucide-react";
-import { useRef, useState } from "react";
-import { DndContext, useDraggable } from "@dnd-kit/core";
-import { restrictToParentElement } from "@dnd-kit/modifiers";
-import { CSS } from "@dnd-kit/utilities";
-import { Trans } from "@/lib/trans.js";
+import { Button } from '@/vdb/components/ui/button.js';
+import { Trans } from '@/vdb/lib/trans.js';
+import { cn } from '@/vdb/lib/utils.js';
+import { DndContext, useDraggable } from '@dnd-kit/core';
+import { restrictToParentElement } from '@dnd-kit/modifiers';
+import { CSS } from '@dnd-kit/utilities';
+import { Crosshair, X } from 'lucide-react';
+import { useState } from 'react';
 
 export interface AssetFocalPointEditorProps {
     settingFocalPoint: boolean;
@@ -24,12 +24,14 @@ interface Point {
 
 function DraggableFocalPoint({ point }: { point: Point }) {
     const { attributes, listeners, setNodeRef, transform, isDragging } = useDraggable({
-        id: "focal-point",
+        id: 'focal-point',
     });
     const style = {
         left: `${point.x * 100}%`,
         top: `${point.y * 100}%`,
-        transform: isDragging ? `translate(-50%, -50%) ${CSS.Translate.toString(transform)}` : `translate(-50%, -50%)`,
+        transform: isDragging
+            ? `translate(-50%, -50%) ${CSS.Translate.toString(transform)}`
+            : `translate(-50%, -50%)`,
     };
 
     return (
@@ -43,8 +45,15 @@ function DraggableFocalPoint({ point }: { point: Point }) {
     );
 }
 
-export function AssetFocalPointEditor({ settingFocalPoint, focalPoint, width, height, onFocalPointChange, onCancel, children }: AssetFocalPointEditorProps) {
-
+export function AssetFocalPointEditor({
+    settingFocalPoint,
+    focalPoint,
+    width,
+    height,
+    onFocalPointChange,
+    onCancel,
+    children,
+}: AssetFocalPointEditorProps) {
     const [focalPointCurrent, setFocalPointCurrent] = useState<Point>(focalPoint ?? { x: 0.5, y: 0.5 });
 
     const handleDragEnd = (event: any) => {
@@ -67,9 +76,7 @@ export function AssetFocalPointEditor({ settingFocalPoint, focalPoint, width, he
                 {children}
                 {settingFocalPoint && (
                     <DndContext onDragEnd={handleDragEnd} modifiers={[restrictToParentElement]}>
-                        <DraggableFocalPoint
-                            point={focalPointCurrent}
-                        />
+                        <DraggableFocalPoint point={focalPointCurrent} />
                     </DndContext>
                 )}
             </div>
@@ -80,9 +87,12 @@ export function AssetFocalPointEditor({ settingFocalPoint, focalPoint, width, he
                         <X className="mr-2 h-4 w-4" />
                         <Trans>Cancel</Trans>
                     </Button>
-                    <Button type="button" onClick={() => {
-                        onFocalPointChange(focalPointCurrent);
-                    }}>
+                    <Button
+                        type="button"
+                        onClick={() => {
+                            onFocalPointChange(focalPointCurrent);
+                        }}
+                    >
                         <Crosshair className="mr-2 h-4 w-4" />
                         <Trans>Set Focal Point</Trans>
                     </Button>
@@ -90,4 +100,4 @@ export function AssetFocalPointEditor({ settingFocalPoint, focalPoint, width, he
             )}
         </div>
     );
-}
+}

package/src/lib/components/shared/asset/asset-gallery.tsx

@@ -1,8 +1,8 @@
-import { VendureImage } from '@/components/shared/vendure-image.js';
-import { Button } from '@/components/ui/button.js';
-import { Card, CardContent } from '@/components/ui/card.js';
-import { Checkbox } from '@/components/ui/checkbox.js';
-import { Input } from '@/components/ui/input.js';
+import { VendureImage } from '@/vdb/components/shared/vendure-image.js';
+import { Button } from '@/vdb/components/ui/button.js';
+import { Card, CardContent } from '@/vdb/components/ui/card.js';
+import { Checkbox } from '@/vdb/components/ui/checkbox.js';
+import { Input } from '@/vdb/components/ui/input.js';
 import {
     Pagination,
     PaginationContent,
@@ -11,13 +11,13 @@ import {
     PaginationLink,
     PaginationNext,
     PaginationPrevious,
-} from '@/components/ui/pagination.js';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select.js';
-import { api } from '@/graphql/api.js';
-import { assetFragment, AssetFragment } from '@/graphql/fragments.js';
-import { graphql } from '@/graphql/graphql.js';
-import { Trans } from '@/lib/trans.js';
-import { formatFileSize } from '@/lib/utils.js';
+} from '@/vdb/components/ui/pagination.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/vdb/components/ui/select.js';
+import { api } from '@/vdb/graphql/api.js';
+import { assetFragment, AssetFragment } from '@/vdb/graphql/fragments.js';
+import { graphql } from '@/vdb/graphql/graphql.js';
+import { Trans } from '@/vdb/lib/trans.js';
+import { formatFileSize } from '@/vdb/lib/utils.js';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { useDebounce } from '@uidotdev/usehooks';
 import { Loader2, Search, Upload, X } from 'lucide-react';

package/src/lib/components/shared/asset/asset-picker-dialog.tsx

@@ -1,72 +1,69 @@
-import React, { useState } from 'react';
-import { AssetGallery, Asset } from './asset-gallery.js';
-import { 
-  Dialog, 
-  DialogContent, 
-  DialogHeader, 
-  DialogTitle, 
-  DialogFooter 
-} from '@/components/ui/dialog.js';
-import { Button } from '@/components/ui/button.js';
+import { Button } from '@/vdb/components/ui/button.js';
+import {
+    Dialog,
+    DialogContent,
+    DialogFooter,
+    DialogHeader,
+    DialogTitle,
+} from '@/vdb/components/ui/dialog.js';
+import { useState } from 'react';
+import { Asset, AssetGallery } from './asset-gallery.js';
 
 interface AssetPickerDialogProps {
-  open: boolean;
-  onClose: () => void;
-  onSelect: (assets: Asset[]) => void;
-  multiSelect?: boolean;
-  initialSelectedAssets?: Asset[];
-  title?: string;
+    open: boolean;
+    onClose: () => void;
+    onSelect: (assets: Asset[]) => void;
+    multiSelect?: boolean;
+    initialSelectedAssets?: Asset[];
+    title?: string;
 }
 
 export function AssetPickerDialog({
-  open,
-  onClose,
-  onSelect,
-  multiSelect = false,
-  initialSelectedAssets = [],
-  title = "Select Assets",
+    open,
+    onClose,
+    onSelect,
+    multiSelect = false,
+    initialSelectedAssets = [],
+    title = 'Select Assets',
 }: AssetPickerDialogProps) {
-  const [selectedAssets, setSelectedAssets] = useState<Asset[]>(initialSelectedAssets);
-  
-  const handleAssetSelect = (assets: Asset[]) => {
-    setSelectedAssets(assets);
-  };
-  
-  const handleConfirm = () => {
-    onSelect(selectedAssets);
-    onClose();
-  };
-  
-  return (
-    <Dialog open={open} onOpenChange={onClose}>
-      <DialogContent className="sm:max-w-[800px] lg:max-w-[1000px] max-h-[80vh] flex flex-col">
-        <DialogHeader>
-          <DialogTitle>{multiSelect ? title : title.replace('Assets', 'Asset')}</DialogTitle>
-        </DialogHeader>
-        
-        <div className="flex-grow py-4">
-          <AssetGallery 
-            onSelect={handleAssetSelect}
-            multiSelect='manual'
-            initialSelectedAssets={initialSelectedAssets}
-            fixedHeight={true}
-          />
-        </div>
-        
-        <DialogFooter>
-          <Button variant="outline" onClick={onClose}>
-            Cancel
-          </Button>
-          <Button 
-            onClick={handleConfirm} 
-            disabled={selectedAssets.length === 0}
-          >
-            {selectedAssets.length > 0 && multiSelect 
-              ? `Select ${selectedAssets.length} Asset${selectedAssets.length > 1 ? 's' : ''}`
-              : 'Select Asset'}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}
+    const [selectedAssets, setSelectedAssets] = useState<Asset[]>(initialSelectedAssets);
+
+    const handleAssetSelect = (assets: Asset[]) => {
+        setSelectedAssets(assets);
+    };
+
+    const handleConfirm = () => {
+        onSelect(selectedAssets);
+        onClose();
+    };
+
+    return (
+        <Dialog open={open} onOpenChange={onClose}>
+            <DialogContent className="sm:max-w-[800px] lg:max-w-[1000px] max-h-[80vh] flex flex-col">
+                <DialogHeader>
+                    <DialogTitle>{multiSelect ? title : title.replace('Assets', 'Asset')}</DialogTitle>
+                </DialogHeader>
+
+                <div className="flex-grow py-4">
+                    <AssetGallery
+                        onSelect={handleAssetSelect}
+                        multiSelect="manual"
+                        initialSelectedAssets={initialSelectedAssets}
+                        fixedHeight={true}
+                    />
+                </div>
+
+                <DialogFooter>
+                    <Button variant="outline" onClick={onClose}>
+                        Cancel
+                    </Button>
+                    <Button onClick={handleConfirm} disabled={selectedAssets.length === 0}>
+                        {selectedAssets.length > 0 && multiSelect
+                            ? `Select ${selectedAssets.length} Asset${selectedAssets.length > 1 ? 's' : ''}`
+                            : 'Select Asset'}
+                    </Button>
+                </DialogFooter>
+            </DialogContent>
+        </Dialog>
+    );
+}

package/src/lib/components/shared/asset/asset-preview-dialog.tsx

@@ -4,8 +4,8 @@ import {
     DialogDescription,
     DialogHeader,
     DialogTitle,
-} from '@/components/ui/dialog.js';
-import { AssetWithTags, AssetPreview } from './asset-preview.js';
+} from '@/vdb/components/ui/dialog.js';
+import { AssetPreview, AssetWithTags } from './asset-preview.js';
 
 interface AssetPreviewDialogProps {
     open: boolean;
@@ -30,11 +30,7 @@ export function AssetPreviewDialog({
                     <DialogDescription>Preview of {asset.name}</DialogDescription>
                 </DialogHeader>
                 <div className="h-full p-6">
-                    <AssetPreview
-                        asset={asset}
-                        assets={assets}
-                        customFields={customFields}
-                    />
+                    <AssetPreview asset={asset} assets={assets} customFields={customFields} />
                 </div>
             </DialogContent>
         </Dialog>

package/src/lib/components/shared/asset/asset-preview-selector.tsx

@@ -1,7 +1,5 @@
-
-
-import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from "@/components/ui/select.js";
-import { PreviewPreset } from "./asset-preview.js";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/vdb/components/ui/select.js';
+import { PreviewPreset } from './asset-preview.js';
 
 export interface AssetPreviewSelectorProps {
     size: PreviewPreset;
@@ -31,4 +29,4 @@ export function AssetPreviewSelector({ size, setSize, width, height }: AssetPrev
             </p>
         </div>
     );
-}
+}

package/src/lib/components/shared/asset/asset-preview.tsx

@@ -1,8 +1,8 @@
-import { VendureImage } from '@/components/shared/vendure-image.js';
-import { Button } from '@/components/ui/button.js';
-import { Card, CardContent } from '@/components/ui/card.js';
-import { AssetFragment } from '@/graphql/fragments.js';
-import { cn } from '@/lib/utils.js';
+import { VendureImage } from '@/vdb/components/shared/vendure-image.js';
+import { Button } from '@/vdb/components/ui/button.js';
+import { Card, CardContent } from '@/vdb/components/ui/card.js';
+import { AssetFragment } from '@/vdb/graphql/fragments.js';
+import { cn } from '@/vdb/lib/utils.js';
 import { ChevronLeft, ChevronRight } from 'lucide-react';
 import { useEffect, useRef, useState } from 'react';
 import { useForm } from 'react-hook-form';
@@ -11,7 +11,6 @@ import { AssetProperties } from './asset-properties.js';
 
 export type PreviewPreset = 'tiny' | 'thumb' | 'small' | 'medium' | 'large' | '';
 
-
 export type AssetWithTags = AssetFragment & { tags?: { value: string }[] };
 
 interface AssetPreviewProps {
@@ -20,11 +19,7 @@ interface AssetPreviewProps {
     customFields?: any[];
 }
 
-export function AssetPreview({
-    asset,
-    assets,
-    customFields = [],
-}: AssetPreviewProps) {
+export function AssetPreview({ asset, assets, customFields = [] }: AssetPreviewProps) {
     const [size, setSize] = useState<PreviewPreset>('medium');
     const [width, setWidth] = useState(0);
     const [height, setHeight] = useState(0);
@@ -108,10 +103,7 @@ export function AssetPreview({
                 )}
                 <div
                     ref={containerRef}
-                    className={cn(
-                        'relative',
-                        centered && 'flex items-center justify-center',
-                    )}
+                    className={cn('relative', centered && 'flex items-center justify-center')}
                 >
                     <VendureImage
                         ref={imageRef}

package/src/lib/components/shared/asset/asset-properties.tsx

@@ -1,8 +1,8 @@
-import { formatFileSize } from "@/lib/utils.js";
+import { formatFileSize } from '@/vdb/lib/utils.js';
 
-import { Label } from "@/components/ui/label.js";
-import { AssetFragment } from "@/graphql/fragments.js";
-import { ExternalLink } from "lucide-react";
+import { Label } from '@/vdb/components/ui/label.js';
+import { AssetFragment } from '@/vdb/graphql/fragments.js';
+import { ExternalLink } from 'lucide-react';
 
 export interface AssetPropertiesProps {
     asset: AssetFragment;
@@ -30,9 +30,7 @@ export function AssetProperties({ asset }: AssetPropertiesProps) {
 
             <div>
                 <Label>File Size</Label>
-                <p className="text-sm text-muted-foreground">
-                    {formatFileSize(asset.fileSize)}
-                </p>
+                <p className="text-sm text-muted-foreground">{formatFileSize(asset.fileSize)}</p>
             </div>
 
             <div>
@@ -43,4 +41,4 @@ export function AssetProperties({ asset }: AssetPropertiesProps) {
             </div>
         </div>
     );
-}
+}

package/src/lib/components/shared/asset/focal-point-control.tsx

@@ -1,5 +1,5 @@
+import { cn } from '@/vdb/lib/utils.js';
 import { useEffect, useState } from 'react';
-import { cn } from '@/lib/utils.js';
 
 export interface Point {
     x: number;
@@ -13,12 +13,7 @@ interface FocalPointControlProps {
     onChange: (point: Point) => void;
 }
 
-export function FocalPointControl({
-    width,
-    height,
-    point,
-    onChange,
-}: FocalPointControlProps) {
+export function FocalPointControl({ width, height, point, onChange }: FocalPointControlProps) {
     const [dragging, setDragging] = useState(false);
 
     useEffect(() => {
@@ -45,15 +40,12 @@ export function FocalPointControl({
     }, [dragging, onChange]);
 
     return (
-        <div
-            className="absolute inset-0 cursor-crosshair"
-            onMouseDown={() => setDragging(true)}
-        >
+        <div className="absolute inset-0 cursor-crosshair" onMouseDown={() => setDragging(true)}>
             <div
                 className={cn(
                     'absolute w-6 h-6 border-2 border-white rounded-full -translate-x-1/2 -translate-y-1/2',
                     'shadow-[0_0_0_1px_rgba(0,0,0,0.3)]',
-                    dragging && 'scale-75'
+                    dragging && 'scale-75',
                 )}
                 style={{
                     left: `${point.x * width}px`,
@@ -62,4 +54,4 @@ export function FocalPointControl({
             />
         </div>
     );
-}
+}

package/src/lib/components/shared/assign-to-channel-bulk-action.tsx

@@ -1,10 +1,10 @@
 import { LayersIcon } from 'lucide-react';
 import { useState } from 'react';
 
-import { DataTableBulkActionItem } from '@/components/data-table/data-table-bulk-action-item.js';
-import { AssignToChannelDialog } from '@/components/shared/assign-to-channel-dialog.js';
-import { useChannel, usePaginatedList } from '@/index.js';
-import { Trans } from '@/lib/trans.js';
+import { DataTableBulkActionItem } from '@/vdb/components/data-table/data-table-bulk-action-item.js';
+import { AssignToChannelDialog } from '@/vdb/components/shared/assign-to-channel-dialog.js';
+import { useChannel, usePaginatedList } from '@/vdb/index.js';
+import { Trans } from '@/vdb/lib/trans.js';
 
 interface AssignToChannelBulkActionProps {
     selection: any[];

package/src/lib/components/shared/assign-to-channel-dialog.tsx

@@ -2,8 +2,8 @@ import { useMutation } from '@tanstack/react-query';
 import { ReactNode, useState } from 'react';
 import { toast } from 'sonner';
 
-import { ChannelCodeLabel } from '@/components/shared/channel-code-label.js';
-import { Button } from '@/components/ui/button.js';
+import { ChannelCodeLabel } from '@/vdb/components/shared/channel-code-label.js';
+import { Button } from '@/vdb/components/ui/button.js';
 import {
     Dialog,
     DialogContent,
@@ -11,13 +11,13 @@ import {
     DialogFooter,
     DialogHeader,
     DialogTitle,
-} from '@/components/ui/dialog.js';
-import { Input } from '@/components/ui/input.js';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select.js';
-import { ResultOf } from '@/graphql/graphql.js';
-import { Trans, useLingui } from '@/lib/trans.js';
+} from '@/vdb/components/ui/dialog.js';
+import { Input } from '@/vdb/components/ui/input.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/vdb/components/ui/select.js';
+import { ResultOf } from '@/vdb/graphql/graphql.js';
+import { Trans, useLingui } from '@/vdb/lib/trans.js';
 
-import { useChannel } from '@/hooks/use-channel.js';
+import { useChannel } from '@/vdb/hooks/use-channel.js';
 
 interface AssignToChannelDialogProps {
     open: boolean;

package/src/lib/components/shared/channel-code-label.tsx

@@ -1,7 +1,6 @@
-import { DEFAULT_CHANNEL_CODE } from '@/constants.js';
-import { Trans } from '@/lib/trans.js';
+import { DEFAULT_CHANNEL_CODE } from '@/vdb/constants.js';
+import { Trans } from '@/vdb/lib/trans.js';
 
 export function ChannelCodeLabel({ code }: { code: string } | { code: undefined }) {
     return code === DEFAULT_CHANNEL_CODE ? <Trans>Default channel</Trans> : code;
 }
-

package/src/lib/components/shared/channel-selector.tsx

@@ -1,9 +1,9 @@
-import { api } from '@/graphql/api.js';
-import { graphql } from '@/graphql/graphql.js';
-import { useLingui } from '@/lib/trans.js';
+import { api } from '@/vdb/graphql/api.js';
+import { graphql } from '@/vdb/graphql/graphql.js';
+import { useLingui } from '@/vdb/lib/trans.js';
 import { useQuery } from '@tanstack/react-query';
-import { MultiSelect } from './multi-select.js';
 import { ChannelCodeLabel } from './channel-code-label.js';
+import { MultiSelect } from './multi-select.js';
 
 const channelsDocument = graphql(`
     query channels($options: ChannelListOptions) {
@@ -16,7 +16,7 @@ const channelsDocument = graphql(`
     }
 `);
 
-export interface ChannelSelectorProps<T extends boolean> {    
+export interface ChannelSelectorProps<T extends boolean> {
     value: T extends true ? string[] : string;
     onChange: (value: T extends true ? string[] : string) => void;
     multiple?: T;
@@ -35,7 +35,7 @@ export function ChannelSelector<T extends boolean>(props: ChannelSelectorProps<T
     const items = (channelsData?.channels.items ?? []).map(channel => ({
         value: channel.id,
         label: channel.code,
-        display: <ChannelCodeLabel code={channel.code} />
+        display: <ChannelCodeLabel code={channel.code} />,
     }));
 
     return (

package/src/lib/components/shared/configurable-operation-arg-input.tsx

@@ -1,5 +1,5 @@
-import { InputComponent } from '@/framework/component-registry/dynamic-component.js';
-import { ConfigurableOperationDefFragment } from '@/graphql/fragments.js';
+import { InputComponent } from '@/vdb/framework/component-registry/dynamic-component.js';
+import { ConfigurableOperationDefFragment } from '@/vdb/graphql/fragments.js';
 import { ConfigArgType } from '@vendure/core';
 import { FacetValueInput } from '../data-input/facet-value-input.js';