Storybook (#328)

* feat(docs): add interactive examples and API references for Button, Card, and LoadingFallback components
- Updated dependencies
- Set `retries` to a fixed value of 3 for consistent test retries across environments.
- Increased `timeout` from 60 seconds to 120 seconds to allow more time for tests to complete.
- Reduced `expect` timeout from 10 seconds to 5 seconds for quicker feedback on assertions.

packages/analytics/src/server.ts

@@ -8,4 +8,4 @@ export const analytics: AnalyticsManager = createAnalyticsManager({
   providers: {
     null: () => NullAnalyticsService,
   },
-});
+});

packages/billing/gateway/package.json

@@ -30,10 +30,10 @@
     "@types/react": "19.1.10",
     "date-fns": "^4.1.0",
     "lucide-react": "^0.540.0",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "react": "19.1.1",
     "react-hook-form": "^7.62.0",
-    "react-i18next": "^15.6.1",
+    "react-i18next": "^15.7.1",
     "zod": "^3.25.74"
   },
   "typesVersions": {

packages/billing/lemon-squeezy/package.json

@@ -25,7 +25,7 @@
     "@kit/tsconfig": "workspace:*",
     "@kit/ui": "workspace:*",
     "@types/react": "19.1.10",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "react": "19.1.1",
     "zod": "^3.25.74"
   },

packages/billing/stripe/package.json

@@ -29,7 +29,7 @@
     "@kit/ui": "workspace:*",
     "@types/react": "19.1.10",
     "date-fns": "^4.1.0",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "react": "19.1.1",
     "zod": "^3.25.74"
   },

packages/email-templates/package.json

@@ -13,7 +13,7 @@
     ".": "./src/index.ts"
   },
   "dependencies": {
-    "@react-email/components": "0.5.0"
+    "@react-email/components": "0.5.1"
   },
   "devDependencies": {
     "@kit/eslint-config": "workspace:*",

packages/features/accounts/package.json

@@ -39,12 +39,12 @@
     "@types/react": "19.1.10",
     "@types/react-dom": "19.1.7",
     "lucide-react": "^0.540.0",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "next-themes": "0.4.6",
     "react": "19.1.1",
     "react-dom": "19.1.1",
     "react-hook-form": "^7.62.0",
-    "react-i18next": "^15.6.1",
+    "react-i18next": "^15.7.1",
     "zod": "^3.25.74"
   },
   "prettier": "@kit/prettier-config",

packages/features/admin/package.json

@@ -25,7 +25,7 @@
     "@tanstack/react-table": "^8.21.3",
     "@types/react": "19.1.10",
     "lucide-react": "^0.540.0",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "react": "19.1.1",
     "react-dom": "19.1.1",
     "react-hook-form": "^7.62.0",

packages/features/admin/src/components/admin-account-page.tsx

@@ -151,7 +151,7 @@ async function PersonalAccountPage(props: { account: Account }) {
           <div className={'divider-divider-x flex flex-col gap-y-2.5'}>
             <Heading level={6}>Teams</Heading>
 
-            <div>
+            <div className={'rounded-lg border p-2'}>
               <AdminMembershipsTable memberships={memberships} />
             </div>
           </div>
@@ -216,7 +216,9 @@ async function TeamAccountPage(props: {
             <div className={'flex flex-col gap-y-2.5'}>
               <Heading level={6}>Team Members</Heading>
 
-              <AdminMembersTable members={members} />
+              <div className={'rounded-lg border p-2'}>
+                <AdminMembersTable members={members} />
+              </div>
             </div>
           </div>
         </div>

packages/features/admin/src/components/admin-accounts-table.tsx

@@ -63,13 +63,15 @@ export function AdminAccountsTable(
         <AccountsTableFilters filters={props.filters} />
       </div>
 
-      <DataTable
-        pageSize={props.pageSize}
-        pageIndex={props.page - 1}
-        pageCount={props.pageCount}
-        data={props.data}
-        columns={getColumns()}
-      />
+      <div className={'rounded-lg border p-2'}>
+        <DataTable
+          pageSize={props.pageSize}
+          pageIndex={props.page - 1}
+          pageCount={props.pageCount}
+          data={props.data}
+          columns={getColumns()}
+        />
+      </div>
     </div>
   );
 }

packages/features/admin/src/components/admin-delete-user-dialog.tsx

@@ -2,6 +2,8 @@
 
 import { useState, useTransition } from 'react';
 
+import { isRedirectError } from 'next/dist/client/components/redirect-error';
+
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
 
@@ -71,9 +73,14 @@ export function AdminDeleteUserDialog(
               startTransition(async () => {
                 try {
                   await deleteUserAction(data);
+
                   setError(false);
                 } catch {
-                  setError(true);
+                  if (isRedirectError(error)) {
+                    // Do nothing
+                  } else {
+                    setError(true);
+                  }
                 }
               });
             })}

