firstly 0.6.3 → 0.7.1

package/esm/svelte/grid/buildCells.js

@@ -0,0 +1,79 @@
+import { getInputType } from './cellConfig.js';
+import { getFieldMetaType } from './metaKind.js';
+const HIDE_BY_DEFAULT = new Set(['id', 'createdAt', 'updatedAt', 'deletedAt']);
+/** Default column set when `cells` is omitted: visible fields minus id/timestamps. */
+function defaultCells(meta) {
+    return meta.fields
+        .toArray()
+        .filter((f) => !HIDE_BY_DEFAULT.has(f.key) && !f.dbReadOnly && !f.isServerExpression)
+        .map((f) => f.key);
+}
+function alignFor(field, ui) {
+    if (ui.align)
+        return ui.align;
+    if (field?.inputType === 'number')
+        return 'right';
+    return 'left';
+}
+/** Resolve the render kind: explicit > href(field_link) > metaKind(relation/enum) > field. */
+function resolveKind(field, explicit) {
+    if (explicit)
+        return explicit;
+    if (!field)
+        return 'spacer';
+    if (field.options.href)
+        return 'field_link';
+    const mk = getFieldMetaType(field);
+    if (mk.kind === 'relation')
+        return 'relation';
+    if (mk.kind === 'enum')
+        return mk.subKind === 'multi' ? 'enum_multi' : 'enum';
+    return 'field';
+}
+/**
+ * Build headless cell descriptors from entity metadata.
+ * `cells` is a terse list of field keys and/or config objects; omit it to auto-build
+ * from visible fields. Per-cell config overrides the field's `ui` option (escape the SSoT).
+ */
+export function buildCells(meta, cells, opts) {
+    const input = cells ?? defaultCells(meta);
+    return input.map((item) => {
+        const isObj = typeof item === 'object';
+        const colRaw = isObj ? item.col : item;
+        const spacer = colRaw === '_spacer';
+        const field = !spacer
+            ? meta.fields.find(colRaw)
+            : undefined;
+        const fieldUI = field?.options.ui ?? {};
+        const ui = { ...fieldUI, ...(isObj ? item.ui : undefined) };
+        const kind = spacer ? 'spacer' : resolveKind(field, isObj ? item.kind : undefined);
+        // per-cell `sortable` wins; else the configured default (FF_Config / hub via opts), else on.
+        const sortable = isObj && item.sortable !== undefined ? item.sortable : (opts?.defaultSortable ?? true);
+        return {
+            col: spacer ? undefined : colRaw,
+            field,
+            kind,
+            caption: (isObj && item.caption) || field?.caption || '',
+            ui,
+            inputType: field ? getInputType(field, ui) : 'text',
+            align: alignFor(field, ui),
+            sortable,
+            class: isObj ? item.class : undefined,
+            cellSnippet: isObj ? item.cellSnippet : undefined,
+            component: isObj ? item.component : undefined,
+            props: isObj ? item.props : undefined,
+            rowToProps: isObj ? item.rowToProps : undefined,
+        };
+    });
+}
+/**
+ * Formatted display string for a cell + row. Uses remult `field.displayValue` (which already
+ * formats enums/dates/value-lists). Relations/multi-enum that need richer rendering should use
+ * a `cellSnippet` escape hatch (Stage 0 does not auto-resolve the related row's caption).
+ */
+export function displayCell(cell, row) {
+    if (!cell.field)
+        return '';
+    const v = cell.field.displayValue(row);
+    return v ?? '';
+}

package/esm/svelte/grid/cellComponent.d.ts

@@ -0,0 +1,9 @@
+import type { Component } from 'svelte';
+import type { CellComponent } from './cellTypes.js';
+/**
+ * Resolve a {@link CellComponent} thunk to a Component.
+ * - eager `() => Comp` → returns the Component **synchronously** (no render flash)
+ * - lazy `() => import('./X.svelte')` → returns a Promise (the module's `default` is unwrapped)
+ * Both are cached/deduped per thunk.
+ */
+export declare function resolveCellComponent(thunk: CellComponent): Component | Promise<Component>;

