@fieldia/viewer 0.6.0 → 0.8.0

package/src/lib/related.mjs

@@ -0,0 +1,84 @@
+import { openFormDialog, openSearchDialog } from './dialog.mjs';
+/** The field a page's records are named by: its title, or "name", or its first line of text. */
+export function nameFieldOf(page) {
+    if (page.layout.type === 'sheet' && page.layout.title?.field)
+        return page.layout.title.field;
+    if (page.fields['name'])
+        return 'name';
+    return Object.entries(page.fields).find(([, def]) => def.type === 'char')?.[0] ?? null;
+}
+/** A form made of fields, for values edited in a dialog (a line, for one). */
+function valuesPage(fields, title, readonly) {
+    const shown = Object.fromEntries(Object.entries(fields).map(([name, def]) => [name, readonly ? { ...def, readonly: true } : def]));
+    return {
+        fieldia: '0.1',
+        id: 'values',
+        title,
+        data: { kind: 'record', model: 'values' },
+        fields: shown,
+        layout: {
+            type: 'sections',
+            id: 'values',
+            children: [{ type: 'section', id: 'values-section', columns: 2, children: Object.keys(shown).map((name) => ({ type: 'field', id: `values-${name}`, field: name })) }],
+        },
+    };
+}
+/** Only finding and making linked records: values edited in a dialog are no record of the source's to load, save or recalculate. */
+function lookupsOf(source) {
+    if (!source)
+        return undefined;
+    return {
+        ...(source.search ? { search: (request) => source.search(request) } : {}),
+        ...(source.create ? { create: (request) => source.create(request) } : {}),
+    };
+}
+/** The dialogs a page's widgets may open, made from the viewer's own options. */
+export function pageDialogs(options) {
+    const pageFor = (model) => (typeof options.relatedPages === 'function' ? options.relatedPages(model) : options.relatedPages?.[model]) ?? null;
+    // A dialog's page looks and reads like the page that opened it, and can open dialogs of its own.
+    const shared = {
+        locale: options.locale,
+        skin: options.skin,
+        dir: options.dir,
+        widgets: options.widgets,
+        preferences: options.preferences,
+        relatedPages: options.relatedPages,
+        translate: options.translate,
+    };
+    return {
+        canOpen: (model) => pageFor(model) !== null,
+        async openRecord(model, request) {
+            const related = pageFor(model);
+            if (!related)
+                return null;
+            const nameField = nameFieldOf(related);
+            const result = await openFormDialog({
+                ...shared,
+                page: related,
+                dataSource: options.dataSource,
+                recordId: request.recordId ?? null,
+                values: request.name && nameField ? { [nameField]: request.name } : undefined,
+                title: request.title,
+                size: 'large',
+            });
+            if (!result.saved || result.recordId === null)
+                return null;
+            const name = nameField ? result.values[nameField] : null;
+            return { id: result.recordId, label: typeof name === 'string' && name ? name : request.name ?? request.title };
+        },
+        searchMore: (request) => openSearchDialog({ title: request.title, search: request.search, locale: options.locale, skin: options.skin, dir: options.dir }),
+        async editValues(request) {
+            const result = await openFormDialog({
+                ...shared,
+                page: valuesPage(request.fields, request.title, request.readonly === true),
+                dataSource: lookupsOf(options.dataSource),
+                values: request.values,
+                title: request.title,
+                mode: 'values',
+                ...(request.recompute ? { recompute: request.recompute } : {}),
+            });
+            return result.saved ? result.values : null;
+        },
+    };
+}
+//# sourceMappingURL=related.mjs.map

package/src/lib/related.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"related.mjs","sourceRoot":"","sources":["../../../../../libs/viewer/src/lib/related.ts"],"names":[],"mappings":"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"}

package/src/lib/viewer.d.mts

@@ -1,37 +1,8 @@
 import { type Form, type FormOptions, type Page, type Locale } from '@fieldia/core';
 import { type IconSet, type PreferenceStore, type WidgetFactory } from '@fieldia/widgets';
 export type Skin = 'underline' | 'outlined';