packages/features/auth/package.json

@@ -33,9 +33,9 @@
     "@tanstack/react-query": "5.85.5",
     "@types/react": "19.1.10",
     "lucide-react": "^0.540.0",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "react-hook-form": "^7.62.0",
-    "react-i18next": "^15.6.1",
+    "react-i18next": "^15.7.1",
     "sonner": "^2.0.7",
     "zod": "^3.25.74"
   },

packages/features/notifications/package.json

@@ -25,7 +25,7 @@
     "lucide-react": "^0.540.0",
     "react": "19.1.1",
     "react-dom": "19.1.1",
-    "react-i18next": "^15.6.1"
+    "react-i18next": "^15.7.1"
   },
   "prettier": "@kit/prettier-config",
   "typesVersions": {

packages/features/team-accounts/package.json

@@ -40,11 +40,11 @@
     "class-variance-authority": "^0.7.1",
     "date-fns": "^4.1.0",
     "lucide-react": "^0.540.0",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "react": "19.1.1",
     "react-dom": "19.1.1",
     "react-hook-form": "^7.62.0",
-    "react-i18next": "^15.6.1",
+    "react-i18next": "^15.7.1",
     "zod": "^3.25.74"
   },
   "prettier": "@kit/prettier-config",

packages/i18n/package.json

@@ -21,13 +21,13 @@
     "@kit/shared": "workspace:*",
     "@kit/tsconfig": "workspace:*",
     "@tanstack/react-query": "5.85.5",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "react": "19.1.1",
     "react-dom": "19.1.1",
-    "react-i18next": "^15.6.1"
+    "react-i18next": "^15.7.1"
   },
   "dependencies": {
-    "i18next": "25.3.6",
+    "i18next": "25.4.0",
     "i18next-browser-languagedetector": "8.2.0",
     "i18next-resources-to-backend": "^1.2.1"
   },

packages/mailers/nodemailer/package.json

@@ -20,7 +20,7 @@
     "@kit/mailers-shared": "workspace:*",
     "@kit/prettier-config": "workspace:*",
     "@kit/tsconfig": "workspace:*",