package/esm/svelte/grid/cellComponent.js

@@ -0,0 +1,31 @@
+// Cache resolved components (and in-flight loads) per thunk, so a lazy `() => import(...)` fires once
+// across every row/cell that shares it, and eager `() => Comp` thunks resolve synchronously.
+const resolved = new WeakMap();
+const loading = new WeakMap();
+/**
+ * Resolve a {@link CellComponent} thunk to a Component.
+ * - eager `() => Comp` → returns the Component **synchronously** (no render flash)
+ * - lazy `() => import('./X.svelte')` → returns a Promise (the module's `default` is unwrapped)
+ * Both are cached/deduped per thunk.
+ */
+export function resolveCellComponent(thunk) {
+    const hit = resolved.get(thunk);
+    if (hit)
+        return hit;
+    const inFlight = loading.get(thunk);
+    if (inFlight)
+        return inFlight;
+    const r = thunk();
+    if (r instanceof Promise) {
+        const p = r.then((m) => {
+            const c = (m && typeof m === 'object' && 'default' in m ? m.default : m);
+            resolved.set(thunk, c);
+            loading.delete(thunk);
+            return c;
+        });
+        loading.set(thunk, p);
+        return p;
+    }
+    resolved.set(thunk, r);
+    return r;
+}

package/esm/svelte/grid/cellConfig.d.ts

@@ -0,0 +1,13 @@
+import type { FieldMetadata } from 'remult';
+import type { CellConfig, CellElementConfig, CellUI } from './cellTypes.js';
+/** firstly's built-in geometry: label/error share a row, content + hint full width. */
+export declare const defaultConfig: CellConfig;
+/** Build an inline style string for one sub-element from its CellElementConfig. */
+export declare function getStyle(config: CellElementConfig): string;
+/**
+ * Resolve a sub-element's geometry: firstly default <- app-level FF_Config `cell.config`.
+ * MUST be called during component init (it reads context via `ffConfig()`).
+ */
+export declare function getCellElementConfig(element: keyof CellConfig): CellElementConfig;
+/** Resolved input type: merged `ui.inputType` > remult resolved `inputType` > 'text'. */
+export declare function getInputType(field: FieldMetadata, ui?: CellUI): string;

package/esm/svelte/grid/cellConfig.js

@@ -0,0 +1,48 @@
+import { ffConfig } from '../FF_Config.svelte.js';
+/** firstly's built-in geometry: label/error share a row, content + hint full width. */
+export const defaultConfig = {
+    label: { width: 50, order: 1, align: 'MiddleLeft' },
+    error: { width: 50, order: 2, align: 'MiddleRight' },
+    content: { width: 100, order: 3, align: 'MiddleLeft' },
+    hint: { width: 100, order: 4, align: 'MiddleLeft' },
+};
+/** Build an inline style string for one sub-element from its CellElementConfig. */
+export function getStyle(config) {
+    const justify = config.align?.includes('Left')
+        ? 'flex-start'
+        : config.align?.includes('Right')
+            ? 'flex-end'
+            : config.align?.includes('Center')
+                ? 'center'
+                : undefined;
+    const items = config.align?.includes('Top')
+        ? 'start'
+        : config.align?.includes('Bottom')
+            ? 'end'
+            : config.align?.includes('Middle') || config.align?.includes('Center')
+                ? 'center'
+                : undefined;
+    return [
+        config.width != null ? `width: ${config.width}%` : '',
+        config.width != null ? `flex: 0 0 ${config.width}%` : '',
+        config.order != null ? `order: ${config.order}` : '',
+        `display: flex`,
+        justify ? `justify-content: ${justify}` : '',
+        items ? `align-items: ${items}` : '',
+        config.style ?? '',
+    ]
+        .filter(Boolean)
+        .join('; ');
+}
+/**
+ * Resolve a sub-element's geometry: firstly default <- app-level FF_Config `cell.config`.
+ * MUST be called during component init (it reads context via `ffConfig()`).
+ */
+export function getCellElementConfig(element) {
+    const appConfig = ffConfig().cell?.config ?? {};
+    return { ...defaultConfig[element], ...appConfig[element] };
+}
+/** Resolved input type: merged `ui.inputType` > remult resolved `inputType` > 'text'. */
+export function getInputType(field, ui) {
+    return ui?.inputType ?? field.inputType ?? 'text';
+}

