shutro-erp 0.3.5 → 0.3.7

package/dist/ui/i18n/messages.js

@@ -3,6 +3,39 @@
  * Modules ship their own namespaces; labels from model metadata come translated by the server (`Accept-Language`).
  */
 export const en = {
+    explain: {
+        developerMode: 'Developer mode',
+        loading: 'Loading…',
+        unknown: 'Not a field of this model.',
+        yes: 'yes',
+        no: 'no',
+        label: 'Label',
+        field: 'Field',
+        model: 'Model',
+        type: 'Type',
+        relation: 'Relation',
+        ondelete: 'On delete',
+        required: 'Required',
+        readonly: 'Read-only',
+        stored: 'Stored',
+        computed: 'Computed from',
+        default: 'Default',
+        translated: 'Translated',
+        indexed: 'Indexed',
+        selection: 'Values',
+        module: 'Module',
+        button: 'Button',
+        states: 'States',
+        guard: 'Guard',
+        requires: 'Requires',
+        action: 'Action',
+        domain: 'Domain',
+        extendedBy: 'Extended by',
+        out_one: '{{count}} relation out',
+        out_other: '{{count}} relations out',
+        in_one: '{{count}} relation in',
+        in_other: '{{count}} relations in',
+    },
     app: {
         name: 'Shutro ERP',
         loading: 'Loading…',
@@ -48,6 +81,9 @@ export const en = {
         home: 'Home',
         appNamed: '{{app}} app',
         switchCompany: 'Company: {{name}} (switch)',
+        companyMenu: 'Company: {{name}}',
+        manageCompanies: 'Companies…',
+        addCompany: 'Add a company…',
         sidebar: 'Sidebar',
         collapseSidebar: 'Collapse the sidebar',
         expandSidebar: 'Expand the sidebar',
@@ -92,6 +128,7 @@ export const en = {
         exportFailed: 'The export failed: {{reason}}',
         columns: 'Columns',
         pinned: 'Pinned at the start',
+        pinColumn: 'Pin {{name}}',
         resetWidths: 'Reset column widths',
         resize: 'Resize {{column}}',
         density: 'Density',
@@ -123,6 +160,7 @@ export const en = {
         leaveConfirm: 'You have unsaved changes. Leave without saving?',
         transitionDone: '{{action}}: done',
         deleted: 'Deleted',
+        duplicated: 'Duplicated: this is the copy',
         breadcrumbs: 'Breadcrumbs',
         saving: 'Saving…',
         unsaved: 'Unsaved changes',
@@ -147,6 +185,8 @@ export const en = {
         discard: 'Discard',
         edit: 'Edit',
         delete: 'Delete',
+        duplicate: 'Duplicate',
+        actions: 'Actions',
         confirmDelete: 'Delete this record?',
         saved: 'Saved',
         total: 'Total',
@@ -333,6 +373,39 @@ export const en = {
     },
 };
 export const bn = {
+    explain: {
+        developerMode: 'ডেভেলপার মোড',
+        loading: 'লোড হচ্ছে…',
+        unknown: 'এই মডেলের ফিল্ড নয়।',
+        yes: 'হ্যাঁ',
+        no: 'না',
+        label: 'লেবেল',
+        field: 'ফিল্ড',
+        model: 'মডেল',
+        type: 'ধরন',
+        relation: 'সম্পর্ক',
+        ondelete: 'মুছলে',
+        required: 'আবশ্যক',
+        readonly: 'শুধু পড়া যায়',
+        stored: 'সংরক্ষিত',
+        computed: 'যা থেকে হিসাব হয়',
+        default: 'ডিফল্ট',
+        translated: 'অনূদিত',
+        indexed: 'ইনডেক্সড',
+        selection: 'মান',
+        module: 'মডিউল',
+        button: 'বাটন',
+        states: 'অবস্থা',
+        guard: 'শর্ত',
+        requires: 'প্রয়োজন',
+        action: 'অ্যাকশন',
+        domain: 'ডোমেইন',
+        extendedBy: 'যা বাড়িয়েছে',
+        out_one: '{{count}}টি বাইরের সম্পর্ক',
+        out_other: '{{count}}টি বাইরের সম্পর্ক',
+        in_one: '{{count}}টি ভেতরের সম্পর্ক',
+        in_other: '{{count}}টি ভেতরের সম্পর্ক',
+    },
     app: {
         name: 'কোষ',
         loading: 'লোড হচ্ছে…',
@@ -378,6 +451,9 @@ export const bn = {
         home: 'হোম',
         appNamed: '{{app}} অ্যাপ',
         switchCompany: 'প্রতিষ্ঠান: {{name}} (বদলান)',
+        companyMenu: 'প্রতিষ্ঠান: {{name}}',
+        manageCompanies: 'প্রতিষ্ঠানসমূহ…',
+        addCompany: 'প্রতিষ্ঠান যোগ করুন…',
         sidebar: 'সাইডবার',
         collapseSidebar: 'সাইডবার ছোট করুন',
         expandSidebar: 'সাইডবার বড় করুন',
@@ -422,6 +498,7 @@ export const bn = {
         exportFailed: 'এক্সপোর্ট ব্যর্থ: {{reason}}',
         columns: 'কলাম',
         pinned: 'শুরুতে আটকানো',
+        pinColumn: '{{name}} আটকান',
         resetWidths: 'কলামের প্রস্থ মুছুন',
         resize: '{{column}} প্রস্থ বদলান',
         density: 'ঘনত্ব',
@@ -453,6 +530,7 @@ export const bn = {
         leaveConfirm: 'পরিবর্তন সংরক্ষণ করা হয়নি। সংরক্ষণ না করেই চলে যাবেন?',
         transitionDone: '{{action}}: সম্পন্ন',
         deleted: 'মুছে ফেলা হয়েছে',
+        duplicated: 'অনুলিপি হয়েছে: এটি অনুলিপি',
         breadcrumbs: 'অবস্থান',
         saving: 'সংরক্ষণ হচ্ছে…',
         unsaved: 'অসংরক্ষিত পরিবর্তন',
@@ -477,6 +555,8 @@ export const bn = {
         discard: 'বাতিল',
         edit: 'সম্পাদনা',
         delete: 'মুছুন',
+        duplicate: 'অনুলিপি করুন',
+        actions: 'কাজ',
         confirmDelete: 'এই রেকর্ডটি মুছবেন?',
         saved: 'সংরক্ষিত',
         total: 'মোট',

package/dist/ui/index.d.ts

@@ -11,6 +11,7 @@ export { ApiError, type ApiOptions, type AppEntry, type CurrentUser, createKoshA
 export { KoshApp, type KoshAppProps, useLanguage } from './app.js';
 export { AppIcon } from './components/AppIcon.js';
 export * from './components/Avatar.js';
+export { Explain, type Explained, type ExplainedField, type ExplainTarget, useExplain, } from './components/Explain.js';
 export * from './components/primitives.js';
 export { type KoshContextValue, KoshProvider, type ThemeChoice, useKosh, useTheme, } from './context.js';
 export { type DesignContextValue, DesignProvider, type DesignSpot, useDesign, } from './design.js';
@@ -26,7 +27,7 @@ export { type Prefill, setPrefill, takePrefill } from './prefill.js';
 export { registerServiceWorker } from './pwa/register.js';
 export { serviceWorkerSource, type WorkerConfig } from './pwa/worker.js';
 export { type ChangeEvent, createRealtimeClient, type PresenceUser, type RealtimeClient, type RealtimeOptions, } from './realtime.js';
-export { type ChatterAssistProps, type CreateAssistProps, type FormProps, type HeaderItemProps, type NodeComponentProps, type PageProps, Registry, RegistryError, type SearchAssistProps, type ViewProps, type WidgetProps, } from './registry.js';
+export { type ChatterAssistProps, type CreateAssistProps, type FormProps, type HeaderItemProps, type NodeComponentProps, type PageProps, Registry, RegistryError, type SearchAssistProps, type SelectionActionProps, type ViewProps, type WidgetProps, } from './registry.js';
 export { SearchBar, type SearchBarProps } from './search/SearchBar.js';
 export { Login } from './shell/Login.js';
 export { FormView } from './views/FormView.js';

package/dist/ui/index.js

@@ -15,6 +15,7 @@ export { ApiError, createKoshApi, NetworkError, } from './api.js';
 export { KoshApp, useLanguage } from './app.js';
 export { AppIcon } from './components/AppIcon.js';
 export * from './components/Avatar.js';
+export { Explain, useExplain, } from './components/Explain.js';
 export * from './components/primitives.js';
 export { KoshProvider, useKosh, useTheme, } from './context.js';
 export { DesignProvider, useDesign, } from './design.js';

package/dist/ui/registry.d.ts

@@ -93,6 +93,14 @@ export interface CreateAssistProps {
     /** Opens a new record with these values, `proposed` marked as proposals. */
     readonly onCreate: (values: Readonly<Record<string, unknown>>, proposed: readonly string[]) => void;
 }
+/** Props of a selection action: a control in a list's bar of selected rows (Send by email). */
+export interface SelectionActionProps {
+    readonly api: KoshApi;
+    readonly model: string;
+    readonly ids: readonly number[];
+    /** Clears the selection, refreshes the list and says `message`. */
+    readonly done: (message: string, tone?: 'info' | 'danger') => void;
+}
 /** Props of a page: what a client action opens (`{ type: 'client', page: 'settings.Apps' }`). */
 export interface PageProps {
     readonly api: KoshApi;
@@ -177,6 +185,12 @@ export declare class Registry {
     }): this;
     /** The create assistants, in registration order. */
     createAssists(): readonly ComponentType<CreateAssistProps>[];
+    /** Controls in every list's bar of selected rows; each decides whether it applies to the model. */
+    registerSelectionAction(name: string, component: ComponentType<SelectionActionProps>, options?: {
+        readonly replace?: boolean;
+    }): this;
+    /** The selection actions, in registration order. */
+    selectionActions(): readonly ComponentType<SelectionActionProps>[];
     page(name: string): ComponentType<PageProps> | undefined;
     /** A copy, for an app that changes entries without touching the defaults. */
     clone(): Registry;

package/dist/ui/registry.js

@@ -16,6 +16,7 @@ export class Registry {
         searchAssist: new Map(),
         chatterAssist: new Map(),
         createAssist: new Map(),
+        selectionAction: new Map(),
     };
     #add(kind, name, component, replace) {
         if (this.#entries[kind].has(name) && !replace)
@@ -118,6 +119,14 @@ export class Registry {
     createAssists() {
         return [...this.#entries.createAssist.values()];
     }
+    /** Controls in every list's bar of selected rows; each decides whether it applies to the model. */
+    registerSelectionAction(name, component, options = {}) {
+        return this.#add('selectionAction', name, component, options.replace === true);
+    }
+    /** The selection actions, in registration order. */
+    selectionActions() {
+        return [...this.#entries.selectionAction.values()];
+    }
     page(name) {
         return this.#entries.page.get(name);
     }
@@ -133,6 +142,7 @@ export class Registry {
             'searchAssist',
             'chatterAssist',
             'createAssist',
+            'selectionAction',
         ])
             for (const [name, c] of this.#entries[kind])
                 copy.#entries[kind].set(name, c);

package/dist/ui/views/FormView.d.ts

@@ -1,3 +1,9 @@
+/**
+ * The form renderer (RFC 0007 §5): statusbar and transition buttons from the served view (only what the user may
+ * run, from the current state), groups, notebooks, editable lines, registered components (escape hatches), onchange
+ * assistance, and saves with compare-and-set (a record changed by someone else since it was opened is not
+ * overwritten: the user reloads). Conditions only decide display; the server re-checks every write.
+ */
 import { type ReactElement } from 'react';
 import type { FormProps } from '../registry.js';
 /** The default form renderer. */

package/dist/ui/views/FormView.js

@@ -5,18 +5,20 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * assistance, and saves with compare-and-set (a record changed by someone else since it was opened is not
  * overwritten: the user reloads). Conditions only decide display; the server re-checks every write.
  */
-import { evaluate, holds, } from '../../views/index.js';
+import { evaluate, holds, resolveRecord, } from '../../views/index.js';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import { useBlocker, useParams } from '@tanstack/react-router';
-import { ArrowLeft, Check, ChevronLeft, ChevronRight, CircleDot, MoreHorizontal, PanelRight, Plus, Trash2, } from 'lucide-react';
+import { useBlocker, useNavigate, useParams } from '@tanstack/react-router';
+import { ArrowLeft, Check, ChevronLeft, ChevronRight, CircleDot, Copy, MoreHorizontal, PanelRight, Plus, Trash2, } from 'lucide-react';
 import { useEffect, useId, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { ApiError, NetworkError, } from '../api.js';
+import { Explain } from '../components/Explain.js';
 import { Alert, Button, Dialog, Label, Menu, MenuContent, MenuItem, MenuTrigger, Spinner, Tabs, TabsContent, TabsList, TabsTrigger, } from '../components/primitives.js';
 import { useKosh } from '../context.js';
 import { useDesign } from '../design.js';
 import { cn } from '../lib/cn.js';
 import { useLiveRecord } from '../live.js';
+import { setPrefill } from '../prefill.js';
 import { useToast } from '../shell/toast.js';
 import { StatsRow } from './StatsRow.js';
 import { StatusChip } from './StatusChip.js';
@@ -128,7 +130,7 @@ lineFields) {
     return out;
 }
 function Lines({ node, served, ids, readonly, state, onState, }) {
-    const { api, registry } = useKosh();
+    const { api, registry, uid, companyId } = useKosh();
     const { t } = useTranslation();
     const field = served.fields[served.view.model]?.[node.field];
     const target = field?.target ?? '';
@@ -157,7 +159,9 @@ function Lines({ node, served, ids, readonly, state, onState, }) {
     return (_jsx(PrefetchedNames.Provider, { value: names, children: _jsxs("div", { className: "col-span-full overflow-x-auto", children: [_jsxs("table", { className: "w-full text-sm", children: [_jsx("caption", { className: "sr-only", children: node.id }), _jsx("thead", { children: _jsxs("tr", { className: "border-b", children: [columns.map((c) => (_jsx("th", { scope: "col", className: "px-2 py-1.5 text-start font-medium text-muted-foreground", children: c.label ?? columnFields[c.field]?.label ?? c.field }, c.id))), _jsx("th", { className: "w-10", children: _jsx("span", { className: "sr-only", children: t('views.removeLine') }) })] }) }), _jsx("tbody", { children: rows.map((row, index) => (_jsxs("tr", { className: "border-b", children: [columns.map((c) => {
                                         const meta = columnFields[c.field];
                                         const Widget = registry.widget(c, meta);
-                                        return (_jsx("td", { className: "px-2 py-1", children: _jsx(Widget, { id: `${row.key}-${c.id}`, node: c, field: meta, value: row.values[c.field], record: row.values, readonly: readonly || meta.readonly, onChange: (value) => set(rows.map((r, i) => i === index
+                                        return (_jsx("td", { className: "px-2 py-1", children: _jsx(Widget, { id: `${row.key}-${c.id}`, node: c, field: meta, value: row.values[c.field], record: row.values, readonly: readonly ||
+                                                    meta.readonly ||
+                                                    holds(c.readonlyWhen, row.values, { uid, companyId }), onChange: (value) => set(rows.map((r, i) => i === index
                                                     ? {
                                                         ...r,
                                                         values: { ...r.values, [c.field]: value },
@@ -186,6 +190,7 @@ export function FormView({ served, recordId, defaults, onSaved, onBack, crumbs,
     const design = useDesign();
     const toast = useToast();
     const queryClient = useQueryClient();
+    const navigateTo = useNavigate();
     const formId = useId();
     const [railOpen, setRailOpen] = useRail();
     const route = useParams({ strict: false });
@@ -378,6 +383,16 @@ export function FormView({ served, recordId, defaults, onSaved, onBack, crumbs,
         },
         onError: fail,
     });
+    // Duplicate (RFC 0023 R1): a copy made by the server as the user; the form opens it.
+    const duplicate = useMutation({
+        mutationFn: () => api.call('POST', `/api/v1/models/${model}/${String(recordId)}/duplicate`, {}),
+        onSuccess: async (copy) => {
+            await queryClient.invalidateQueries({ queryKey: ['list', model] });
+            toast({ title: t('views.duplicated') });
+            onSaved(copy.id);
+        },
+        onError: fail,
+    });
     const remove = useMutation({
         mutationFn: () => api.remove(model, recordId),
         onSuccess: async () => {
@@ -445,7 +460,7 @@ export function FormView({ served, recordId, defaults, onSaved, onBack, crumbs,
         const readonly = locked || field.readonly || holds(node.readonlyWhen, values, env);
         const id = `${formId}-${node.id}`;
         const invalid = problem?.problem.detail.includes(node.field) === true;
-        return (_jsxs("div", { className: cn('grid gap-1', (field.kind === 'text' || field.kind === 'html') && 'col-span-full'), children: [_jsxs(Label, { htmlFor: id, children: [node.label ?? field.label, (field.required || holds(node.requiredWhen, values, env)) && !readonly ? (_jsxs("span", { "aria-hidden": true, className: "text-danger", children: [' ', "*"] })) : null, recordId === 'new' && proposed?.includes(node.field) === true ? (_jsx("span", { className: "ms-2 rounded bg-accent px-1.5 py-0.5 text-[10px] font-medium text-accent-foreground", children: t('views.proposed') })) : null] }), _jsx("div", { className: "min-h-9 py-1.5 text-sm", children: _jsx(Widget, { id: id, node: node, field: field, value: values[node.field], record: values, model: model, readonly: readonly, onChange: (v) => change(node.field, v), invalid: invalid }) }), (node.help ?? field.help) === undefined ? null : (_jsx("p", { className: "text-xs text-muted-foreground", children: node.help ?? field.help }))] }, node.id));
+        return (_jsxs("div", { className: cn('grid gap-1', (field.kind === 'text' || field.kind === 'html') && 'col-span-full'), children: [_jsxs(Label, { htmlFor: id, children: [_jsx(Explain, { model: model, target: { field: node.field }, children: node.label ?? field.label }), (field.required || holds(node.requiredWhen, values, env)) && !readonly ? (_jsxs("span", { "aria-hidden": true, className: "text-danger", children: [' ', "*"] })) : null, recordId === 'new' && proposed?.includes(node.field) === true ? (_jsx("span", { className: "ms-2 rounded bg-accent px-1.5 py-0.5 text-[10px] font-medium text-accent-foreground", children: t('views.proposed') })) : null] }), _jsx("div", { className: "min-h-9 py-1.5 text-sm", children: _jsx(Widget, { id: id, node: node, field: field, value: values[node.field], record: values, model: model, readonly: readonly, onChange: (v) => change(node.field, v), invalid: invalid }) }), (node.help ?? field.help) === undefined ? null : (_jsx("p", { className: "text-xs text-muted-foreground", children: node.help ?? field.help }))] }, node.id));
     };
     const renderNodes = (nodes) => nodes.map((node) => {
         switch (node.kind) {
@@ -516,9 +531,27 @@ export function FormView({ served, recordId, defaults, onSaved, onBack, crumbs,
                 (v === null || v === undefined || v === '' || (Array.isArray(v) && v.length === 0)));
         })
             .map((n) => n.field);
+    // A button that opens a new record of another model, filled from this one (RFC 0028 §3.4).
+    const openNew = (open) => {
+        void api.routes().then((routes) => {
+            const route = routes[open.model];
+            const action = open.action ?? route?.action;
+            if (action === undefined || route?.app === undefined)
+                return;
+            const filled = resolveRecord(open.values, values);
+            setPrefill(action, { values: filled, proposed: [] });
+            void navigateTo({
+                to: '/$app/a/$action/$id',
+                params: { app: route.app, action, id: 'new' },
+            });
+        });
+    };
     // RFC 0022 §3.5: the record's document templates as a Print menu, when reporting's web is registered.
     const Print = registry.component('reporting.Documents');
+    const Send = registry.component('mail.Send');
     const buttons = view.header.buttons.filter((b) => {
+        if (b.open !== undefined)
+            return !isNew && visible(b.visibleWhen);
         const spec = served.transitions.find((tr) => tr.name === b.transition);
         return (!isNew &&
             spec !== undefined &&
@@ -598,7 +631,7 @@ export function FormView({ served, recordId, defaults, onSaved, onBack, crumbs,
                     e.preventDefault();
                     if (dirty && !locked)
                         save.mutate();
-                }, children: [_jsxs("div", { className: "sticky top-12 z-20 -mx-4 flex flex-wrap items-center justify-between gap-2 border-b bg-background/95 px-4 py-2 backdrop-blur", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": t('views.back'), "data-kosh-back": true, onClick: onBack, children: _jsx(ArrowLeft, { className: "rtl:-scale-x-100", "aria-hidden": true }) }), _jsxs("div", { className: "min-w-0", children: [_jsxs("div", { className: "flex min-w-0 flex-wrap items-center gap-2.5", children: [_jsx("h1", { className: "truncate text-xl font-semibold", children: title }), statusbar === undefined || fields[statusbar] === undefined || isNew ? null : (_jsx(StatusChip, { field: fields[statusbar], value: state, transitions: served.transitions.filter((tr) => tr.field === statusbar) })), locked && !isNew ? (_jsx("span", { className: "rounded-full border px-2 py-0.5 text-xs text-muted-foreground", children: t('views.readonly') })) : null] }), facts.length === 0 ? null : (_jsx("p", { className: "mt-0.5 flex flex-wrap items-center gap-x-2 text-sm text-muted-foreground", children: facts.map((node, i) => {
+                }, children: [_jsxs("div", { className: "sticky top-12 z-20 -mx-4 flex flex-wrap items-center justify-between gap-2 border-b bg-background/95 px-4 py-2 backdrop-blur", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": t('views.back'), "data-kosh-back": true, onClick: onBack, children: _jsx(ArrowLeft, { className: "rtl:-scale-x-100", "aria-hidden": true }) }), _jsxs("div", { className: "min-w-0", children: [_jsxs("div", { className: "flex min-w-0 flex-wrap items-center gap-2.5", children: [_jsx("h1", { className: "truncate text-xl font-semibold", children: _jsx(Explain, { model: model, target: { model: true }, children: title }) }), statusbar === undefined || fields[statusbar] === undefined || isNew ? null : (_jsx(StatusChip, { field: fields[statusbar], value: state, transitions: served.transitions.filter((tr) => tr.field === statusbar) })), locked && !isNew ? (_jsx("span", { className: "rounded-full border px-2 py-0.5 text-xs text-muted-foreground", children: t('views.readonly') })) : null] }), facts.length === 0 ? null : (_jsx("p", { className: "mt-0.5 flex flex-wrap items-center gap-x-2 text-sm text-muted-foreground", children: facts.map((node, i) => {
                                                     const field = fields[node.field];
                                                     const Widget = registry.widget(node, field);
                                                     return (_jsxs("span", { className: "flex items-center gap-2", title: field.label, children: [i === 0 ? null : _jsx("span", { "aria-hidden": true, children: "\u00B7" }), _jsxs("span", { className: "sr-only", children: [field.label, ": "] }), _jsx(Widget, { id: `${formId}-fact-${node.id}`, node: node, field: field, value: values[node.field], record: values, readonly: true })] }, node.id));
@@ -612,7 +645,7 @@ export function FormView({ served, recordId, defaults, onSaved, onBack, crumbs,
                                                     setChanges({});
                                                     setLines(new Map());
                                                     setProblem(null);
-                                                }, children: t('views.discard') }), _jsx(Button, { type: "submit", variant: "primary", busy: save.isPending, "data-kosh-save": true, children: t('views.save') })] })) : null, _jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "hidden xl:inline-flex", "aria-pressed": railOpen, "aria-label": railOpen ? t('views.hidePanel') : t('views.showPanel'), title: railOpen ? t('views.hidePanel') : t('views.showPanel'), onClick: () => setRailOpen(!railOpen), children: _jsx(PanelRight, { className: "rtl:-scale-x-100", "aria-hidden": true }) }), !isNew && served.operations.unlink ? (_jsxs(Menu, { children: [_jsx(MenuTrigger, { asChild: true, children: _jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": "Actions", children: _jsx(MoreHorizontal, { "aria-hidden": true }) }) }), _jsx(MenuContent, { children: _jsxs(MenuItem, { onSelect: () => setDeleting(true), children: [_jsx(Trash2, { className: "size-4", "aria-hidden": true }), t('views.delete')] }) })] })) : null] })] }), _jsxs("div", { className: cn('grid gap-4', showRail && 'xl:grid-cols-[minmax(0,1fr)_20rem] xl:items-start'), children: [_jsxs("div", { className: "grid min-w-0 content-start gap-4", children: [live.changedByOther ? (_jsx(Alert, { tone: "warning", action: _jsx(Button, { type: "button", size: "sm", onClick: () => {
+                                                }, children: t('views.discard') }), _jsx(Button, { type: "submit", variant: "primary", busy: save.isPending, "data-kosh-save": true, children: t('views.save') })] })) : null, _jsx(Button, { type: "button", variant: "ghost", size: "icon", className: "hidden xl:inline-flex", "aria-pressed": railOpen, "aria-label": railOpen ? t('views.hidePanel') : t('views.showPanel'), title: railOpen ? t('views.hidePanel') : t('views.showPanel'), onClick: () => setRailOpen(!railOpen), children: _jsx(PanelRight, { className: "rtl:-scale-x-100", "aria-hidden": true }) }), !isNew && (served.operations.unlink || served.operations.create) ? (_jsxs(Menu, { children: [_jsx(MenuTrigger, { asChild: true, children: _jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": t('views.actions'), children: _jsx(MoreHorizontal, { "aria-hidden": true }) }) }), _jsxs(MenuContent, { children: [served.operations.create ? (_jsxs(MenuItem, { disabled: duplicate.isPending, onSelect: () => duplicate.mutate(), children: [_jsx(Copy, { className: "size-4", "aria-hidden": true }), t('views.duplicate')] })) : null, served.operations.unlink ? (_jsxs(MenuItem, { onSelect: () => setDeleting(true), children: [_jsx(Trash2, { className: "size-4", "aria-hidden": true }), t('views.delete')] })) : null] })] })) : null] })] }), _jsxs("div", { className: cn('grid gap-4', showRail && 'xl:grid-cols-[minmax(0,1fr)_20rem] xl:items-start'), children: [_jsxs("div", { className: "grid min-w-0 content-start gap-4", children: [live.changedByOther ? (_jsx(Alert, { tone: "warning", action: _jsx(Button, { type: "button", size: "sm", onClick: () => {
                                                 setChanges({});
                                                 setLines(new Map());
                                                 live.dismiss();
@@ -623,12 +656,18 @@ export function FormView({ served, recordId, defaults, onSaved, onBack, crumbs,
                                                 void loaded.refetch();
                                             }, children: t('views.reload') })) : undefined, children: problem.kind === 'stale-record' ? t('views.stale') : problem.message })), warnings.map((w) => (_jsx(Alert, { tone: "info", children: w }, w))), nextStep === undefined || nextButton === undefined || locked ? null : (_jsx(Alert, { tone: nextStep.allowed ? 'info' : 'warning', children: nextStep.allowed
                                             ? t('views.nextStep.ready', { step: nextButton.label ?? nextButton.transition })
-                                            : `${t('views.nextStep.before', { step: nextButton.label ?? nextButton.transition })} ${nextStep.message ?? ''}`.trim() })), buttons.length === 0 && (isNew || Print === undefined) ? null : (_jsxs("div", { role: "toolbar", "aria-label": t('views.recordActions'), className: "flex flex-wrap gap-2", children: [isNew || Print === undefined ? null : (_jsx(Print, { node: { kind: 'component', id: 'print', component: 'reporting.Documents' }, record: record ?? null, model: model, served: served, api: api, version: loaded.data?.etag ?? null, reload: () => void loaded.refetch() })), _jsx("div", { className: "contents", children: buttons.map((b, i) => (_jsx(Button, { type: "button", size: "sm", variant: b.primary === true || (i === 0 && !buttons.some((x) => x.primary === true))
-                                                        ? 'primary'
-                                                        : 'secondary', busy: transition.isPending && transition.variables === b.transition, onClick: () => b.confirm === undefined ? transition.mutate(b.transition) : setConfirming(b), children: b.label ?? b.transition }, b.id))) })] })), sections.map((section) => section.nodes[0]?.kind === 'stats' ? (_jsx("div", { className: "grid", children: renderNodes(section.nodes) }, section.key)) : (_jsx("section", { className: "rounded-lg border bg-surface p-5", children: _jsx("div", { className: "grid gap-x-6 gap-y-4 sm:grid-cols-2", children: renderNodes(section.nodes) }) }, section.key))), showRail ? null : rail] }), showRail ? (_jsx("aside", { "aria-label": t('views.recordPanel'), 
+                                            : `${t('views.nextStep.before', { step: nextButton.label ?? nextButton.transition })} ${nextStep.message ?? ''}`.trim() })), buttons.length === 0 &&
+                                        (isNew || (Print === undefined && Send === undefined)) ? null : (_jsxs("div", { role: "toolbar", "aria-label": t('views.recordActions'), className: "flex flex-wrap gap-2", children: [isNew || Print === undefined ? null : (_jsx(Print, { node: { kind: 'component', id: 'print', component: 'reporting.Documents' }, record: record ?? null, model: model, served: served, api: api, version: loaded.data?.etag ?? null, reload: () => void loaded.refetch() })), isNew || Send === undefined ? null : (_jsx(Send, { node: { kind: 'component', id: 'send', component: 'mail.Send' }, record: record ?? null, model: model, served: served, api: api, version: loaded.data?.etag ?? null, reload: () => void loaded.refetch() })), _jsx("div", { className: "contents", children: buttons.map((b, i) => (_jsx(Explain, { model: model, asChild: true, target: b.transition === undefined ? { action: b.id } : { transition: b.transition }, children: _jsx(Button, { type: "button", size: "sm", variant: b.primary === true ||
+                                                            (i === 0 && !buttons.some((x) => x.primary === true))
+                                                            ? 'primary'
+                                                            : 'secondary', busy: transition.isPending && transition.variables === b.transition, onClick: () => b.open !== undefined
+                                                            ? openNew(b.open)
+                                                            : b.confirm === undefined
+                                                                ? transition.mutate(b.transition ?? '')
+                                                                : setConfirming(b), children: b.label ?? b.transition ?? b.id }) }, b.id))) })] })), sections.map((section) => section.nodes[0]?.kind === 'stats' ? (_jsx("div", { className: "grid", children: renderNodes(section.nodes) }, section.key)) : (_jsx("section", { className: "rounded-lg border bg-surface p-5", children: _jsx("div", { className: "grid gap-x-6 gap-y-4 sm:grid-cols-2", children: renderNodes(section.nodes) }) }, section.key))), showRail ? null : rail] }), showRail ? (_jsx("aside", { "aria-label": t('views.recordPanel'), 
                                 // Beside the record when wide; under it otherwise (one grid column).
                                 className: "grid content-start gap-4 xl:sticky xl:top-28", children: rail })) : null] })] }), _jsx(Dialog, { open: confirming !== null, onOpenChange: (open) => !open && setConfirming(null), title: confirming?.label ?? confirming?.transition ?? '', description: confirming?.confirm ?? '', footer: _jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => setConfirming(null), children: t('views.no') }), _jsx(Button, { variant: "primary", onClick: () => {
-                                if (confirming !== null)
+                                if (confirming?.transition !== undefined)
                                     transition.mutate(confirming.transition);
                                 setConfirming(null);
                             }, children: t('views.yes') })] }) }), _jsx(Dialog, { open: deleting, onOpenChange: setDeleting, title: t('views.confirmDelete'), footer: _jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => setDeleting(false), children: t('views.no') }), _jsx(Button, { variant: "danger", busy: remove.isPending, onClick: () => remove.mutate(), children: t('views.delete') })] }) })] }));

package/dist/ui/views/KanbanView.js

@@ -56,6 +56,14 @@ function Card({ row, served, onOpen, }) {
     if (view.type !== 'kanban')
         throw new Error('kanban');
     const fields = served.fields[view.model] ?? {};
+    // A number, or a decimal's string ("75.0").
+    const rawProgress = view.card.progress === undefined ? undefined : row[view.card.progress];
+    const progressValue = typeof rawProgress === 'number' || (typeof rawProgress === 'string' && rawProgress !== '')
+        ? Number(rawProgress)
+        : Number.NaN;
+    const progress = Number.isFinite(progressValue)
+        ? Math.max(0, Math.min(100, progressValue))
+        : null;
     const show = (node) => {
         const field = fields[node.field];
         if (field === undefined)
@@ -81,7 +89,7 @@ function Card({ row, served, onOpen, }) {
                             : nameOfValue(row[view.card.avatar])) ?? ''), src: fields[view.card.avatar]?.target === 'storage.attachment' &&
                             idOfValue(row[view.card.avatar]) !== null
                             ? `/api/v1/attachments/${idOfValue(row[view.card.avatar])}/download?inline=true&w=256`
-                            : null, className: "mt-0.5" })), _jsx("button", { type: "button", className: "text-start font-medium hover:underline", onClick: () => onOpen(row.id), children: text(view.card.title) }), _jsx("button", { type: "button", className: "cursor-grab rounded px-1 text-muted-foreground hover:bg-muted", "aria-label": `Move ${String(row['displayName'] ?? row[view.card.title] ?? row.id)}`, ...attributes, ...listeners, children: "\u283F" })] }), view.card.subtitle === undefined ? null : (_jsx("div", { className: "text-muted-foreground", children: text(view.card.subtitle) })), (view.card.badges ?? []).length === 0 ? null : (_jsx("div", { className: "mt-2 flex flex-wrap gap-1", children: (view.card.badges ?? []).map(show) })), (view.card.footer ?? []).length === 0 ? null : (_jsx("div", { className: "mt-2 flex flex-wrap justify-between gap-2 text-xs text-muted-foreground", children: (view.card.footer ?? []).map(show) })), view.card.progress === undefined || typeof row[view.card.progress] !== 'number' ? null : (_jsx("div", { role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": row[view.card.progress], className: "mt-2 h-1.5 w-full overflow-hidden rounded-full bg-muted", children: _jsx("div", { className: "h-full rounded-full bg-primary", style: { width: `${Math.max(0, Math.min(100, row[view.card.progress]))}%` } }) }))] }));
+                            : null, className: "mt-0.5" })), _jsx("button", { type: "button", className: "text-start font-medium hover:underline", onClick: () => onOpen(row.id), children: text(view.card.title) }), _jsx("button", { type: "button", className: "cursor-grab rounded px-1 text-muted-foreground hover:bg-muted", "aria-label": `Move ${String(row['displayName'] ?? row[view.card.title] ?? row.id)}`, ...attributes, ...listeners, children: "\u283F" })] }), view.card.subtitle === undefined ? null : (_jsx("div", { className: "text-muted-foreground", children: text(view.card.subtitle) })), (view.card.badges ?? []).length === 0 ? null : (_jsx("div", { className: "mt-2 flex flex-wrap gap-1", children: (view.card.badges ?? []).map(show) })), (view.card.footer ?? []).length === 0 ? null : (_jsx("div", { className: "mt-2 flex flex-wrap justify-between gap-2 text-xs text-muted-foreground", children: (view.card.footer ?? []).map(show) })), progress === null ? null : (_jsx("div", { role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": progress, className: "mt-2 h-1.5 w-full overflow-hidden rounded-full bg-muted", children: _jsx("div", { className: "h-full rounded-full bg-primary", style: { width: `${progress}%` } }) }))] }));
 }
 function ColumnView({ column, props, keys, groupField, stats, folded, onUnfold, }) {
     const { api, format } = useKosh();

package/dist/ui/views/ListView.d.ts

@@ -1,3 +1,11 @@
+/**
+ * The list renderer (RFC 0007 §5, RFC 0010 §3.5): server-side order, paging and totals, grouping (one level,
+ * expandable), inline edit of `inlineEdit` columns with compare-and-set, row virtualization (TanStack Virtual) so
+ * large pages scroll smoothly, selection with a bulk bar (archive and delete with Undo, export, the transitions every
+ * selected record allows), export to CSV and Excel, a column chooser and density remembered per user, skeleton rows
+ * while loading and an empty state that offers the next step. Rows are a semantic table: keyboard users move with
+ * Tab and open with Enter. Every bulk action is one request per record to the existing, permission-checked routes.
+ */
 import { type ReactElement } from 'react';
 import type { ViewProps } from '../registry.js';
 /** The default list renderer. */

package/dist/ui/views/ListView.js

@@ -15,6 +15,7 @@ import { Archive, ArrowDown, ArrowUp, ChevronRight, Columns3, Download, Inbox, P
 import { useEffect, useMemo, useRef, useState, } from 'react';
 import { useTranslation } from 'react-i18next';
 import { ApiError } from '../api.js';
+import { Explain } from '../components/Explain.js';
 import { Alert, Button, Checkbox, Dialog, EmptyState, Menu, MenuCheckboxItem, MenuContent, MenuItem, MenuLabel, MenuSeparator, MenuTrigger, Skeleton, } from '../components/primitives.js';
 import { useKosh } from '../context.js';
 import { useDesign } from '../design.js';
@@ -78,7 +79,7 @@ const SELECT_WIDTH = 40;
  */
 function ResizeHandle({ label, width, onResize, onReset, }) {
     const drag = useRef(null);
-    return (_jsx("span", { role: "separator", "aria-orientation": "vertical", "aria-label": label, "aria-valuenow": width ?? undefined, tabIndex: 0, className: "absolute inset-y-0 end-0 w-2 cursor-col-resize touch-none select-none hover:bg-primary/30 focus-visible:bg-primary/40 focus-visible:outline-none", onPointerDown: (e) => {
+    return (_jsx("span", { role: "separator", "aria-orientation": "vertical", "aria-label": label, "aria-valuenow": width ?? DEFAULT_WIDTH, "aria-valuemin": MIN_WIDTH, "aria-valuemax": MAX_WIDTH, tabIndex: 0, className: "absolute inset-y-0 end-0 w-2 cursor-col-resize touch-none select-none hover:bg-primary/30 focus-visible:bg-primary/40 focus-visible:outline-none", onPointerDown: (e) => {
             const cell = e.currentTarget.parentElement;
             if (cell === null)
                 return;
@@ -603,7 +604,7 @@ function Rows({ props, where, columns, fields, offset, limit, height, selection,
                                             ? 'ascending'
                                             : direction === 'desc'
                                                 ? 'descending'
-                                                : 'none', className: cn('relative px-3 py-2 text-start font-medium text-muted-foreground', pinnedClass(node.id)), children: [_jsxs("button", { type: "button", className: "inline-flex items-center gap-1", onClick: () => toggleOrder(node.field), children: [_jsx(table.FlexRender, { header: header }), direction === 'asc' ? (_jsx(ArrowUp, { className: "size-3", "aria-hidden": true })) : direction === 'desc' ? (_jsx(ArrowDown, { className: "size-3", "aria-hidden": true })) : null] }), _jsx(ResizeHandle, { label: t('views.resize', {
+                                                : 'none', className: cn('relative px-3 py-2 text-start font-medium text-muted-foreground', pinnedClass(node.id)), children: [_jsx(Explain, { model: model, target: { field: node.field }, asChild: true, children: _jsxs("button", { type: "button", className: "inline-flex items-center gap-1", onClick: () => toggleOrder(node.field), children: [_jsx(table.FlexRender, { header: header }), direction === 'asc' ? (_jsx(ArrowUp, { className: "size-3", "aria-hidden": true })) : direction === 'desc' ? (_jsx(ArrowDown, { className: "size-3", "aria-hidden": true })) : null] }) }), _jsx(ResizeHandle, { label: t('views.resize', {
                                                     column: node.label ?? fields[node.field]?.label ?? node.field,
                                                 }), width: widths[node.id] ?? null, onResize: (w) => setWidth(node.id, w), onReset: () => setWidth(node.id, null) })] }, header.id));
                                 })] }, group.id))) }), _jsxs("tbody", { children: [top > 0 ? (_jsx("tr", { "aria-hidden": true, children: _jsx("td", { style: { height: top }, colSpan: span }) })) : null, virtual.map((v) => {
@@ -759,7 +760,7 @@ export function totalLabel(word, label) {
         : `${word} ${label}`;
 }
 export function ListView(props) {
-    const { api, uid } = useKosh();
+    const { api, uid, registry } = useKosh();
     const { t } = useTranslation();
     const toast = useToast();
     const queryClient = useQueryClient();
@@ -934,7 +935,13 @@ export function ListView(props) {
         }),
     });
     // Selected rows: a floating bar at the bottom of the screen (RFC 0018 §4.3); the list's own toolbar stays put.
-    const floating = ids.length > 0 ? (_jsxs("div", { role: "toolbar", "aria-label": t('views.selected', { count: ids.length }), "data-kosh-selection-bar": true, className: "fixed inset-x-0 bottom-4 z-30 mx-auto flex w-fit max-w-[calc(100vw-2rem)] flex-wrap items-center gap-2 rounded-xl border bg-surface px-3 py-2 text-sm shadow-lg", children: [_jsx("span", { className: "font-medium", children: t('views.selected', { count: ids.length }) }), _jsx(Button, { size: "sm", variant: "ghost", "aria-label": t('views.clearSelection'), onClick: () => setSelected(new Set()), children: _jsx(X, { "aria-hidden": true }) }), _jsx("span", { className: "flex-1" }), transitions.map((tr) => (_jsx(Button, { size: "sm", busy: transition.isPending && transition.variables?.name === tr.name, onClick: () => transition.mutate({ name: tr.name, what: ids }), children: tr.name.charAt(0).toUpperCase() + tr.name.slice(1).replace(/_/g, ' ') }, tr.name))), archivable ? (_jsxs(Button, { size: "sm", busy: archive.isPending, onClick: () => archive.mutate(ids), children: [_jsx(Archive, { "aria-hidden": true }), t('views.archive')] })) : null, served.operations.unlink ? (_jsxs(Button, { size: "sm", variant: "danger", onClick: () => setConfirmingDelete(true), children: [_jsx(Trash2, { "aria-hidden": true }), t('views.delete')] })) : null, canExport ? (_jsxs(Button, { size: "sm", busy: exportAs.isPending, onClick: () => exportAs.mutate('csv'), children: [_jsx(Download, { "aria-hidden": true }), t('views.export')] })) : null] })) : null;
+    const floating = ids.length > 0 ? (_jsxs("div", { role: "toolbar", "aria-label": t('views.selected', { count: ids.length }), "data-kosh-selection-bar": true, className: "fixed inset-x-0 bottom-4 z-30 mx-auto flex w-fit max-w-[calc(100vw-2rem)] flex-wrap items-center gap-2 rounded-xl border bg-surface px-3 py-2 text-sm shadow-lg", children: [_jsx("span", { className: "font-medium", children: t('views.selected', { count: ids.length }) }), _jsx(Button, { size: "sm", variant: "ghost", "aria-label": t('views.clearSelection'), onClick: () => setSelected(new Set()), children: _jsx(X, { "aria-hidden": true }) }), _jsx("span", { className: "flex-1" }), transitions.map((tr) => (_jsx(Button, { size: "sm", busy: transition.isPending && transition.variables?.name === tr.name, onClick: () => transition.mutate({ name: tr.name, what: ids }), children: tr.name.charAt(0).toUpperCase() + tr.name.slice(1).replace(/_/g, ' ') }, tr.name))), registry.selectionActions().map((Action, i) => (_jsx(Action
+            // biome-ignore lint/suspicious/noArrayIndexKey: registered once, in a fixed order
+            , { api: api, model: model, ids: ids, done: (message, tone) => {
+                    setSelected(new Set());
+                    void refresh();
+                    toast({ title: message, tone: tone ?? 'info' });
+                } }, i))), archivable ? (_jsxs(Button, { size: "sm", busy: archive.isPending, onClick: () => archive.mutate(ids), children: [_jsx(Archive, { "aria-hidden": true }), t('views.archive')] })) : null, served.operations.unlink ? (_jsxs(Button, { size: "sm", variant: "danger", onClick: () => setConfirmingDelete(true), children: [_jsx(Trash2, { "aria-hidden": true }), t('views.delete')] })) : null, canExport ? (_jsxs(Button, { size: "sm", busy: exportAs.isPending, onClick: () => exportAs.mutate('csv'), children: [_jsx(Download, { "aria-hidden": true }), t('views.export')] })) : null] })) : null;
     const toolbar = (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2 border-b px-3 py-1.5 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: count === null ? (_jsx(Skeleton, { className: "inline-block h-4 w-20" })) : (t('views.records', { count })) }), _jsx("span", { className: "flex-1" }), design.active ? (_jsxs(Button, { size: "sm", variant: "ghost", className: "border border-dashed border-primary/50 text-primary", onClick: () => design.choose({
                             kind: 'list',
                             view: view.id,
@@ -952,7 +959,9 @@ export function ListView(props) {
                                                 next.add(c.id);
                                             setHidden(next);
                                             stored.set(columnsKey, [...next]);
-                                        }, children: c.label ?? fields[c.field]?.label ?? c.field }, c.id))), _jsx(MenuSeparator, {}), _jsx(MenuLabel, { children: t('views.pinned') }), columns.map((c) => (_jsx(MenuCheckboxItem, { checked: pinned.includes(c.id), onCheckedChange: () => togglePin(c.id), children: c.label ?? fields[c.field]?.label ?? c.field }, `pin-${c.id}`))), Object.keys(widths).length === 0 ? null : (_jsxs(_Fragment, { children: [_jsx(MenuSeparator, {}), _jsx(MenuItem, { onSelect: () => {
+                                        }, children: c.label ?? fields[c.field]?.label ?? c.field }, c.id))), _jsx(MenuSeparator, {}), _jsx(MenuLabel, { children: t('views.pinned') }), columns.map((c) => (_jsx(MenuCheckboxItem, { "aria-label": t('views.pinColumn', {
+                                            name: c.label ?? fields[c.field]?.label ?? c.field,
+                                        }), checked: pinned.includes(c.id), onCheckedChange: () => togglePin(c.id), children: c.label ?? fields[c.field]?.label ?? c.field }, `pin-${c.id}`))), Object.keys(widths).length === 0 ? null : (_jsxs(_Fragment, { children: [_jsx(MenuSeparator, {}), _jsx(MenuItem, { onSelect: () => {
                                                     setWidths({});
                                                     stored.set(widthsKey, {});
                                                 }, children: t('views.resetWidths') })] }))] })] }), canExport ? (_jsxs(Menu, { children: [_jsx(MenuTrigger, { asChild: true, children: _jsx(Button, { size: "sm", variant: "ghost", "aria-label": t('views.export'), busy: exportAs.isPending, children: _jsx(Download, { "aria-hidden": true }) }) }), _jsxs(MenuContent, { align: "end", children: [_jsx(MenuLabel, { children: t('views.export') }), _jsx(MenuItem, { onSelect: () => exportAs.mutate('csv'), children: t('views.exportCsv') }), _jsx(MenuItem, { onSelect: () => exportAs.mutate('xlsx'), children: t('views.exportXlsx') }), _jsx(MenuItem, { onSelect: () => exportAs.mutate('pdf'), children: t('views.exportPdf') })] })] })) : null] }), floating] }));

package/dist/ui/views/StatsRow.js

@@ -7,6 +7,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import { holds, resolveRecord, } from '../../views/index.js';
 import { useQueries, useQuery } from '@tanstack/react-query';
 import { useNavigate } from '@tanstack/react-router';
+import { Explain } from '../components/Explain.js';
 import { useKosh } from '../context.js';
 import { cn } from '../lib/cn.js';
 // The badge's tones (primitives), on the figure only.
@@ -81,7 +82,7 @@ export function StatsRow({ node, values, env, version, }) {
             const result = results[i];
             const value = textOf(result?.data, format);
             const clickable = routes.data?.[tile.model]?.app !== undefined;
-            const body = (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-xs font-medium text-muted-foreground", children: tile.label }), _jsxs("span", { className: cn('text-xl font-semibold tabular-nums leading-tight', TONES[tile.tone ?? 'neutral']), children: [result?.isPending === true ? '…' : value.text, value.currency === undefined ? null : (_jsx("span", { className: "ms-1 text-xs font-normal text-muted-foreground", children: value.currency }))] })] }));
+            const body = (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-xs font-medium text-muted-foreground", children: _jsx(Explain, { model: tile.model, focusable: false, target: { action: tile.id, domain: wheres[i] }, children: tile.label }) }), _jsxs("span", { className: cn('text-xl font-semibold tabular-nums leading-tight', TONES[tile.tone ?? 'neutral']), children: [result?.isPending === true ? '…' : value.text, value.currency === undefined ? null : (_jsx("span", { className: "ms-1 text-xs font-normal text-muted-foreground", children: value.currency }))] })] }));
             const className = 'grid gap-0.5 rounded-lg border bg-surface px-3 py-2 text-start transition-colors';
             return clickable ? (_jsx("button", { type: "button", className: cn(className, 'hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring'), onClick: () => open(i), children: body }, tile.id)) : (_jsx("div", { className: className, children: body }, tile.id));
         }) }));

package/dist/ui/views/widgets.js

@@ -272,7 +272,13 @@ function ProgressWidget(props) {
     const { format } = useKosh();
     if (props.onChange !== undefined && !props.readonly)
         return _jsx(IntegerWidget, { ...props });
-    const n = typeof props.value === 'number' ? Math.max(0, Math.min(100, props.value)) : null;
+    // Decimals arrive as strings ("75.0"), integers as numbers.
+    const raw = typeof props.value === 'number'
+        ? props.value
+        : typeof props.value === 'string' && props.value.trim() !== ''
+            ? Number(props.value)
+            : Number.NaN;
+    const n = Number.isFinite(raw) ? Math.max(0, Math.min(100, raw)) : null;
     if (n === null)
         return _jsx("span", {});
     return (_jsxs("span", { className: "inline-flex w-full max-w-40 items-center gap-2", children: [_jsx("span", { role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": n, "aria-label": props.field.label, className: "h-1.5 flex-1 overflow-hidden rounded-full bg-muted", children: _jsx("span", { className: "block h-full rounded-full bg-primary", style: { width: `${n}%` } }) }), _jsxs("span", { className: "tabular-nums text-xs text-muted-foreground", children: [format.number(n), "%"] })] }));

package/dist/views/extend.js

@@ -153,6 +153,18 @@ function apply(view, op) {
             break;
         }
         case 'form': {
+            // `append: 'header'` adds buttons to the header, which may have none yet (RFC 0028 §3.4).
+            if ('append' in op && op.append === 'header') {
+                next = {
+                    ...view,
+                    header: {
+                        ...view.header,
+                        buttons: [...view.header.buttons, ...op.nodes],
+                    },
+                };
+                done = true;
+                break;
+            }
             const [buttons, inHeader] = applyIn(view.header.buttons, op);
             if (inHeader)
                 [next, done] = [

package/dist/views/types.d.ts

@@ -99,7 +99,18 @@ export type FormNode = FieldNode | GroupNode | NotebookNode | LinesNode | Compon
 export interface ButtonNode {
     readonly kind: 'button';
     readonly id: string;
-    readonly transition: string;
+    /** The transition it runs (a button runs a transition, or opens a new record: `open`). */
+    readonly transition?: string;
+    /**
+     * Opens a new record of another model, filled from this one (RFC 0028 §3.4: "New quotation" on a deal): `values`
+     * may refer to the record (`{ $record: 'partner' }`); `action` defaults to the model's own. Saved like any new
+     * record: the server checks the rights then.
+     */
+    readonly open?: {
+        readonly model: string;
+        readonly action?: string;
+        readonly values: Readonly<Record<string, unknown>>;
+    };
     readonly label?: string;
     readonly primary?: boolean;
     readonly visibleWhen?: Condition;
@@ -213,7 +224,7 @@ export interface CalendarView extends ViewBase {
     readonly title: string;
     /** A field whose value colours the events. */
     readonly color?: string;
-    readonly mode?: 'month' | 'week';
+    readonly mode?: 'month' | 'week' | 'day';
 }
 /** Records as bars on a timeline. */
 export interface GanttView extends ViewBase {