@vendure/dashboard 3.5.0-minor-202510201346 → 3.5.0

package/src/lib/components/data-table/data-table-pagination.tsx

@@ -18,7 +18,7 @@ export function DataTablePagination<TData>({ table }: DataTablePaginationProps<T
             </div>
             <div className="flex items-center space-x-6 lg:space-x-8">
                 <div className="flex items-center space-x-2">
-                    <p className="hidden md:block text-sm font-medium">
+                    <p className="hidden @xl/table:block text-sm font-medium">
                         <Trans>Rows per page</Trans>
                     </p>
                     <Select
@@ -40,7 +40,7 @@ export function DataTablePagination<TData>({ table }: DataTablePaginationProps<T
                     </Select>
                 </div>
                 <div className=" flex items-center justify-center text-sm font-medium">
-                    <span className="hidden md:block w-[100px] ">
+                    <span className="hidden @sm/table:block w-[100px] ">
                         <Trans>
                             Page {table.getState().pagination.pageIndex + 1} of {table.getPageCount() || 1}
                         </Trans>
@@ -50,7 +50,7 @@ export function DataTablePagination<TData>({ table }: DataTablePaginationProps<T
                     <Button
                         variant="outline"
                         type="button"
-                        className="hidden h-8 w-8 p-0 lg:flex"
+                        className="hidden h-8 w-8 p-0 @lg:flex"
                         onClick={() => table.setPageIndex(0)}
                         disabled={!table.getCanPreviousPage()}
                     >
@@ -71,7 +71,7 @@ export function DataTablePagination<TData>({ table }: DataTablePaginationProps<T
                         </span>
                         <ChevronLeft />
                     </Button>
-                    <span className="md:hidden">{table.getState().pagination.pageIndex + 1}</span>
+                    <span className="@md/table:hidden">{table.getState().pagination.pageIndex + 1}</span>
                     <Button
                         variant="outline"
                         type="button"

package/src/lib/components/data-table/data-table.stories.tsx

@@ -30,7 +30,7 @@ const sampleData: Product[] = Array.from({ length: 100 }, (_, i) => ({
 }));
 
 const meta = {
-    title: 'Components/DataTable',
+    title: 'Framework/DataTable',
     component: DataTable,
     ...withDescription(import.meta.url, './data-table.js'),
     parameters: {

package/src/lib/components/data-table/data-table.tsx

@@ -236,7 +236,7 @@ export function DataTable<TData>({
             isLoading={isLoading}
             table={table}
         >
-            <div className="space-y-2">
+            <div className="space-y-2 @container/table">
                 <div className="flex items-center justify-between gap-2">
                     <div className="flex items-center gap-2">
                         {onSearchTermChange && (

package/src/lib/components/data-table/use-generated-columns.tsx

@@ -252,7 +252,11 @@ function getRowActions(
                             </DropdownMenuItem>
                         ))}
                         {bulkActions?.map((action, index) => (
-                            <action.component key={`bulk-action-${index}`} selection={[row]} table={table} />
+                            <action.component
+                                key={`bulk-action-${index}`}
+                                selection={[row.original]}
+                                table={table}
+                            />
                         ))}
                         {deleteMutation && (
                             <DeleteMutationRowAction deleteMutation={deleteMutation} row={row} />

package/src/lib/components/layout/app-layout.tsx

@@ -1,7 +1,6 @@
 import { AppSidebar } from '@/vdb/components/layout/app-sidebar.js';
 import { DevModeIndicator } from '@/vdb/components/layout/dev-mode-indicator.js';
 import { GeneratedBreadcrumbs } from '@/vdb/components/layout/generated-breadcrumbs.js';
-import { PrereleasePopup } from '@/vdb/components/layout/prerelease-popup.js';
 import { Separator } from '@/vdb/components/ui/separator.js';
 import { SidebarInset, SidebarProvider, SidebarTrigger } from '@/vdb/components/ui/sidebar.js';
 import { useUserSettings } from '@/vdb/hooks/use-user-settings.js';
@@ -31,7 +30,6 @@ export function AppLayout() {
                     <Outlet />
                 </div>
             </SidebarInset>
-            <PrereleasePopup />
         </SidebarProvider>
     );
 }

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

@@ -6,7 +6,7 @@ import { createDemoRoute } from '../../../../../.storybook/providers.js';
 import { withDescription } from '../../../../../.storybook/with-description.js';
 
 const meta = {
-    title: 'Components/AssetGallery',
+    title: 'Framework/AssetGallery',
     component: AssetGallery,
     ...withDescription(import.meta.url, './asset-gallery.js'),
     parameters: {

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

@@ -7,7 +7,7 @@ import { withDescription } from '../../../../../.storybook/with-description.js';
 import { AssetPickerDialog } from './asset-picker-dialog.js';
 
 const meta = {
-    title: 'Components/AssetPickerDialog',
+    title: 'Framework/AssetPickerDialog',
     component: AssetPickerDialog,
     ...withDescription(import.meta.url, './asset-picker-dialog.js'),
     parameters: {

package/src/lib/components/shared/detail-page-button.stories.tsx

@@ -5,7 +5,7 @@ import { withDescription } from '../../../../.storybook/with-description.js';
 import { DetailPageButton } from './detail-page-button.js';
 
 const meta = {
-    title: 'Components/DetailPageButton',
+    title: 'Framework/DetailPageButton',
     component: DetailPageButton,
     ...withDescription(import.meta.url, './detail-page-button.js'),
     parameters: {

package/src/lib/components/shared/facet-value-selector.stories.tsx

@@ -3,7 +3,7 @@ import { withDescription } from '../../../../.storybook/with-description.js';
 import { FacetValueSelector } from './facet-value-selector.js';
 
 const meta = {
-    title: 'Components/FacetValueSelector',
+    title: 'Framework/FacetValueSelector',
     component: FacetValueSelector,
     ...withDescription(import.meta.url, './facet-value-selector.js'),
     parameters: {

package/src/lib/components/shared/paginated-list-data-table.stories.tsx

@@ -39,7 +39,7 @@ const productsListDocument = graphql(`
 `);
 
 const meta = {
-    title: 'Components/PaginatedListDataTable',
+    title: 'Framework/PaginatedListDataTable',
     component: PaginatedListDataTable,
     ...withDescription(import.meta.url, './paginated-list-data-table.js'),
     parameters: {

package/src/lib/components/shared/permission-guard.stories.tsx

@@ -4,7 +4,7 @@ import { withDescription } from '../../../../.storybook/with-description.js';
 import { PermissionGuard } from './permission-guard.js';
 
 const meta = {
-    title: 'Components/PermissionGuard',
+    title: 'Framework/PermissionGuard',
     component: PermissionGuard,
     ...withDescription(import.meta.url, './permission-guard.js'),
     parameters: {

package/src/lib/components/shared/vendure-image.stories.tsx

@@ -18,7 +18,7 @@ const mockAssetWithFocalPoint: AssetLike = {
 };
 
 const meta = {
-    title: 'Components/VendureImage',
+    title: 'Framework/VendureImage',
     component: VendureImage,
     ...withDescription(import.meta.url, './vendure-image.js'),
     parameters: {

package/src/lib/index.ts

@@ -72,7 +72,6 @@ export * from './components/layout/nav-item-wrapper.js';
 export * from './components/layout/nav-main.js';
 export * from './components/layout/nav-projects.js';
 export * from './components/layout/nav-user.js';
-export * from './components/layout/prerelease-popup.js';
 export * from './components/login/login-form.js';
 export * from './components/shared/alerts.js';
 export * from './components/shared/animated-number.js';

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

@@ -1,34 +0,0 @@
-import { useUserSettings } from '@/vdb/hooks/use-user-settings.js';
-import { useState } from 'react';
-import { toast } from 'sonner';
-
-export function PrereleasePopup() {
-    const { settings, setHasSeenOnboarding } = useUserSettings();
-    const [isOpen, setIsOpen] = useState(false);
-    if (!settings.hasSeenOnboarding && !isOpen) {
-        setIsOpen(true);
-        toast('Welcome to the new Dashboard!', {
-            description: (
-                <div className="space-y-2">
-                    <p>
-                        This is a <span className="font-bold">beta</span> version of our new Vendure
-                        Dashboard!
-                    </p>
-                    <p>
-                        This release allows you to explore the new interface and functionality, but it's not
-                        yet ready for production use.
-                    </p>
-                </div>
-            ),
-            duration: 1000 * 60,
-            action: {
-                label: 'Got it',
-                onClick: () => {
-                    setHasSeenOnboarding(true);
-                    setIsOpen(false);
-                },
-            },
-        });
-    }
-    return null;
-}