package/esm/svelte/grid/cellTypes.d.ts

@@ -0,0 +1,168 @@
+import type { Component, Snippet } from 'svelte';
+import type { ClassType, EntityFilter, EntityOrderBy, FieldMetadata } from 'remult';
+/**
+ * A component to render in a cell or as a form input. Always a THUNK, so an isomorphic entity `hub`
+ * never statically pulls UI into the server graph:
+ *   eager (in .svelte):  `() => Badge`
+ *   lazy  (server-safe): `() => import('./Badge.svelte')`
+ * The renderer resolves it once (cached) and unwraps a `{ default }` module.
+ */
+export type CellComponent = () => Component | Promise<Component> | Promise<{
+    default: Component;
+}>;
+/** Per-field UI hints. width/margins are PERCENTAGES of the parent row. */
+export interface CellUI {
+    /** Override the resolved input type ('text'|'number'|'date'|'checkbox'|'select'|'multiSelect'|...). */
+    inputType?: string;
+    width?: number;
+    marginLeft?: number;
+    marginRight?: number;
+    /** Independent geometry for screens <= 40rem. */
+    mobile?: {
+        width?: number;
+        marginLeft?: number;
+        marginRight?: number;
+    };
+    /** Column alignment in a grid. */
+    align?: 'left' | 'center' | 'right';
+    order?: number;
+}
+/** How a resolved cell renders. */
+export type MetaKind = 'field' | 'field_link' | 'relation' | 'enum' | 'enum_multi' | 'slot' | 'component' | 'header' | 'spacer';
+/** Resolved, headless cell descriptor consumed by FF_Grid / FF_Form. */
+export interface Cell<E = any> {
+    col?: keyof E & string;
+    field?: FieldMetadata<unknown, E>;
+    kind: MetaKind;
+    caption: string;
+    ui: CellUI;
+    /** Resolved input type for edit (getInputType). */
+    inputType: string;
+    align: 'left' | 'center' | 'right';
+    /** Whether this column is sortable by header click (resolved; opt in via `sortable: true`). */
+    sortable: boolean;
+    /** Tailwind/CSS passthrough (e.g. 'col-span-2'). */
+    class?: string;
+    cellSnippet?: Snippet<[{
+        row: E;
+        cell: Cell<E>;
+    }]>;
+    /** Render a component for this cell. Static `props` + per-row `rowToProps()` are merged into it. */
+    component?: CellComponent;
+    props?: Record<string, unknown>;
+    rowToProps?: (row: E) => Record<string, unknown>;
+}
+/** Terse author input: a bare field key, or a config object, or '_spacer'. */
+export type CellInput<E> = (keyof E & string) | {
+    col: (keyof E & string) | '_spacer';
+    kind?: MetaKind;
+    caption?: string;
+    ui?: CellUI;
+    align?: 'left' | 'center' | 'right';
+    class?: string;
+    /** Set true to make this column sortable by header click (default: not sortable). */
+    sortable?: boolean;
+    cellSnippet?: Snippet<[{
+        row: E;
+        cell: Cell<E>;
+    }]>;
+    /** Render a component for this cell (thunk). `props` + `rowToProps()` are merged into it. */
+    component?: CellComponent;
+    props?: Record<string, unknown>;
+    rowToProps?: (row: E) => Record<string, unknown>;
+};
+/** Geometry config for one of a cell's four sub-elements. */
+export interface CellElementConfig {
+    width?: number;
+    order?: number;
+    align?: 'TopLeft' | 'TopCenter' | 'TopRight' | 'MiddleLeft' | 'MiddleCenter' | 'MiddleRight' | 'BottomLeft' | 'BottomCenter' | 'BottomRight';
+    class?: string;
+    style?: string;
+}
+/** App-level default geometry for the label/error/content/hint sub-elements. */
+export interface CellConfig {
+    label?: CellElementConfig;
+    error?: CellElementConfig;
+    content?: CellElementConfig;
+    hint?: CellElementConfig;
+}
+declare module 'remult' {
+    interface FieldOptions<entityType, valueType> {
+        /** firstly cell UI hints (width %, inputType, mobile, align). */
+        ui?: CellUI;
+        /** Input placeholder. */
+        placeholder?: string;
+        /** For multiSelect value-lists: the element value-list class. */
+        valueTypeArray?: ClassType<valueType>;
+        /** When set, the field renders as a link (field_link kind). */
+        href?: (row: entityType) => string;
+    }
+}
+/** Per-action (create/edit/delete) config. Omit `cells` to inherit the list `cells`. */
+export interface ActionConfig<E = any> {
+    /** Fields shown in this action's form. Omit = inherit the list `cells`. */
+    cells?: CellInput<E>[];
+    /** Dialog title (e.g. from the row being edited). */
+    title?: (row: E) => string;
+    /** Override the action's button icon (mdi path string). */
+    icon?: string;
+    /** Escape: render a custom dialog component instead of the generated form. */
+    component?: CellComponent;
+    props?: Record<string, unknown>;
+    rowToProps?: (row: E) => Record<string, unknown>;
+}
+/**
+ * Entity-level grid/form config — the SSoT. Declared on the entity (`@FF_Entity('x', { hub: {...} })`)
+ * and read by FF_Grid / a boutique App_Grid as DEFAULTS; every prop overrides it. Keep it a plain,
+ * cheap object: `cells` (strings), `where`, `orderBy`, `sortable`, action toggles + `title` fns are all
+ * server-safe. Any UI `component` must be a lazy {@link CellComponent} thunk so the isomorphic entity
+ * file never statically pulls Svelte into the server graph.
+ */
+export interface HubConfig<E = any> {
+    /** Entity icon (mdi path string). */
+    icon?: string;
+    /** Grid columns + the default fields for the create/edit forms. */
+    cells?: CellInput<E>[];
+    /** Default for column sorting on this entity (a per-cell `sortable` overrides). Default true. */
+    defaultSortable?: boolean;
+    where?: EntityFilter<E>;
+    orderBy?: EntityOrderBy<E>;
+    strategy?: 'paginate' | 'listen' | 'load';
+    pageSize?: number;
+    /** Create action; `false` to disable. Omit = on, using the list `cells`. */
+    insert?: ActionConfig<E> | false;
+    /** Edit action; `false` to disable. */
+    update?: ActionConfig<E> | false;
+    /** Delete action; `false` to disable. */
+    delete?: ActionConfig<E> | false;
+}
+declare module 'remult' {
+    interface EntityOptions<entityType> {
+        /** firstly grid/form config — read as defaults by FF_Grid / App_Grid, overridable per call. */
+        hub?: HubConfig<entityType>;
+    }
+}
+export interface CellContentProps {
+    component?: Component;
+    componentReadonly?: Component;
+    props?: Record<string, unknown>;
+    children?: string | Component;
+    config?: CellElementConfig;
+}
+export interface CellElementProps {
+    html?: string;
+    config?: CellElementConfig;
+}
+/** Edit/readonly mode for a cell, group, or grid. Extensible — a future `'filter'` member (the cell
+ *  renders a filter input instead of a record input) slots in here. */
+export type CellMode = 'edit' | 'readonly';
+export type CellProps = {
+    key?: string;
+    mode?: CellMode;
+    label?: CellElementProps;
+    error?: CellElementProps;
+    hint?: CellElementProps;
+    content?: CellContentProps;
+    value?: unknown;
+    ui?: CellUI;
+};

