firstly 0.6.2 → 0.7.0

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,7 @@ 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 { 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,7 @@ 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';
+// 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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "firstly",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "type": "module",
   "description": "Firstly, an opinionated Remult setup!",
   "funding": "https://github.com/sponsors/jycouet",
@@ -31,6 +31,7 @@
     }
   },
   "dependencies": {
+    "@kitql/helpers": "0.8.15",
     "@layerstack/utils": "1.0.0",
     "@mdi/js": "7.4.47",
     "@types/nodemailer": "8.0.0",
@@ -39,8 +40,8 @@
     "esm-env": "1.2.2",
     "nodemailer": "8.0.5",
     "svelte-sonner": "1.1.1",
-    "tailwind-merge": "3.5.0",
-    "tailwindcss": "4.2.2",
+    "tailwind-merge": "3.6.0",
+    "tailwindcss": "4.3.0",
     "vite-plugin-kit-routes": "1.0.6",
     "vite-plugin-stripper": "0.10.4"
   },

package/esm/svelte/DemoForm.svelte

@@ -1,121 +0,0 @@
-<script lang="ts" generics="T extends { id: string }">
-	import type { ClassType, EntityFilter } from 'remult'
-
-	import { ff } from './ff.svelte.js'
-
-	type Props = {
-		/** The remult entity class. */
-		entity: ClassType<T>
-		/** Fields to edit. Labels come from each field's `caption`. */
-		fields: (keyof T & string)[]
-		/** Which record (remult `EntityFilter`). Default: findFirst by `defaultOrderBy` (the latest). */
-		where?: EntityFilter<T>
-	}
-	let { entity, fields, where }: Props = $props()
-
-	// A single bound record: `where` (or findFirst by the entity's defaultOrderBy - the latest row).
-	const r = ff(entity).one(() => ({ where }))
-
-	const get = (row: T, f: keyof T & string) => (row as Record<string, unknown>)[f]
-	function setField(f: keyof T & string, value: string) {
-		if (r.item) (r.item as Record<string, unknown>)[f] = value
-	}
-</script>
-
-<div class="form">
-	{#if r.loading.init}
-		<p class="muted">Loading…</p>
-	{:else if r.item}
-		{#each fields as f (f)}
-			<label>
-				<span>{r.meta.fields.find(f)?.caption ?? f}</span>
-				<input
-					value={String(get(r.item, f) ?? '')}
-					oninput={(e) => setField(f, e.currentTarget.value)}
-				/>
-			</label>
-		{/each}
-		<div class="actions">
-			<button
-				disabled={r.isWriting ||
-					(r.item.id ? !r.meta.apiUpdateAllowed(r.item) : !r.meta.apiInsertAllowed(r.item))}
-				onclick={() => r.save()}
-			>
-				Save
-			</button>
-			{#if r.isWriting}<span class="busy">saving…</span>{/if}
-		</div>
-		{#if r.error}<p class="err">{r.error}</p>{/if}
-	{:else}
-		<p class="muted">No record yet.</p>
-		<button disabled={!r.meta.apiInsertAllowed()} onclick={() => r.create()}>+ New</button>
-	{/if}
-</div>
-
-<style>
-	.form {
-		display: flex;
-		flex-direction: column;
-		gap: 12px;
-		align-items: stretch;
-		font-size: 14px;
-	}
-	label {
-		display: flex;
-		flex-direction: column;
-		gap: 4px;
-	}
-	label span {
-		font-size: 12px;
-		opacity: 0.65;
-	}
-	input {
-		width: 100%;
-		box-sizing: border-box;
-		padding: 7px 10px;
-		font: inherit;
-		color: inherit;
-		background: transparent;
-		border: 1px solid color-mix(in srgb, currentColor 22%, transparent);
-		border-radius: 8px;
-	}
-	input:focus-visible {
-		outline: none;
-		border-color: color-mix(in srgb, currentColor 55%, transparent);
-	}
-	.actions {
-		display: flex;
-		gap: 10px;
-		align-items: center;
-	}
-	.busy {
-		color: #d97706;
-		font-weight: 600;
-		font-size: 12px;
-	}
-	.err {
-		color: #dc2626;
-		margin: 0;
-		font-size: 13px;
-	}
-	button {
-		cursor: pointer;
-		font: inherit;
-		padding: 6px 14px;
-		color: inherit;
-		background: color-mix(in srgb, currentColor 8%, transparent);
-		border: 1px solid color-mix(in srgb, currentColor 20%, transparent);
-		border-radius: 8px;
-		transition: background 0.14s ease;
-	}
-	button:hover {
-		background: color-mix(in srgb, currentColor 15%, transparent);
-	}
-	button:disabled {
-		opacity: 0.45;
-		cursor: not-allowed;
-	}
-	.muted {
-		opacity: 0.6;
-	}
-</style>

package/esm/svelte/DemoForm.svelte.d.ts

@@ -1,42 +0,0 @@
-import type { ClassType, EntityFilter } from 'remult';
-declare function $$render<T extends {
-    id: string;
-}>(): {
-    props: {
-        /** The remult entity class. */
-        entity: ClassType<T>;
-        /** Fields to edit. Labels come from each field's `caption`. */
-        fields: (keyof T & string)[];
-        /** Which record (remult `EntityFilter`). Default: findFirst by `defaultOrderBy` (the latest). */
-        where?: EntityFilter<T>;
-    };
-    exports: {};
-    bindings: "";
-    slots: {};
-    events: {};
-};
-declare class __sveltets_Render<T extends {
-    id: string;
-}> {
-    props(): ReturnType<typeof $$render<T>>['props'];
-    events(): ReturnType<typeof $$render<T>>['events'];
-    slots(): ReturnType<typeof $$render<T>>['slots'];
-    bindings(): "";
-    exports(): {};
-}
-interface $$IsomorphicComponent {
-    new <T extends {
-        id: string;
-    }>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
-        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
-    } & ReturnType<__sveltets_Render<T>['exports']>;
-    <T extends {
-        id: string;
-    }>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const DemoForm: $$IsomorphicComponent;
-type DemoForm<T extends {
-    id: string;
-}> = InstanceType<typeof DemoForm<T>>;
-export default DemoForm;