-    "@types/nodemailer": "7.0.0",
+    "@types/nodemailer": "7.0.1",
     "zod": "^3.25.74"
   },
   "typesVersions": {

packages/next/package.json

@@ -21,7 +21,7 @@
     "@kit/supabase": "workspace:*",
     "@kit/tsconfig": "workspace:*",
     "@supabase/supabase-js": "2.55.0",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "zod": "^3.25.74"
   },
   "typesVersions": {

packages/supabase/package.json

@@ -29,7 +29,7 @@
     "@supabase/supabase-js": "2.55.0",
     "@tanstack/react-query": "5.85.5",
     "@types/react": "19.1.10",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "react": "19.1.1",
     "server-only": "^0.0.1",
     "zod": "^3.25.74"

packages/ui/package.json

@@ -33,12 +33,12 @@
     "class-variance-authority": "^0.7.1",
     "date-fns": "^4.1.0",
     "eslint": "^9.33.0",
-    "next": "15.4.7",
+    "next": "15.5.0",
     "next-themes": "0.4.6",
     "prettier": "^3.6.2",
     "react-day-picker": "^9.9.0",
     "react-hook-form": "^7.62.0",
-    "react-i18next": "^15.6.1",
+    "react-i18next": "^15.7.1",
     "sonner": "^2.0.7",
     "tailwindcss": "4.1.12",
     "tailwindcss-animate": "^1.0.7",
@@ -68,9 +68,11 @@
     "./input": "./src/shadcn/input.tsx",
     "./label": "./src/shadcn/label.tsx",
     "./popover": "./src/shadcn/popover.tsx",
+    "./progress": "./src/shadcn/progress.tsx",
     "./scroll-area": "./src/shadcn/scroll-area.tsx",
     "./select": "./src/shadcn/select.tsx",
     "./sheet": "./src/shadcn/sheet.tsx",
+    "./slider": "./src/shadcn/slider.tsx",
     "./table": "./src/shadcn/table.tsx",
     "./tabs": "./src/shadcn/tabs.tsx",
     "./tooltip": "./src/shadcn/tooltip.tsx",

packages/ui/src/shadcn/slider.tsx

@@ -0,0 +1,29 @@
+'use client';
+
+import * as React from 'react';
+
+import { Slider as SliderPrimitive } from 'radix-ui';
+
+import { cn } from '../lib/utils';
+
+const Slider = React.forwardRef<
+  React.ElementRef<typeof SliderPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root>
+>(({ className, ...props }, ref) => (
+  <SliderPrimitive.Root
+    ref={ref}
+    className={cn(
+      'relative flex w-full touch-none items-center select-none',
+      className,
+    )}
+    {...props}
+  >
+    <SliderPrimitive.Track className="bg-primary/20 relative h-1.5 w-full grow overflow-hidden rounded-full">
+      <SliderPrimitive.Range className="bg-primary absolute h-full" />
+    </SliderPrimitive.Track>
+    <SliderPrimitive.Thumb className="border-primary/50 bg-background focus-visible:ring-ring block h-4 w-4 rounded-full border shadow transition-colors focus-visible:ring-1 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50" />
+  </SliderPrimitive.Root>
+));
+Slider.displayName = SliderPrimitive.Root.displayName;
+
+export { Slider };

packages/ui/src/shadcn/table.tsx

@@ -6,20 +6,20 @@ const Table: React.FC<React.HTMLAttributes<HTMLTableElement>> = ({
   className,
   ...props
 }) => (
-  <div className="relative w-full overflow-auto">
+  <div
+    className={cn('bg-background relative flex flex-1 flex-col overflow-auto')}
+  >
     <table
       className={cn('w-full caption-bottom text-sm', className)}
       {...props}
     />
   </div>
 );
-Table.displayName = 'Table';
 
 const TableHeader: React.FC<React.HTMLAttributes<HTMLTableSectionElement>> = ({
   className,
   ...props
 }) => <thead className={cn('[&_tr]:border-b', className)} {...props} />;
-TableHeader.displayName = 'TableHeader';
 
 const TableBody: React.FC<React.HTMLAttributes<HTMLTableSectionElement>> = ({
   className,
@@ -27,7 +27,6 @@ const TableBody: React.FC<React.HTMLAttributes<HTMLTableSectionElement>> = ({
 }) => (
   <tbody className={cn('[&_tr:last-child]:border-0', className)} {...props} />
 );
-TableBody.displayName = 'TableBody';
 
 const TableFooter: React.FC<React.HTMLAttributes<HTMLTableSectionElement>> = ({
   className,
@@ -35,13 +34,12 @@ const TableFooter: React.FC<React.HTMLAttributes<HTMLTableSectionElement>> = ({
 }) => (
   <tfoot
     className={cn(
-      'bg-muted/50 border-t font-medium last:[&>tr]:border-b-0',
+      'bg-muted/50 border-t font-medium [&>tr]:last:border-b-0',
       className,
     )}
     {...props}
   />
 );
-TableFooter.displayName = 'TableFooter';
 
 const TableRow: React.FC<React.HTMLAttributes<HTMLTableRowElement>> = ({
   className,
@@ -49,13 +47,12 @@ const TableRow: React.FC<React.HTMLAttributes<HTMLTableRowElement>> = ({
 }) => (
   <tr
     className={cn(
-      'hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors',
+      'hover:bg-muted/50 data-[state=selected]:bg-muted group/row border-b transition-colors',
       className,
     )}
     {...props}
   />
 );
-TableRow.displayName = 'TableRow';
 
 const TableHead: React.FC<React.ThHTMLAttributes<HTMLTableCellElement>> = ({
   className,
@@ -63,13 +60,12 @@ const TableHead: React.FC<React.ThHTMLAttributes<HTMLTableCellElement>> = ({
 }) => (
   <th
     className={cn(
-      'text-muted-foreground h-10 px-2 text-left align-middle font-medium [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',
+      'text-muted-foreground h-8 px-2 text-left align-middle font-medium [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',
       className,
     )}
     {...props}
   />
 );
-TableHead.displayName = 'TableHead';
 
 const TableCell: React.FC<React.TdHTMLAttributes<HTMLTableCellElement>> = ({
   className,
@@ -77,13 +73,12 @@ const TableCell: React.FC<React.TdHTMLAttributes<HTMLTableCellElement>> = ({
 }) => (
   <td
     className={cn(
-      'p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',
+      'px-2 py-1.5 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',
       className,
     )}
     {...props}
   />
 );
-TableCell.displayName = 'TableCell';
 
 const TableCaption: React.FC<React.HTMLAttributes<HTMLTableCaptionElement>> = ({
   className,
@@ -94,7 +89,6 @@ const TableCaption: React.FC<React.HTMLAttributes<HTMLTableCaptionElement>> = ({
     {...props}
   />
 );
-TableCaption.displayName = 'TableCaption';
 
 export {
   Table,