package/esm/svelte/grid/cellTypes.js

@@ -0,0 +1 @@
+export {};

package/esm/svelte/grid/index.d.ts

@@ -0,0 +1,10 @@
+export { buildCells, displayCell } from './buildCells.js';
+export { resolveCellComponent } from './cellComponent.js';
+export { getFieldMetaType } from './metaKind.js';
+export { getStyle, getCellElementConfig, getInputType, defaultConfig } from './cellConfig.js';
+export type { Cell, CellInput, CellComponent, CellUI, MetaKind, CellConfig, CellElementConfig, CellProps, CellContentProps, CellElementProps, CellMode, HubConfig, ActionConfig, } from './cellTypes.js';
+export { default as FF_Cell } from './FF_Cell.svelte';
+export { default as FF_CellValue } from './FF_CellValue.svelte';
+export { default as GroupFields } from './GroupFields.svelte';
+export { default as DefaultInput } from './DefaultInput.svelte';
+export { default as FF_Grid } from './FF_Grid.svelte';

package/esm/svelte/grid/index.js

@@ -0,0 +1,12 @@
+export { buildCells, displayCell } from './buildCells.js';
+export { resolveCellComponent } from './cellComponent.js';
+export { getFieldMetaType } from './metaKind.js';
+export { getStyle, getCellElementConfig, getInputType, defaultConfig } from './cellConfig.js';
+export { default as FF_Cell } from './FF_Cell.svelte';
+export { default as FF_CellValue } from './FF_CellValue.svelte';
+export { default as GroupFields } from './GroupFields.svelte';
+export { default as DefaultInput } from './DefaultInput.svelte';
+// FF_Grid = the batteries-included demo grid (default skin + input). For a fully-owned grid, copy the
+// boutique App_Grid (src/boutique/grid) instead.
+export { default as FF_Grid } from './FF_Grid.svelte';
+// App_Grid / App_Group are the copy-own boutique shells (src/boutique/grid) — NOT published.

