@opensaas/stack-ui 0.22.0 → 0.24.0

package/.turbo/turbo-build.log

@@ -1,11 +1,11 @@
 
-> @opensaas/stack-ui@0.22.0 build /home/runner/work/stack/stack/packages/ui
+> @opensaas/stack-ui@0.24.0 build /home/runner/work/stack/stack/packages/ui
 > tsc && npm run build:css
 
 npm warn Unknown env config "verify-deps-before-run". This will stop working in the next major version of npm. See `npm help npmrc` for supported config options.
 npm warn Unknown env config "npm-globalconfig". This will stop working in the next major version of npm. See `npm help npmrc` for supported config options.
 npm warn Unknown env config "_jsr-registry". This will stop working in the next major version of npm. See `npm help npmrc` for supported config options.
 
-> @opensaas/stack-ui@0.22.0 build:css
+> @opensaas/stack-ui@0.24.0 build:css
 > mkdir -p dist/styles && postcss ./src/styles/globals.css -o ./dist/styles/globals.css
 

package/CHANGELOG.md

@@ -1,5 +1,100 @@
 # @opensaas/stack-ui
 
+## 0.24.0
+
+### Minor Changes
+
+- [#552](https://github.com/OpenSaasAU/stack/pull/552) [`66496b4`](https://github.com/OpenSaasAU/stack/commit/66496b487bae61f3cdea26fcfcaf605caaaa5520) Thanks [@borisno2](https://github.com/borisno2)! - Add list-level `ui.listView` config (mirroring Keystone) for default columns and sort
+
+  Lists now support a `ui.listView` block in `opensaas.config.ts` that sets the
+  admin list table's default column selection/order and default sort. Naming
+  mirrors Keystone's `ui.listView` so migrators can map defaults directly.
+
+  ```typescript
+  lists: {
+    Post: list({
+      fields: {
+        title: text(),
+        status: text(),
+        createdAt: timestamp(),
+      },
+      ui: {
+        listView: {
+          // Column selection AND order
+          initialColumns: ['title', 'status'],
+          // Default sort
+          initialSort: { field: 'createdAt', direction: 'desc' },
+        },
+      },
+    }),
+  }
+  ```
+
+  When `ui.listView` is absent, behaviour is unchanged: the table shows all
+  non-system fields and applies no default sort.
+
+## 0.23.0
+
+### Minor Changes
+
+- [#543](https://github.com/OpenSaasAU/stack/pull/543) [`4de6a3b`](https://github.com/OpenSaasAU/stack/commit/4de6a3b35ff2337fbd32f285e6c0cc63a0b2d2cf) Thanks [@borisno2](https://github.com/borisno2)! - Handle `autoCreate: false` singletons and access-denied reads in the AdminUI singleton editor.
+
+  When a singleton's `get()` returns no record, `SingletonView` now disambiguates the two reasons a singleton can be empty and renders the safe affordance:
+  - **`autoCreate: false` with no row yet** (query + create allowed): renders a create-on-first-save form (reuses `ItemFormClient` in `mode="create"`). Core assigns the singleton `id` and enforces the single-record constraint on save, so the form sends only the user-entered field data.
+  - **`query` access denied**: renders a friendly "no access" message — never an editable or create form.
+  - **create denied (autoCreate: false, no row)**: renders a friendly "no record yet" message instead of an unusable form.
+
+  An update-denied singleton still renders the edit form, but the save fails gracefully via the server action's denied envelope. The happy path (a record exists → edit form) and non-singleton lists are unchanged.
+
+- [#542](https://github.com/OpenSaasAU/stack/pull/542) [`ef6ce9a`](https://github.com/OpenSaasAU/stack/commit/ef6ce9a3d9c8c129626d98640004c2c0bf84b656) Thanks [@borisno2](https://github.com/borisno2)! - Render a single-record editor for `isSingleton` lists in `AdminUI`
+
+  A list configured with `isSingleton: true` now renders a single-record editor at
+  its bare `[list]` route instead of a list table. The new `SingletonView`
+  component resolves the record via the singleton `get()` operation (which
+  auto-creates the row with field defaults when absent) and reuses the existing
+  `ItemFormClient` in edit mode, so field rendering, validation, and the existing
+  `serverAction` save path all apply unchanged. Non-singleton lists are
+  unaffected and still render the table.
+
+  ```typescript
+  // opensaas.config.ts
+  lists: {
+    SiteSettings: list({
+      isSingleton: true,
+      fields: {
+        siteName: text(),
+        supportEmail: text(),
+      },
+    }),
+  }
+  ```
+
+  Visiting `/admin/site-settings` now shows an "Edit Site Settings" form for the
+  single record rather than a one-row list.
+
+- [#544](https://github.com/OpenSaasAU/stack/pull/544) [`581ef89`](https://github.com/OpenSaasAU/stack/commit/581ef89975e41a359b0a92c4808fbcdee7fe1607) Thanks [@borisno2](https://github.com/borisno2)! - Add first-class singleton presentation to the admin Navigation and Dashboard
+
+  Singleton lists (`isSingleton`) are now visually distinguished from ordinary lists:
+  - **Navigation:** singletons render under a dedicated "Settings" group with a gear
+    icon, separate from the standard "Lists" group. Each still links to its
+    single-record editor (`/<basePath>/<url>`). The "Settings" group is omitted when
+    there are no singletons (and the "Lists" group is omitted when there are only
+    singletons).
+  - **Dashboard:** singletons appear in their own "Settings" section with a
+    "Configure" affordance instead of the misleading "N items" count (a singleton's
+    count is always 0 or 1). The Dashboard no longer calls `count()` for singletons.
+
+  Non-singleton lists are unchanged.
+
+- [#545](https://github.com/OpenSaasAU/stack/pull/545) [`f2cc754`](https://github.com/OpenSaasAU/stack/commit/f2cc754e34b07a427168ddb11cfc33d74457af82) Thanks [@borisno2](https://github.com/borisno2)! - Suppress create/delete affordances and redirect sub-routes for singleton lists in the admin UI.
+
+  Singleton lists (`isSingleton: true`) have a single record edited at their bare `[list]` route, so the create and delete affordances no longer apply:
+  - The Dashboard "Quick Actions" no longer renders a "Create {list}" link for singletons (only standard lists). The Quick Actions card is hidden entirely in a singleton-only admin.
+  - The singleton editor (`SingletonView`) no longer renders a Delete control. A new optional `canDelete` prop (default `true`) on `ItemFormClient` controls this; non-singleton edit forms keep their Delete button.
+  - The singleton sub-routes `/admin/<list>/create` and `/admin/<list>/<id>` now server-side `redirect()` to the bare editor `/admin/<list>`, so old links keep working.
+
+  Non-singleton create/delete affordances and routing are unchanged.
+
 ## 0.22.0
 
 ## 0.21.0

package/CLAUDE.md

@@ -50,7 +50,14 @@ Composable CRUD components:
 
 ### Server (`/server`)
 
-- `getAdminContext(headers)` - Get context with session from request headers
+Type-only re-exports for wiring the admin's server action (no runtime exports):
+
+- `ServerActionInput` - Props passed to the generic server action (re-exported from stack-core)
+- `ActionResult<T>` - Result shape returned by a server action
+
+The host app builds the access-scoped `context` itself (from the generated
+`.opensaas/context`) and passes it to `AdminUI`. There is no `getAdminContext`
+helper in this package.
 
 ## Architecture Patterns
 
@@ -154,7 +161,7 @@ export function RichTextField({ placeholder, minHeight, customOption, ...basePro
 
 ### Server/Client Boundaries
 
-- `AdminUI` is server component (uses `getAdminContext`)
+- `AdminUI` is a server component (the host builds and passes `context`)
 - Forms and interactive components are client components
 - Data serialization via props (no functions, only JSON-serializable data)
 
@@ -168,7 +175,7 @@ export function RichTextField({ placeholder, minHeight, customOption, ...basePro
 
 ### With @opensaas/stack-auth
 
-- `getAdminContext` uses Better-auth to get session
+- The host resolves the Better-auth session and passes it to `getContext(session)`
 - Session flows through context to access control
 - Auth UI components imported separately from `@opensaas/stack-auth/ui`
 
@@ -191,18 +198,48 @@ import '../../../lib/register-fields' // Side-effect import
 
 ### Basic Admin Setup
 
+The host builds the access-scoped `context` (and `config`) from the generated
+`.opensaas/context` and wires a `'use server'` action that forwards to
+`context.serverAction`:
+
 ```typescript
 // app/admin/[[...admin]]/page.tsx
 import { AdminUI } from '@opensaas/stack-ui'
-import { getAdminContext } from '@opensaas/stack-ui/server'
-import config from '@/opensaas.config'
+import type { ServerActionInput } from '@opensaas/stack-ui/server'
+import { getContext, config } from '@/.opensaas/context'
+
+// User-defined wrapper that runs the server action with an access-scoped context
+async function serverAction(props: ServerActionInput) {
+  'use server'
+  const context = await getContext()
+  return await context.serverAction(props)
+}
 
-export default async function AdminPage() {
-  const context = await getAdminContext()
-  return <AdminUI context={context} config={config} />
+interface AdminPageProps {
+  params: Promise<{ admin?: string[] }>
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>
+}
+
+export default async function AdminPage({ params, searchParams }: AdminPageProps) {
+  const resolvedParams = await params
+  const resolvedSearchParams = await searchParams
+  return (
+    <AdminUI
+      context={await getContext()}
+      config={await config}
+      params={resolvedParams.admin}
+      searchParams={resolvedSearchParams}
+      basePath="/admin"
+      serverAction={serverAction}
+    />
+  )
 }
 ```
 
+With auth, resolve the session and pass it to `getContext(session)` (in both the
+page and the wrapper). See `examples/starter`, `examples/starter-auth`, and
+`examples/auth-demo`.
+
 ### Custom Field Component (Global Registration)
 
 ```typescript
@@ -305,7 +342,7 @@ Avoid `any` types - all props are strongly typed for type safety.
 
 ## Performance
 
-- Server components by default (AdminUI, getAdminContext)
+- Server components by default (AdminUI renders on the server)
 - Client components marked with `'use client'`
 - Minimal client-side JS for interactive features only
 - Data fetching on server reduces client bundle size

package/README.md

@@ -32,8 +32,8 @@ import { ItemCreateForm, ListTable, SearchBar } from '@opensaas/stack-ui/standal
 // Full components (page-level)
 import { Dashboard, ListView, ItemForm, AdminUI } from '@opensaas/stack-ui'
 
-// Server utilities
-import { getAdminContext } from '@opensaas/stack-ui/server'
+// Server utility types
+import type { ServerActionInput, ActionResult } from '@opensaas/stack-ui/server'
 
 // Utility functions
 import { cn, formatListName, formatFieldName } from '@opensaas/stack-ui/lib/utils'
@@ -175,19 +175,50 @@ import { DeleteButton } from '@opensaas/stack-ui/standalone'
 
 ### Level 4: Full Admin UI (`@opensaas/stack-ui`)
 
-Complete admin interface with routing and navigation.
+Complete admin interface with routing and navigation. The host app builds the
+access-scoped `context` (and `config`) from the generated `.opensaas/context`
+and passes them in, along with a `'use server'` wrapper that forwards form
+submissions to `context.serverAction`:
 
 ```tsx
+// app/admin/[[...admin]]/page.tsx
 import { AdminUI } from '@opensaas/stack-ui'
-;<AdminUI
-  context={context}
-  params={params?.admin}
-  searchParams={searchParams}
-  basePath="/admin"
-  serverAction={handleServerAction}
-/>
+import type { ServerActionInput } from '@opensaas/stack-ui/server'
+import { getContext, config } from '@/.opensaas/context'
+
+// User-defined wrapper that runs the server action with an access-scoped context
+async function serverAction(props: ServerActionInput) {
+  'use server'
+  const context = await getContext()
+  return await context.serverAction(props)
+}
+
+interface AdminPageProps {
+  params: Promise<{ admin?: string[] }>
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>
+}
+
+export default async function AdminPage({ params, searchParams }: AdminPageProps) {
+  const resolvedParams = await params
+  const resolvedSearchParams = await searchParams
+  return (
+    <AdminUI
+      context={await getContext()}
+      config={await config}
+      params={resolvedParams.admin}
+      searchParams={resolvedSearchParams}
+      basePath="/admin"
+      serverAction={serverAction}
+    />
+  )
+}
 ```
 
+> With `@opensaas/stack-auth`, resolve the session first and pass it to
+> `getContext(session)` (in both the page and the `serverAction` wrapper) so
+> access control runs as the signed-in user. See `examples/starter-auth` and
+> `examples/auth-demo`.
+
 ## Component Registry
 
 Extend or override field components:

package/dist/components/AdminUI.d.ts

@@ -17,7 +17,7 @@ export interface AdminUIProps {
  *
  * Handles routing based on params array:
  * - [] → Dashboard
- * - [list] → ListView
+ * - [list] → ListView (or SingletonView when the list is `isSingleton`)
  * - [list, 'create'] → ItemForm (create)
  * - [list, id] → ItemForm (edit)
  */

package/dist/components/AdminUI.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminUI.d.ts","sourceRoot":"","sources":["../../src/components/AdminUI.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAC3D,OAAO,EAAE,KAAK,aAAa,EAAqB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAG5F,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC/B,MAAM,EAAE,cAAc,CAAA;IACtB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAA;IACjB,YAAY,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,SAAS,CAAA;KAAE,CAAA;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,YAAY,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,OAAO,CAAC,OAAO,CAAC,CAAA;IAC5D,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CAChC;AAED;;;;;;;;;GASG;AACH,wBAAgB,OAAO,CAAC,EACtB,OAAO,EACP,MAAM,EACN,MAAW,EACX,YAAiB,EACjB,QAAmB,EACnB,YAAY,EACZ,SAAS,GACV,EAAE,YAAY,2CA4Ed"}
+{"version":3,"file":"AdminUI.d.ts","sourceRoot":"","sources":["../../src/components/AdminUI.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAC3D,OAAO,EACL,KAAK,aAAa,EAGlB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAG7B,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC/B,MAAM,EAAE,cAAc,CAAA;IACtB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAA;IACjB,YAAY,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,SAAS,CAAA;KAAE,CAAA;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,YAAY,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,OAAO,CAAC,OAAO,CAAC,CAAA;IAC5D,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CAChC;AAED;;;;;;;;;GASG;AACH,wBAAgB,OAAO,CAAC,EACtB,OAAO,EACP,MAAM,EACN,MAAW,EACX,YAAiB,EACjB,QAAmB,EACnB,YAAY,EACZ,SAAS,GACV,EAAE,YAAY,2CAuGd"}

package/dist/components/AdminUI.js

@@ -1,9 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { redirect } from 'next/navigation.js';
 import { Navigation } from './Navigation.js';
 import { Dashboard } from './Dashboard.js';
 import { ListView } from './ListView.js';
 import { ItemForm } from './ItemForm.js';
-import { getListKeyFromUrl } from '@opensaas/stack-core';
+import { SingletonView } from './SingletonView.js';
+import { getListKeyFromUrl, getUrlKey, } from '@opensaas/stack-core';
 import { generateThemeCSS } from '../lib/theme.js';
 /**
  * Main AdminUI component - complete admin interface with routing
@@ -11,7 +13,7 @@ import { generateThemeCSS } from '../lib/theme.js';
  *
  * Handles routing based on params array:
  * - [] → Dashboard
- * - [list] → ListView
+ * - [list] → ListView (or SingletonView when the list is `isSingleton`)
  * - [list, 'create'] → ItemForm (create)
  * - [list, id] → ItemForm (edit)
  */
@@ -28,6 +30,14 @@ export function AdminUI({ context, config, params = [], searchParams = {}, baseP
         // Dashboard
         content = _jsx(Dashboard, { context: context, config: config, basePath: basePath });
     }
+    else if (config.lists[listKey]?.isSingleton && action) {
+        // A singleton has a single record edited at its bare [list] route, so the
+        // create/id sub-routes (`[list, 'create']` / `[list, id]`) don't apply.
+        // Redirect them to the bare editor so old links keep working. This runs
+        // before the create/edit ItemForm branches; non-singleton routing below is
+        // unchanged.
+        redirect(`${basePath}/${getUrlKey(listKey)}`);
+    }
     else if (action === 'create') {
         // Create form
         content = (_jsx(ItemForm, { context: context, config: config, listKey: listKey, mode: "create", basePath: basePath, serverAction: serverAction }));
@@ -36,11 +46,21 @@ export function AdminUI({ context, config, params = [], searchParams = {}, baseP
         // Edit form (action is the item ID)
         content = (_jsx(ItemForm, { context: context, config: config, listKey: listKey, mode: "edit", itemId: action, basePath: basePath, serverAction: serverAction }));
     }
+    else if (config.lists[listKey]?.isSingleton) {
+        // Singleton editor: a singleton has a single record, so its bare [list]
+        // route renders a single-record editor instead of a list table.
+        content = (_jsx(SingletonView, { context: context, config: config, listKey: listKey, basePath: basePath, serverAction: serverAction }));
+    }
     else {
         // List view
         const search = typeof searchParams.search === 'string' ? searchParams.search : undefined;
         const page = typeof searchParams.page === 'string' ? parseInt(searchParams.page, 10) : 1;
-        content = (_jsx(ListView, { context: context, config: config, listKey: listKey, basePath: basePath, search: search, page: page }));
+        // Read list-view defaults (column selection/order + default sort) from the
+        // list-level `ui.listView` config (mirrors Keystone). When absent, the
+        // ListView falls back to its existing defaults (all non-system fields,
+        // no default sort).
+        const listView = config.lists[listKey]?.ui?.listView;
+        content = (_jsx(ListView, { context: context, config: config, listKey: listKey, basePath: basePath, search: search, page: page, columns: listView?.initialColumns, initialSort: listView?.initialSort }));
     }
     // Generate theme styles if custom theme is configured
     const themeStyles = config.ui?.theme ? generateThemeCSS(config.ui.theme) : null;

package/dist/components/Dashboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dashboard.d.ts","sourceRoot":"","sources":["../../src/components/Dashboard.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAG9F,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC/B,MAAM,EAAE,cAAc,CAAA;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED;;;GAGG;AACH,wBAAsB,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,QAAmB,EAAE,EAAE,cAAc,oDAmHvF"}
+{"version":3,"file":"Dashboard.d.ts","sourceRoot":"","sources":["../../src/components/Dashboard.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAG9F,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC/B,MAAM,EAAE,cAAc,CAAA;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED;;;GAGG;AACH,wBAAsB,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,QAAmB,EAAE,EAAE,cAAc,oDA0NvF"}

package/dist/components/Dashboard.js

@@ -9,8 +9,14 @@ import { Card, CardContent, CardHeader, CardTitle } from '../primitives/card.js'
  */
 export async function Dashboard({ context, config, basePath = '/admin' }) {
     const lists = Object.keys(config.lists || {});
-    // Get counts for each list
-    const listCounts = await Promise.all(lists.map(async (listKey) => {
+    // Split lists into standard lists (shown in the counted grid) and singletons
+    // (shown in their own "Settings" section). A singleton's count is always 0/1,
+    // so the "N items" label is misleading — show a "Configure" affordance instead.
+    const standardLists = lists.filter((listKey) => !config.lists[listKey]?.isSingleton);
+    const singletonLists = lists.filter((listKey) => config.lists[listKey]?.isSingleton);
+    // Get counts for the standard lists only. Singletons don't show a count, so
+    // there's no need to call count() for them here.
+    const listCounts = await Promise.all(standardLists.map(async (listKey) => {
         try {
             const delegate = context.db[getDbKey(listKey)];
             const count = delegate?.count ? await delegate.count() : 0;
@@ -21,10 +27,13 @@ export async function Dashboard({ context, config, basePath = '/admin' }) {
             return { listKey, count: 0 };
         }
     }));
-    return (_jsxs("div", { className: "p-8", children: [_jsxs("div", { className: "mb-8 relative", children: [_jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-primary/5 to-accent/5 opacity-100 rounded-2xl" }), _jsxs("div", { className: "relative p-6", children: [_jsx("h1", { className: "text-4xl font-bold mb-2 bg-gradient-to-r from-primary to-accent bg-clip-text text-transparent", children: "Dashboard" }), _jsx("p", { className: "text-muted-foreground", children: "Manage your application data" })] })] }), lists.length === 0 ? (_jsxs(Card, { className: "p-12 text-center border-2 border-dashed", children: [_jsx("div", { className: "mb-4 text-4xl", children: "\uD83D\uDCE6" }), _jsx("p", { className: "text-muted-foreground mb-2 font-medium", children: "No lists configured" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Add lists to your opensaas.config.ts to get started." })] })) : (_jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: listCounts.map(({ listKey, count }) => {
+    return (_jsxs("div", { className: "p-8", children: [_jsxs("div", { className: "mb-8 relative", children: [_jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-primary/5 to-accent/5 opacity-100 rounded-2xl" }), _jsxs("div", { className: "relative p-6", children: [_jsx("h1", { className: "text-4xl font-bold mb-2 bg-gradient-to-r from-primary to-accent bg-clip-text text-transparent", children: "Dashboard" }), _jsx("p", { className: "text-muted-foreground", children: "Manage your application data" })] })] }), lists.length === 0 ? (_jsxs(Card, { className: "p-12 text-center border-2 border-dashed", children: [_jsx("div", { className: "mb-4 text-4xl", children: "\uD83D\uDCE6" }), _jsx("p", { className: "text-muted-foreground mb-2 font-medium", children: "No lists configured" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Add lists to your opensaas.config.ts to get started." })] })) : standardLists.length > 0 ? (_jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: listCounts.map(({ listKey, count }) => {
                     const urlKey = getUrlKey(listKey);
                     return (_jsx(Link, { href: `${basePath}/${urlKey}`, children: _jsxs(Card, { className: "group hover:border-primary hover:shadow-lg hover:shadow-primary/20 transition-all duration-200 cursor-pointer h-full relative overflow-hidden", children: [_jsx("div", { className: "absolute inset-0 bg-gradient-to-br from-primary/5 to-accent/5 opacity-0 group-hover:opacity-100 transition-opacity" }), _jsx(CardHeader, { className: "relative", children: _jsxs("div", { className: "flex items-start justify-between", children: [_jsxs("div", { children: [_jsx(CardTitle, { className: "text-xl group-hover:text-primary transition-colors", children: formatListName(listKey) }), _jsxs("p", { className: "text-sm text-muted-foreground mt-1 font-medium", children: [count, " ", count === 1 ? 'item' : 'items'] })] }), _jsx("div", { className: "text-3xl opacity-60 group-hover:opacity-100 transition-opacity", children: "\uD83D\uDCCB" })] }) }), _jsx(CardContent, { className: "relative", children: _jsxs("div", { className: "flex items-center text-sm font-medium text-primary", children: [_jsx("span", { children: "View all" }), _jsx("svg", { className: "ml-1 w-4 h-4 group-hover:translate-x-1 transition-transform", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) })] }) })] }) }, listKey));
-                }) })), lists.length > 0 && (_jsxs(Card, { className: "mt-12 bg-gradient-to-br from-accent/10 to-primary/10 border-accent/20", children: [_jsx(CardHeader, { children: _jsxs(CardTitle, { className: "text-lg flex items-center gap-2", children: [_jsx("span", { className: "text-xl", children: "\u26A1" }), "Quick Actions"] }) }), _jsx(CardContent, { children: _jsx("div", { className: "flex flex-wrap gap-3", children: lists.map((listKey) => {
+                }) })) : null, singletonLists.length > 0 && (_jsxs("div", { className: standardLists.length > 0 ? 'mt-12' : '', children: [_jsxs("div", { className: "mb-4 flex items-center gap-2", children: [_jsxs("svg", { className: "w-5 h-5 text-muted-foreground", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: [_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" }), _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" })] }), _jsx("h2", { className: "text-xl font-semibold text-foreground", children: "Settings" })] }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: singletonLists.map((listKey) => {
+                            const urlKey = getUrlKey(listKey);
+                            return (_jsx(Link, { href: `${basePath}/${urlKey}`, children: _jsxs(Card, { className: "group hover:border-primary hover:shadow-lg hover:shadow-primary/20 transition-all duration-200 cursor-pointer h-full relative overflow-hidden", children: [_jsx("div", { className: "absolute inset-0 bg-gradient-to-br from-primary/5 to-accent/5 opacity-0 group-hover:opacity-100 transition-opacity" }), _jsx(CardHeader, { className: "relative", children: _jsxs("div", { className: "flex items-start justify-between", children: [_jsx("div", { children: _jsx(CardTitle, { className: "text-xl group-hover:text-primary transition-colors", children: formatListName(listKey) }) }), _jsx("div", { className: "text-muted-foreground opacity-60 group-hover:opacity-100 transition-opacity", children: _jsxs("svg", { className: "w-7 h-7", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: [_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" }), _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" })] }) })] }) }), _jsx(CardContent, { className: "relative", children: _jsxs("div", { className: "flex items-center text-sm font-medium text-primary", children: [_jsx("span", { children: "Configure" }), _jsx("svg", { className: "ml-1 w-4 h-4 group-hover:translate-x-1 transition-transform", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) })] }) })] }) }, listKey));
+                        }) })] })), standardLists.length > 0 && (_jsxs(Card, { className: "mt-12 bg-gradient-to-br from-accent/10 to-primary/10 border-accent/20", children: [_jsx(CardHeader, { children: _jsxs(CardTitle, { className: "text-lg flex items-center gap-2", children: [_jsx("span", { className: "text-xl", children: "\u26A1" }), "Quick Actions"] }) }), _jsx(CardContent, { children: _jsx("div", { className: "flex flex-wrap gap-3", children: standardLists.map((listKey) => {
                                 const urlKey = getUrlKey(listKey);
                                 return (_jsxs(Link, { href: `${basePath}/${urlKey}/create`, className: "inline-flex items-center gap-1 px-4 py-2 rounded-lg bg-primary/10 text-primary hover:bg-primary hover:text-primary-foreground font-medium text-sm transition-colors border border-primary/20", children: [_jsx("span", { className: "text-lg", children: "+" }), "Create ", formatListName(listKey)] }, listKey));
                             }) }) })] }))] }));

package/dist/components/ItemForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ItemForm.d.ts","sourceRoot":"","sources":["../../src/components/ItemForm.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAC3D,OAAO,EAAE,KAAK,aAAa,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAG9F,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC/B,MAAM,EAAE,cAAc,CAAA;IACtB,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,QAAQ,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,YAAY,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,OAAO,CAAC,OAAO,CAAC,CAAA;CAC7D;AAED;;;GAGG;AACH,wBAAsB,QAAQ,CAAC,EAC7B,OAAO,EACP,MAAM,EACN,OAAO,EACP,IAAI,EACJ,MAAM,EACN,QAAmB,EACnB,YAAY,GACb,EAAE,aAAa,oDAuKf"}
+{"version":3,"file":"ItemForm.d.ts","sourceRoot":"","sources":["../../src/components/ItemForm.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAC3D,OAAO,EAAE,KAAK,aAAa,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAG9F,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC/B,MAAM,EAAE,cAAc,CAAA;IACtB,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,QAAQ,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,YAAY,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,OAAO,CAAC,OAAO,CAAC,CAAA;CAC7D;AAED;;;GAGG;AACH,wBAAsB,QAAQ,CAAC,EAC7B,OAAO,EACP,MAAM,EACN,OAAO,EACP,IAAI,EACJ,MAAM,EACN,QAAmB,EACnB,YAAY,GACb,EAAE,aAAa,oDAqGf"}

package/dist/components/ItemForm.js

@@ -3,7 +3,7 @@ import Link from 'next/link.js';
 import { ItemFormClient } from './ItemFormClient.js';
 import { formatListName } from '../lib/utils.js';
 import { getDbKey, getUrlKey } from '@opensaas/stack-core';
-import { serializeFieldConfigs } from '../lib/serializeFieldConfig.js';
+import { buildRelationshipInclude, prepareItemForm } from '../lib/prepareItemForm.js';
 /**
  * Item form component - create or edit an item
  * Server Component that fetches data and sets up actions
@@ -18,15 +18,8 @@ export async function ItemForm({ context, config, listKey, mode, itemId, basePat
     let itemData = {};
     if (mode === 'edit' && itemId) {
         try {
-            // Build include object for relationships
-            const includeRelationships = {};
-            for (const [fieldName, fieldConfig] of Object.entries(listConfig.fields)) {
-                const fieldConfigAny = fieldConfig;
-                if (fieldConfigAny.type === 'relationship') {
-                    includeRelationships[fieldName] = true;
-                }
-            }
             // Fetch item with relationships included
+            const includeRelationships = buildRelationshipInclude(listConfig);
             const delegate = context.db[getDbKey(listKey)];
             if (delegate?.findUnique) {
                 itemData = await delegate.findUnique({
@@ -42,60 +35,8 @@ export async function ItemForm({ context, config, listKey, mode, itemId, basePat
             return (_jsx("div", { className: "p-8", children: _jsxs("div", { className: "bg-destructive/10 border border-destructive text-destructive rounded-lg p-6", children: [_jsx("h2", { className: "text-lg font-semibold mb-2", children: "Item not found" }), _jsx("p", { children: "The item you're trying to edit doesn't exist or you don't have access to it." }), _jsxs(Link, { href: `${basePath}/${urlKey}`, className: "inline-block mt-4 text-primary hover:underline", children: ["\u2190 Back to ", formatListName(listKey)] })] }) }));
         }
     }
-    // Fetch relationship options for all relationship fields
-    const relationshipData = {};
-    for (const [fieldName, fieldConfig] of Object.entries(listConfig.fields)) {
-        // Check if field is a relationship type by checking the discriminated union
-        const fieldConfigAny = fieldConfig;
-        if (fieldConfigAny.type === 'relationship') {
-            const ref = fieldConfigAny.ref;
-            if (ref) {
-                // Parse ref format: "ListName.fieldName"
-                const relatedListName = ref.split('.')[0];
-                const relatedListConfig = config.lists[relatedListName];
-                if (relatedListConfig) {
-                    try {
-                        const dbContext = context.db;
-                        const delegate = dbContext[getDbKey(relatedListName)];
-                        const relatedItems = delegate?.findMany ? await delegate.findMany({}) : [];
-                        // Use 'name' field as label if it exists, otherwise use 'id'
-                        relationshipData[fieldName] = relatedItems.map((item) => ({
-                            id: item.id,
-                            label: (item.name || item.title || item.id) || '',
-                        }));
-                    }
-                    catch (error) {
-                        console.error(`Failed to fetch relationship items for ${fieldName}:`, error);
-                        relationshipData[fieldName] = [];
-                    }
-                }
-            }
-        }
-    }
-    // Serialize field configs to remove non-serializable properties
-    const serializableFields = serializeFieldConfigs(listConfig.fields);
-    // Transform relationship data in itemData from objects to IDs for form
-    // Also apply valueForClientSerialization transformation
-    const formData = { ...itemData };
-    for (const [fieldName, fieldConfig] of Object.entries(listConfig.fields)) {
-        const fieldConfigAny = fieldConfig;
-        if (fieldConfigAny.type === 'relationship' && formData[fieldName]) {
-            const value = formData[fieldName];
-            if (fieldConfigAny.many && Array.isArray(value)) {
-                // Many relationship: extract IDs from array of objects
-                formData[fieldName] = value.map((item) => item.id);
-            }
-            else if (value && typeof value === 'object' && 'id' in value) {
-                // Single relationship: extract ID from object
-                formData[fieldName] = value.id;
-            }
-        }
-        // Apply valueForClientSerialization if defined
-        if (fieldConfigAny.ui?.valueForClientSerialization &&
-            typeof fieldConfigAny.ui.valueForClientSerialization === 'function') {
-            const transformer = fieldConfigAny.ui.valueForClientSerialization;
-            formData[fieldName] = transformer({ value: formData[fieldName] });
-        }
-    }
-    return (_jsxs("div", { className: "p-8 max-w-4xl", children: [_jsxs("div", { className: "mb-8", children: [_jsxs(Link, { href: `${basePath}/${urlKey}`, className: "inline-flex items-center text-sm text-muted-foreground hover:text-foreground mb-4", children: [_jsx("svg", { className: "w-4 h-4 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }), "Back to ", formatListName(listKey)] }), _jsxs("h1", { className: "text-3xl font-bold", children: [mode === 'create' ? 'Create' : 'Edit', " ", formatListName(listKey)] })] }), _jsx("div", { className: "bg-card border border-border rounded-lg p-6", children: _jsx(ItemFormClient, { listKey: listKey, urlKey: urlKey, mode: mode, fields: serializableFields, initialData: JSON.parse(JSON.stringify(formData)), itemId: itemId, basePath: basePath, serverAction: serverAction, relationshipData: relationshipData }) })] }));
+    // Fetch relationship options, serialize field configs, and transform the
+    // record into client-ready form data (shared with the singleton editor).
+    const { serializableFields, initialData, relationshipData } = await prepareItemForm(context, config, listConfig, itemData);
+    return (_jsxs("div", { className: "p-8 max-w-4xl", children: [_jsxs("div", { className: "mb-8", children: [_jsxs(Link, { href: `${basePath}/${urlKey}`, className: "inline-flex items-center text-sm text-muted-foreground hover:text-foreground mb-4", children: [_jsx("svg", { className: "w-4 h-4 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }), "Back to ", formatListName(listKey)] }), _jsxs("h1", { className: "text-3xl font-bold", children: [mode === 'create' ? 'Create' : 'Edit', " ", formatListName(listKey)] })] }), _jsx("div", { className: "bg-card border border-border rounded-lg p-6", children: _jsx(ItemFormClient, { listKey: listKey, urlKey: urlKey, mode: mode, fields: serializableFields, initialData: initialData, itemId: itemId, basePath: basePath, serverAction: serverAction, relationshipData: relationshipData }) })] }));
 }

package/dist/components/ItemFormClient.d.ts

@@ -13,6 +13,13 @@ export interface ItemFormClientProps {
         id: string;
         label: string;
     }>>;
+    /**
+     * Whether to render the delete affordance in edit mode. Defaults to `true`.
+     * Singletons set this to `false` — a singleton has exactly one record that
+     * can't be deleted (core blocks `delete` even in sudo), so the control is
+     * suppressed for UX hygiene.
+     */
+    canDelete?: boolean;
 }
 /**
  * Client component for the AdminUI item form.
@@ -21,5 +28,5 @@ export interface ItemFormClientProps {
  * forms via `useItemForm`; this component only adapts submission to the
  * AdminUI server action + router navigation, and adds the delete flow.
  */
-export declare function ItemFormClient({ listKey, urlKey, mode, fields, initialData, itemId, basePath, serverAction, relationshipData, }: ItemFormClientProps): import("react/jsx-runtime").JSX.Element;
+export declare function ItemFormClient({ listKey, urlKey, mode, fields, initialData, itemId, basePath, serverAction, relationshipData, canDelete, }: ItemFormClientProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ItemFormClient.d.ts.map

package/dist/components/ItemFormClient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ItemFormClient.d.ts","sourceRoot":"","sources":["../../src/components/ItemFormClient.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAC3D,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gCAAgC,CAAA;AAG7E,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,MAAM,CAAA;IACf,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,QAAQ,GAAG,MAAM,CAAA;IACvB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,uBAAuB,CAAC,CAAA;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACrC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,OAAO,CAAC,OAAO,CAAC,CAAA;IAC5D,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAA;CACxE;AAoBD;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,MAAM,EACN,IAAI,EACJ,MAAM,EACN,WAAgB,EAChB,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,gBAAqB,GACtB,EAAE,mBAAmB,2CAkIrB"}
+{"version":3,"file":"ItemFormClient.d.ts","sourceRoot":"","sources":["../../src/components/ItemFormClient.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAC3D,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gCAAgC,CAAA;AAG7E,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,MAAM,CAAA;IACf,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,QAAQ,GAAG,MAAM,CAAA;IACvB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,uBAAuB,CAAC,CAAA;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACrC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,OAAO,CAAC,OAAO,CAAC,CAAA;IAC5D,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAA;IACvE;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAoBD;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,MAAM,EACN,IAAI,EACJ,MAAM,EACN,WAAgB,EAChB,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,gBAAqB,EACrB,SAAgB,GACjB,EAAE,mBAAmB,2CAkIrB"}

package/dist/components/ItemFormClient.js

@@ -30,7 +30,7 @@ function toSubmitResult(result, deniedMessage) {
  * forms via `useItemForm`; this component only adapts submission to the
  * AdminUI server action + router navigation, and adds the delete flow.
  */
-export function ItemFormClient({ listKey, urlKey, mode, fields, initialData = {}, itemId, basePath, serverAction, relationshipData = {}, }) {
+export function ItemFormClient({ listKey, urlKey, mode, fields, initialData = {}, itemId, basePath, serverAction, relationshipData = {}, canDelete = true, }) {
     const router = useRouter();
     const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
     // Separate transition for delete (not a form submit, so outside the engine).
@@ -70,5 +70,5 @@ export function ItemFormClient({ listKey, urlKey, mode, fields, initialData = {}
         });
     };
     const busy = isPending || isDeleting;
-    return (_jsxs("form", { onSubmit: handleSubmit, className: "space-y-6", children: [generalError && (_jsx("div", { className: "bg-destructive/10 border border-destructive text-destructive rounded-lg p-4", children: _jsx("p", { className: "text-sm font-medium", children: generalError }) })), _jsx("div", { className: "space-y-6", children: editableFields.map(([fieldName, fieldConfig]) => (_jsx(FieldRenderer, { fieldName: fieldName, fieldConfig: fieldConfig, value: formData[fieldName], onChange: (value) => handleFieldChange(fieldName, value), error: errors[fieldName], disabled: busy, mode: "edit", relationshipItems: relationshipData[fieldName] || [], relationshipLoading: false, basePath: basePath }, fieldName))) }), _jsxs("div", { className: "flex items-center justify-between pt-6 border-t border-border", children: [_jsxs("div", { className: "flex gap-3", children: [_jsxs(Button, { type: "submit", disabled: busy, className: "gap-2", children: [isPending && (_jsx(LoadingSpinner, { size: "sm", className: "border-primary-foreground border-t-transparent" })), isPending ? 'Saving...' : mode === 'create' ? 'Create' : 'Save'] }), _jsx(Button, { type: "button", variant: "secondary", onClick: () => router.push(`${basePath}/${urlKey}`), disabled: busy, children: "Cancel" })] }), mode === 'edit' && itemId && (_jsx(Button, { type: "button", variant: "destructive", onClick: () => setShowDeleteConfirm(true), disabled: busy, children: "Delete" }))] }), _jsx(ConfirmDialog, { isOpen: showDeleteConfirm, title: "Delete Item", message: "Are you sure you want to delete this item? This action cannot be undone.", confirmLabel: "Delete", cancelLabel: "Cancel", variant: "danger", onConfirm: handleDelete, onCancel: () => setShowDeleteConfirm(false) })] }));
+    return (_jsxs("form", { onSubmit: handleSubmit, className: "space-y-6", children: [generalError && (_jsx("div", { className: "bg-destructive/10 border border-destructive text-destructive rounded-lg p-4", children: _jsx("p", { className: "text-sm font-medium", children: generalError }) })), _jsx("div", { className: "space-y-6", children: editableFields.map(([fieldName, fieldConfig]) => (_jsx(FieldRenderer, { fieldName: fieldName, fieldConfig: fieldConfig, value: formData[fieldName], onChange: (value) => handleFieldChange(fieldName, value), error: errors[fieldName], disabled: busy, mode: "edit", relationshipItems: relationshipData[fieldName] || [], relationshipLoading: false, basePath: basePath }, fieldName))) }), _jsxs("div", { className: "flex items-center justify-between pt-6 border-t border-border", children: [_jsxs("div", { className: "flex gap-3", children: [_jsxs(Button, { type: "submit", disabled: busy, className: "gap-2", children: [isPending && (_jsx(LoadingSpinner, { size: "sm", className: "border-primary-foreground border-t-transparent" })), isPending ? 'Saving...' : mode === 'create' ? 'Create' : 'Save'] }), _jsx(Button, { type: "button", variant: "secondary", onClick: () => router.push(`${basePath}/${urlKey}`), disabled: busy, children: "Cancel" })] }), mode === 'edit' && itemId && canDelete && (_jsx(Button, { type: "button", variant: "destructive", onClick: () => setShowDeleteConfirm(true), disabled: busy, children: "Delete" }))] }), _jsx(ConfirmDialog, { isOpen: showDeleteConfirm, title: "Delete Item", message: "Are you sure you want to delete this item? This action cannot be undone.", confirmLabel: "Delete", cancelLabel: "Cancel", variant: "danger", onConfirm: handleDelete, onCancel: () => setShowDeleteConfirm(false) })] }));
 }

package/dist/components/ListView.d.ts

@@ -1,4 +1,12 @@
 import { type AccessContext, OpenSaasConfig } from '@opensaas/stack-core';
+/**
+ * Default sort for the list table, mirroring Keystone's `ui.listView.initialSort`.
+ * Plain serializable data so it can cross the server/client boundary.
+ */
+export interface ListViewSort {
+    field: string;
+    direction: 'asc' | 'desc';
+}
 export interface ListViewProps {
     context: AccessContext<unknown>;
     config: OpenSaasConfig;
@@ -8,10 +16,15 @@ export interface ListViewProps {
     page?: number;
     pageSize?: number;
     search?: string;
+    /**
+     * Default sort applied to the table (from the list's `ui.listView.initialSort`).
+     * When omitted, no default sort is applied.
+     */
+    initialSort?: ListViewSort;
 }
 /**
  * List view component - displays items in a table
  * Server Component that fetches data and renders client table
  */
-export declare function ListView({ context, config, listKey, basePath, columns, page, pageSize, search, }: ListViewProps): Promise<import("react/jsx-runtime").JSX.Element>;
+export declare function ListView({ context, config, listKey, basePath, columns, page, pageSize, search, initialSort, }: ListViewProps): Promise<import("react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=ListView.d.ts.map

package/dist/components/ListView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListView.d.ts","sourceRoot":"","sources":["../../src/components/ListView.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE9F,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC/B,MAAM,EAAE,cAAc,CAAA;IACtB,OAAO,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AAED;;;GAGG;AACH,wBAAsB,QAAQ,CAAC,EAC7B,OAAO,EACP,MAAM,EACN,OAAO,EACP,QAAmB,EACnB,OAAO,EACP,IAAQ,EACR,QAAa,EACb,MAAM,GACP,EAAE,aAAa,oDA6Hf"}
+{"version":3,"file":"ListView.d.ts","sourceRoot":"","sources":["../../src/components/ListView.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE9F;;;GAGG;AACH,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,KAAK,GAAG,MAAM,CAAA;CAC1B;AAED,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC/B,MAAM,EAAE,cAAc,CAAA;IACtB,OAAO,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,CAAA;CAC3B;AAED;;;GAGG;AACH,wBAAsB,QAAQ,CAAC,EAC7B,OAAO,EACP,MAAM,EACN,OAAO,EACP,QAAmB,EACnB,OAAO,EACP,IAAQ,EACR,QAAa,EACb,MAAM,EACN,WAAW,GACZ,EAAE,aAAa,oDA8Hf"}

package/dist/components/ListView.js

@@ -7,7 +7,7 @@ import { getDbKey, getUrlKey } from '@opensaas/stack-core';
  * List view component - displays items in a table
  * Server Component that fetches data and renders client table
  */
-export async function ListView({ context, config, listKey, basePath = '/admin', columns, page = 1, pageSize = 50, search, }) {
+export async function ListView({ context, config, listKey, basePath = '/admin', columns, page = 1, pageSize = 50, search, initialSort, }) {
     const key = getDbKey(listKey);
     const urlKey = getUrlKey(listKey);
     const listConfig = config.lists[listKey];
@@ -79,5 +79,5 @@ export async function ListView({ context, config, listKey, basePath = '/admin',
     return (_jsxs("div", { className: "p-8", children: [_jsxs("div", { className: "flex items-center justify-between mb-8", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-3xl font-bold mb-2", children: formatListName(listKey) }), _jsxs("p", { className: "text-muted-foreground", children: [total, " ", total === 1 ? 'item' : 'items'] })] }), _jsxs(Link, { href: `${basePath}/${urlKey}/create`, className: "inline-flex items-center px-4 py-2 bg-primary text-primary-foreground rounded-md font-medium hover:bg-primary/90 transition-colors", children: [_jsx("span", { className: "mr-2", children: "+" }), "Create ", formatListName(listKey)] })] }), _jsx(ListViewClient, { items: serializedItems || [], fieldTypes: Object.fromEntries(Object.entries(listConfig.fields).map(([key, field]) => [
                     key,
                     field.type,
-                ])), relationshipRefs: relationshipRefs, columns: columns, listKey: listKey, urlKey: urlKey, basePath: basePath, page: page, pageSize: pageSize, total: total || 0, search: search })] }));
+                ])), relationshipRefs: relationshipRefs, columns: columns, initialSort: initialSort, listKey: listKey, urlKey: urlKey, basePath: basePath, page: page, pageSize: pageSize, total: total || 0, search: search })] }));
 }