-/** Every word the viewer shows, so a page can be translated. `{n}`, `{total}` and `{time}` are filled in. */
-export interface ViewerLabels {
-    save: string;
-    discard: string;
-    saving: string;
-    saved: string;
-    submit: string;
-    next: string;
-    back: string;
-    /** Passing over an optional step. */
-    skip: string;
-    /** The list of a wizard's steps, for screen readers. */
-    steps: string;
-    stepOf: string;
-    submitted: string;
-    submitAnother: string;
-    draftFound: string;
-    restore: string;
-    discardDraft: string;
-    ok: string;
-    cancel: string;
-    loading: string;
-    /** A form in a dialog: the button that saves it and closes the dialog, and the × that closes it. */
-    saveClose: string;
-    close: string;
-    /** The × on an alert that may be dismissed. */
-    dismiss: string;
-}
-export declare const VIEWER_LABELS: Record<Locale, ViewerLabels>;
-/** English, kept under its old name. */
-export declare const DEFAULT_LABELS: ViewerLabels;
+import { type ViewerLabels } from './labels.mjs';
+export { VIEWER_LABELS, DEFAULT_LABELS, type ViewerLabels } from './labels.mjs';
 /** Fill a slot with the app's own content. Return a function to clean up. */
 export type SlotRenderer = (element: HTMLElement, context: {
     form: Form;
@@ -66,6 +37,28 @@ export interface ViewerOptions extends Omit<FormOptions, 'page'> {
      * gives them: the inside of a 24×24 SVG, drawn with lines in the text colour.
      */
     icons?: IconSet;
+    /**
+     * Keys around the fields. Ctrl+Enter (Cmd+Enter on a Mac) saves, from
+     * wherever the cursor is, unless `saveWithCtrlEnter` is false. With
+     * `enterMovesToNext`, Enter moves to the next field instead of sending the form.
+     */
+    keys?: {
+        saveWithCtrlEnter?: boolean;
+        enterMovesToNext?: boolean;
+    };
+    /** A ✓ by a field's label once someone has filled it in and it would pass its checks. */
+    showValid?: boolean;
+    /** Where a save's progress shows: beside Save (the default), as a toast in a corner, or as a bar across the top. */
+    saveStatus?: 'inline' | 'toast' | 'bar';
+    /** Show the whole form read-only: every field locked, no Save. Buttons still run. */
+    readonly?: boolean;
+    /** An Edit button that unlocks a read-only form, and a Done that saves and locks it again. */
+    editSwitch?: boolean;
+    /**
+     * The app's own translator, for apps that keep translations by text or by
+     * key: every word of the page goes through it. Record data never does.
+     */
+    translate?: (text: string) => string;
 }
 export interface ViewerHandle {
     readonly form: Form;
@@ -75,6 +68,9 @@ export interface ViewerHandle {
     save(): Promise<boolean>;
     /** Check the form without saving, taking the focus to the first problem. */
     check(): boolean;
+    /** Lock or unlock the whole form. */
+    setReadonly(readonly: boolean): void;
+    isReadonly(): boolean;
     destroy(): void;
 }
 /**

package/src/lib/viewer.d.ts

@@ -1,37 +1,8 @@
 import { type Form, type FormOptions, type Page, type Locale } from '@fieldia/core';
 import { type IconSet, type PreferenceStore, type WidgetFactory } from '@fieldia/widgets';
 export type Skin = 'underline' | 'outlined';
-/** Every word the viewer shows, so a page can be translated. `{n}`, `{total}` and `{time}` are filled in. */
-export interface ViewerLabels {
-    save: string;
-    discard: string;
-    saving: string;
-    saved: string;
-    submit: string;
-    next: string;
-    back: string;
-    /** Passing over an optional step. */
-    skip: string;
-    /** The list of a wizard's steps, for screen readers. */
-    steps: string;
-    stepOf: string;
-    submitted: string;
-    submitAnother: string;
-    draftFound: string;
-    restore: string;
-    discardDraft: string;
-    ok: string;
-    cancel: string;
-    loading: string;
-    /** A form in a dialog: the button that saves it and closes the dialog, and the × that closes it. */
-    saveClose: string;
-    close: string;
-    /** The × on an alert that may be dismissed. */
-    dismiss: string;
-}
-export declare const VIEWER_LABELS: Record<Locale, ViewerLabels>;
-/** English, kept under its old name. */
-export declare const DEFAULT_LABELS: ViewerLabels;
+import { type ViewerLabels } from './labels';
+export { VIEWER_LABELS, DEFAULT_LABELS, type ViewerLabels } from './labels';
 /** Fill a slot with the app's own content. Return a function to clean up. */
 export type SlotRenderer = (element: HTMLElement, context: {
     form: Form;
@@ -66,6 +37,28 @@ export interface ViewerOptions extends Omit<FormOptions, 'page'> {
      * gives them: the inside of a 24×24 SVG, drawn with lines in the text colour.
      */
     icons?: IconSet;
+    /**
+     * Keys around the fields. Ctrl+Enter (Cmd+Enter on a Mac) saves, from
+     * wherever the cursor is, unless `saveWithCtrlEnter` is false. With
+     * `enterMovesToNext`, Enter moves to the next field instead of sending the form.
+     */
+    keys?: {
+        saveWithCtrlEnter?: boolean;
+        enterMovesToNext?: boolean;
+    };
+    /** A ✓ by a field's label once someone has filled it in and it would pass its checks. */
+    showValid?: boolean;
+    /** Where a save's progress shows: beside Save (the default), as a toast in a corner, or as a bar across the top. */
+    saveStatus?: 'inline' | 'toast' | 'bar';
+    /** Show the whole form read-only: every field locked, no Save. Buttons still run. */
+    readonly?: boolean;
+    /** An Edit button that unlocks a read-only form, and a Done that saves and locks it again. */
+    editSwitch?: boolean;
+    /**
+     * The app's own translator, for apps that keep translations by text or by
+     * key: every word of the page goes through it. Record data never does.
+     */
+    translate?: (text: string) => string;
 }
 export interface ViewerHandle {
     readonly form: Form;
@@ -75,6 +68,9 @@ export interface ViewerHandle {
     save(): Promise<boolean>;
     /** Check the form without saving, taking the focus to the first problem. */
     check(): boolean;
+    /** Lock or unlock the whole form. */
+    setReadonly(readonly: boolean): void;
+    isReadonly(): boolean;
     destroy(): void;
 }
 /**