package/esm/svelte/grid/metaKind.d.ts

@@ -0,0 +1,27 @@
+import type { FieldMetadata, Repository } from 'remult';
+import type { BaseEnum } from '../../core/BaseEnum.js';
+export type FieldMetaType = {
+    kind: 'relation';
+    subKind: 'reference' | 'toOne' | 'toMany';
+    repoTarget: Repository<unknown>;
+    field: FieldMetadata;
+} | {
+    kind: 'enum';
+    subKind: 'single' | 'multi';
+    values: BaseEnum[];
+    field: FieldMetadata;
+} | {
+    kind: 'primitive';
+    subKind: string;
+    field: FieldMetadata;
+} | {
+    kind: 'slot';
+    subKind: 'unknown';
+};
+/**
+ * Derive a render "kind" from a remult FieldMetadata.
+ * Mirrors my-minion's old_ff getFieldMetaType (the renderer brain), minus the daisyUI bits.
+ * Note: value-lists are read off `options.valueConverter.values` directly - `getValueList(field)`
+ * throws "ValueType not yet initialized" here, so don't use it.
+ */
+export declare function getFieldMetaType(field?: FieldMetadata, withHidden?: boolean): FieldMetaType;

package/esm/svelte/grid/metaKind.js

@@ -0,0 +1,34 @@
+import { getRelationFieldInfo } from 'remult/internals';
+/**
+ * Derive a render "kind" from a remult FieldMetadata.
+ * Mirrors my-minion's old_ff getFieldMetaType (the renderer brain), minus the daisyUI bits.
+ * Note: value-lists are read off `options.valueConverter.values` directly - `getValueList(field)`
+ * throws "ValueType not yet initialized" here, so don't use it.
+ */
+export function getFieldMetaType(field, withHidden = false) {
+    if (field === undefined)
+        return { kind: 'slot', subKind: 'unknown' };
+    const rel = getRelationFieldInfo(field);
+    if (rel) {
+        return {
+            kind: 'relation',
+            subKind: rel.type,
+            repoTarget: rel.toRepo,
+            field,
+        };
+    }
+    const opts = field.options;
+    if (opts?.inputType === 'selectArrayEnum') {
+        return { kind: 'enum', subKind: 'multi', values: opts.valueConverter?.values ?? [], field };
+    }
+    if (opts?.valueConverter?.values) {
+        const values = opts.valueConverter.values;
+        return {
+            kind: 'enum',
+            subKind: 'single',
+            values: withHidden ? values : values.filter((v) => !v.hide),
+            field,
+        };
+    }
+    return { kind: 'primitive', subKind: field.inputType ?? 'text', field };
+}

package/esm/svelte/index.d.ts

@@ -1,3 +1,4 @@
+export { errorMessage, isError } from '../core/helper.js';
 export { ff } from './ff.svelte.js';
 export type { FF_Many, FF_One, FF_Builder, FF_RepoOptions, FF_OneOptions, FF_RepoLoading, FF_Issue, ManyStrategy, AggregateOptions, QueryOptionsHelper, } from './ff.svelte.js';
 export { infiniteScroll } from './infiniteScroll.js';
@@ -15,7 +16,8 @@ export { default as FF_ToastManager } from './FF_ToastManager.svelte';
 export { SP } from './class/SP.svelte';
 export type { ParamDefinition } from './class/SP.svelte';
 export { initRemultSvelteReactivity } from './initRemultSvelteReactivity';
-export { default as DemoGrid } from './DemoGrid.svelte';
-export { default as DemoForm } from './DemoForm.svelte';
+export { remultApiUniversalLoad } from './remultApiLoad.js';
+export { FF_Cell, FF_CellValue, FF_Grid, GroupFields, DefaultInput, buildCells, displayCell, resolveCellComponent, getFieldMetaType, getInputType, getStyle, getCellElementConfig, defaultConfig, } from './grid/index.js';
+export type { Cell, CellInput, CellComponent, CellUI, MetaKind, CellConfig, CellElementConfig, CellProps, CellContentProps, CellElementProps, CellMode, HubConfig, ActionConfig, } from './grid/index.js';
 export { default as Icon } from './ui/Icon.svelte';
 export { LibIcon_Empty, LibIcon_Forbidden, LibIcon_ChevronDown, LibIcon_ChevronUp, LibIcon_ChevronLeft, LibIcon_ChevronRight, LibIcon_Search, LibIcon_Check, LibIcon_MultiCheck, LibIcon_Add, LibIcon_MultiAdd, LibIcon_Edit, LibIcon_Eye, LibIcon_EyeOff, LibIcon_Delete, LibIcon_Cross, LibIcon_Save, LibIcon_Man, LibIcon_Woman, LibIcon_Send, LibIcon_Load, LibIcon_Settings, LibIcon_Sort, LibIcon_SortAsc, LibIcon_SortDesc, } from './ui/LibIcon.js';

package/esm/svelte/index.js

@@ -1,3 +1,4 @@
+export { errorMessage, isError } from '../core/helper.js';
 export { ff } from './ff.svelte.js';
 export { infiniteScroll } from './infiniteScroll.js';
 export { dialog, ffAutofocus, resolveMessage } from './dialog.svelte.js';
@@ -8,7 +9,8 @@ export { toast } from './toast.js';
 export { default as FF_ToastManager } from './FF_ToastManager.svelte';
 export { SP } from './class/SP.svelte';
 export { initRemultSvelteReactivity } from './initRemultSvelteReactivity';
-export { default as DemoGrid } from './DemoGrid.svelte';
-export { default as DemoForm } from './DemoForm.svelte';
+export { remultApiUniversalLoad } from './remultApiLoad.js';
+// Headless cell primitives (FF_Grid / FF_Group are boutique-only — copy from src/boutique/grid).
+export { FF_Cell, FF_CellValue, FF_Grid, GroupFields, DefaultInput, buildCells, displayCell, resolveCellComponent, getFieldMetaType, getInputType, getStyle, getCellElementConfig, defaultConfig, } from './grid/index.js';
 export { default as Icon } from './ui/Icon.svelte';
 export { LibIcon_Empty, LibIcon_Forbidden, LibIcon_ChevronDown, LibIcon_ChevronUp, LibIcon_ChevronLeft, LibIcon_ChevronRight, LibIcon_Search, LibIcon_Check, LibIcon_MultiCheck, LibIcon_Add, LibIcon_MultiAdd, LibIcon_Edit, LibIcon_Eye, LibIcon_EyeOff, LibIcon_Delete, LibIcon_Cross, LibIcon_Save, LibIcon_Man, LibIcon_Woman, LibIcon_Send, LibIcon_Load, LibIcon_Settings, LibIcon_Sort, LibIcon_SortAsc, LibIcon_SortDesc, } from './ui/LibIcon.js';

package/esm/svelte/remultApiLoad.d.ts

@@ -0,0 +1,19 @@
+import type { LoadEvent } from '@sveltejs/kit';
+/**
+ * Wrap a SvelteKit UNIVERSAL load (`+page.ts` / `+layout.ts`) so plain global
+ * `repo()` / `ff()` reads through the API (so `allowApiRead` / `apiPrefilter`
+ * apply), on both SSR and CSR.
+ *
+ * - SSR: runs the body in a nested `withRemult` bound to `event.fetch` - gated, and
+ *   scoped so a concurrent `+page.server.ts` keeps its own provider. SvelteKit
+ *   inlines the response. `remult.user` is carried in so the body can read it.
+ * - CSR / hydration: points the client `remult` at this page's `event.fetch` so the
+ *   inlined SSR response is reused, then runs the body.
+ *
+ * (A universal load runs on the client too, so it must use `event.fetch`. For a
+ * server-only load see `remultApiServerLoad` from `firstly/svelte/server`.)
+ *
+ * TODO(remult): the SSR branch is framework-agnostic (only needs `event.fetch`) -
+ * candidate to live in remult (e.g. `withRemultFetch(fetch, body)`).
+ */
+export declare function remultApiUniversalLoad<T>(body: (event: LoadEvent) => Promise<T>): (event: LoadEvent) => Promise<T>;

package/esm/svelte/remultApiLoad.js

@@ -0,0 +1,31 @@
+import { isBackend, remult, RestDataProvider, withRemult } from 'remult';
+/**
+ * Wrap a SvelteKit UNIVERSAL load (`+page.ts` / `+layout.ts`) so plain global
+ * `repo()` / `ff()` reads through the API (so `allowApiRead` / `apiPrefilter`
+ * apply), on both SSR and CSR.
+ *
+ * - SSR: runs the body in a nested `withRemult` bound to `event.fetch` - gated, and
+ *   scoped so a concurrent `+page.server.ts` keeps its own provider. SvelteKit
+ *   inlines the response. `remult.user` is carried in so the body can read it.
+ * - CSR / hydration: points the client `remult` at this page's `event.fetch` so the
+ *   inlined SSR response is reused, then runs the body.
+ *
+ * (A universal load runs on the client too, so it must use `event.fetch`. For a
+ * server-only load see `remultApiServerLoad` from `firstly/svelte/server`.)
+ *
+ * TODO(remult): the SSR branch is framework-agnostic (only needs `event.fetch`) -
+ * candidate to live in remult (e.g. `withRemultFetch(fetch, body)`).
+ */
+export function remultApiUniversalLoad(body) {
+    return (event) => {
+        if (!isBackend()) {
+            remult.apiClient.httpClient = event.fetch;
+            return body(event);
+        }
+        const user = remult.user;
+        return withRemult(async () => {
+            remult.user = user;
+            return body(event);
+        }, { dataProvider: new RestDataProvider(() => ({ httpClient: event.fetch })) });
+    };
+}

package/esm/svelte/server/index.d.ts

@@ -0,0 +1,12 @@
+import type { ServerLoadEvent } from '@sveltejs/kit';
+/**
+ * Wrap a SvelteKit SERVER load (`+page.server.ts`) so plain global `repo()` reads
+ * apply the API gate (as the current user) instead of the privileged in-process
+ * provider. Use it only when a server load should see exactly what the API exposes;
+ * otherwise a server load keeps the DB provider (gate rows with `backendPrefilter`).
+ * Gates direct `repo()` reads; BackendMethods keep their own `allowed` gate.
+ *
+ * TODO(remult): framework-agnostic (event passed through; provider read from
+ * `remult`) - candidate to live in remult directly.
+ */
+export declare function remultApiServerLoad<T>(body: (event: ServerLoadEvent) => Promise<T>): (event: ServerLoadEvent) => Promise<T>;

package/esm/svelte/server/index.js

@@ -0,0 +1,27 @@
+import { remult, withRemult } from 'remult';
+import { TestApiDataProvider } from 'remult/server';
+// SERVER-ONLY (imports `remult/server`). Never import from client-reachable code.
+// Lazily wrap the app's dataProvider once. TestApiDataProvider dispatches repo()
+// through the API pipeline in-process (so allowApiRead / apiPrefilter apply) and
+// carries the current user - no event.fetch, no `/api` round-trip.
+let apiDataProvider;
+/**
+ * Wrap a SvelteKit SERVER load (`+page.server.ts`) so plain global `repo()` reads
+ * apply the API gate (as the current user) instead of the privileged in-process
+ * provider. Use it only when a server load should see exactly what the API exposes;
+ * otherwise a server load keeps the DB provider (gate rows with `backendPrefilter`).
+ * Gates direct `repo()` reads; BackendMethods keep their own `allowed` gate.
+ *
+ * TODO(remult): framework-agnostic (event passed through; provider read from
+ * `remult`) - candidate to live in remult directly.
+ */
+export function remultApiServerLoad(body) {
+    return (event) => {
+        apiDataProvider ??= TestApiDataProvider({ dataProvider: remult.dataProvider });
+        const user = remult.user;
+        return withRemult(async () => {
+            remult.user = user;
+            return body(event);
+        }, { dataProvider: apiDataProvider });
+    };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "firstly",
-  "version": "0.6.3",
+  "version": "0.7.1",
   "type": "module",
   "description": "Firstly, an opinionated Remult setup!",
   "funding": "https://github.com/sponsors/jycouet",
@@ -41,7 +41,7 @@
     "nodemailer": "8.0.5",
     "svelte-sonner": "1.1.1",
     "tailwind-merge": "3.6.0",
-    "tailwindcss": "4.2.2",
+    "tailwindcss": "4.3.0",
     "vite-plugin-kit-routes": "1.0.6",
     "vite-plugin-stripper": "0.10.4"
   },
@@ -57,6 +57,10 @@
       "svelte": "./esm/svelte/index.js",
       "default": "./esm/svelte/index.js"
     },
+    "./svelte/server": {
+      "types": "./esm/svelte/server/index.d.ts",
+      "default": "./esm/svelte/server/index.js"
+    },
     "./vite": {
       "types": "./esm/vite/index.d.ts",
       "default": "./esm/vite/index.js"