@rytass/bpm-core-react 0.18.1 → 0.20.0

package/dist/views/forms/renderer/FormRendererView.d.cts

@@ -3,9 +3,16 @@ import { FormDataSourceValueSnapshots, FormDefinitionSchema, FormFieldDefinition
 import { FormRendererValues } from '@rytass/bpm-core-client/form';
 import { ResolvedFieldAccess } from '@rytass/bpm-core-shared';
 import { FormDataSourceFieldState, FormRendererDataSourceContext } from './form-data-source-field.cjs';
+import { FileUploadFieldState, FormRendererAttachment } from './file-upload-field.cjs';
 export interface FormRendererProps {
     readonly dataSourceContext?: FormRendererDataSourceContext;
     readonly dataSourceInitialValues?: FormRendererValues;
+    /**
+     * Attachments the form's `file_upload` values may refer to (for example the
+     * instance's `listAttachments`). A field lists each id it holds by the name
+     * and size found here.
+     */
+    readonly attachments?: readonly FormRendererAttachment[];
     readonly emptyText?: string;
     readonly errors?: Readonly<Record<string, string>>;
     /**
@@ -24,7 +31,23 @@ export interface FormRendererProps {
     readonly fieldLabelMarkers?: Readonly<Record<string, string>>;
     readonly maxWidth?: CSSProperties['maxWidth'];
     readonly onChange?: (values: FormRendererValues) => void;
-    readonly onDataSourceStateChange?: (fieldKey: string, state: Pick<FormDataSourceFieldState, 'hasValue' | 'invalidValues' | 'status'>) => void;
+    readonly onDataSourceStateChange?: (fieldKey: string, state: Pick<FormDataSourceFieldState, 'hasValue' | 'invalidValues' | 'selectionExpired' | 'status'>) => void;
+    /**
+     * Called when a `file_upload` field starts or settles an upload. A host
+     * that submits the form refuses to while any field reports a pending or
+     * failed upload (`readFileUploadSubmissionBlockMessage`): those files are
+     * listed but not in the value.
+     */
+    readonly onFileUploadStateChange?: (fieldKey: string, state: FileUploadFieldState) => void;
+    /**
+     * Opens an attachment a `file_upload` field lists. Without it, only files
+     * picked in this form can be downloaded from the field.
+     */
+    readonly onDownloadAttachment?: (attachmentId: string) => void;
+    /**
+     * Uploads a file picked in a `file_upload` field and returns the attachment
+     * id the value then holds. Without it a `file_upload` field cannot upload.
+     */
     readonly onUploadAttachment?: (field: FormFieldDefinition, file: File) => Promise<{
         readonly id: string;
     }>;
@@ -35,5 +58,5 @@ export interface FormRendererProps {
     readonly uiSchema: FormUiSchema;
     readonly value?: FormRendererValues;
 }
-export declare function FormRenderer({ dataSourceContext, dataSourceInitialValues, emptyText, errors, fieldAccess, fieldLabelMarkers, maxWidth, onChange, onDataSourceStateChange, onUploadAttachment, optionSnapshots, readonly, schema, singleColumn, uiSchema, value, }: FormRendererProps): ReactElement;
+export declare function FormRenderer({ attachments, dataSourceContext, dataSourceInitialValues, emptyText, errors, fieldAccess, fieldLabelMarkers, maxWidth, onChange, onDataSourceStateChange, onDownloadAttachment, onFileUploadStateChange, onUploadAttachment, optionSnapshots, readonly, schema, singleColumn, uiSchema, value, }: FormRendererProps): ReactElement;
 export { FormRenderer as FormRendererView };

package/dist/views/forms/renderer/FormRendererView.d.ts

@@ -3,9 +3,16 @@ import { FormDataSourceValueSnapshots, FormDefinitionSchema, FormFieldDefinition
 import { FormRendererValues } from '@rytass/bpm-core-client/form';
 import { ResolvedFieldAccess } from '@rytass/bpm-core-shared';
 import { FormDataSourceFieldState, FormRendererDataSourceContext } from './form-data-source-field.js';
+import { FileUploadFieldState, FormRendererAttachment } from './file-upload-field.js';
 export interface FormRendererProps {
     readonly dataSourceContext?: FormRendererDataSourceContext;
     readonly dataSourceInitialValues?: FormRendererValues;
+    /**
+     * Attachments the form's `file_upload` values may refer to (for example the
+     * instance's `listAttachments`). A field lists each id it holds by the name
+     * and size found here.
+     */
+    readonly attachments?: readonly FormRendererAttachment[];
     readonly emptyText?: string;
     readonly errors?: Readonly<Record<string, string>>;
     /**
@@ -24,7 +31,23 @@ export interface FormRendererProps {
     readonly fieldLabelMarkers?: Readonly<Record<string, string>>;
     readonly maxWidth?: CSSProperties['maxWidth'];
     readonly onChange?: (values: FormRendererValues) => void;
-    readonly onDataSourceStateChange?: (fieldKey: string, state: Pick<FormDataSourceFieldState, 'hasValue' | 'invalidValues' | 'status'>) => void;
+    readonly onDataSourceStateChange?: (fieldKey: string, state: Pick<FormDataSourceFieldState, 'hasValue' | 'invalidValues' | 'selectionExpired' | 'status'>) => void;
+    /**
+     * Called when a `file_upload` field starts or settles an upload. A host
+     * that submits the form refuses to while any field reports a pending or
+     * failed upload (`readFileUploadSubmissionBlockMessage`): those files are
+     * listed but not in the value.
+     */
+    readonly onFileUploadStateChange?: (fieldKey: string, state: FileUploadFieldState) => void;
+    /**
+     * Opens an attachment a `file_upload` field lists. Without it, only files
+     * picked in this form can be downloaded from the field.
+     */
+    readonly onDownloadAttachment?: (attachmentId: string) => void;
+    /**
+     * Uploads a file picked in a `file_upload` field and returns the attachment
+     * id the value then holds. Without it a `file_upload` field cannot upload.
+     */
     readonly onUploadAttachment?: (field: FormFieldDefinition, file: File) => Promise<{
         readonly id: string;
     }>;
@@ -35,5 +58,5 @@ export interface FormRendererProps {
     readonly uiSchema: FormUiSchema;
     readonly value?: FormRendererValues;
 }
-export declare function FormRenderer({ dataSourceContext, dataSourceInitialValues, emptyText, errors, fieldAccess, fieldLabelMarkers, maxWidth, onChange, onDataSourceStateChange, onUploadAttachment, optionSnapshots, readonly, schema, singleColumn, uiSchema, value, }: FormRendererProps): ReactElement;
+export declare function FormRenderer({ attachments, dataSourceContext, dataSourceInitialValues, emptyText, errors, fieldAccess, fieldLabelMarkers, maxWidth, onChange, onDataSourceStateChange, onDownloadAttachment, onFileUploadStateChange, onUploadAttachment, optionSnapshots, readonly, schema, singleColumn, uiSchema, value, }: FormRendererProps): ReactElement;
 export { FormRenderer as FormRendererView };

package/dist/views/forms/renderer/file-upload-field.d.cts

@@ -0,0 +1,84 @@
+import { ReactElement } from 'react';
+import { FileUploadFieldDefinition, FormFieldDefinition, FormFieldValue } from '@rytass/bpm-core-shared/form';
+/**
+ * What a `file_upload` field needs to know about an attachment it did not
+ * upload itself (a resubmitted case, a stored instance) to list it. The shape
+ * is a subset of `AttachmentRecord`, so a host passes its attachment list as is.
+ */
+export interface FormRendererAttachment {
+    readonly filename: string;
+    readonly id: string;
+    readonly sizeBytes: number | string;
+}
+/**
+ * Where a `file_upload` field stands, reported to the host through
+ * `FormRenderer`'s `onFileUploadStateChange`.
+ */
+export interface FileUploadFieldState {
+    /** Files that failed to upload. They are listed, but not in the value. */
+    readonly failedCount: number;
+    /** Files still uploading. They are listed, but not in the value yet. */
+    readonly pendingCount: number;
+}
+/**
+ * The copy to show when a submission is refused because a `file_upload` field
+ * has not settled. An upload still running is a "wait a moment"; a failed one
+ * needs the filler to retry or remove it. Returns `null` when nothing blocks.
+ *
+ * Without this check a submit made while a file is uploading sends the form
+ * without that attachment, although the field lists the file.
+ */
+export declare function readFileUploadSubmissionBlockMessage(states: readonly Pick<FileUploadFieldState, 'failedCount' | 'pendingCount'>[]): string | null;
+export interface FileUploadFieldStates {
+    /** `readFileUploadSubmissionBlockMessage` over every field reported so far. */
+    readonly blockMessage: string | null;
+    /** Pass to `FormRenderer`'s `onFileUploadStateChange`. */
+    readonly onFileUploadStateChange: (fieldKey: string, state: FileUploadFieldState) => void;
+}
+/**
+ * Collects what a form's `file_upload` fields report, for a host that has to
+ * refuse a submit while one of them is uploading or holds a failed upload.
+ */
+export declare function useFileUploadFieldStates(): FileUploadFieldStates;
+export interface FileUploadFieldControlProps {
+    /** Metadata for listing attachments this control did not upload. */
+    readonly attachments?: readonly FormRendererAttachment[];
+    readonly field: FileUploadFieldDefinition;
+    /**
+     * Receives the attachment ids the field now holds. Like a controlled input,
+     * the host renders the value back: the list shows the value it is given.
+     */
+    readonly onChange: (value: FormFieldValue | undefined) => void;
+    /** Opens an attachment the value holds. Without it, only files picked here download. */
+    readonly onDownloadAttachment?: (attachmentId: string) => void;
+    readonly onStateChange?: (state: FileUploadFieldState) => void;
+    readonly onUploadAttachment?: (field: FormFieldDefinition, file: File) => Promise<{
+        readonly id: string;
+    }>;
+    readonly readonly: boolean;
+    readonly value: FormFieldValue | undefined;
+}
+/**
+ * The `file_upload` control.
+ *
+ * Mezzanine's `Upload` is fully controlled: it renders `files` and resets its
+ * working list to that prop after every render, so the list is built here.
+ *
+ * What is attached is the host's value, and only that: every id it holds is
+ * listed — a file picked here by its own `File`, any other id by the name and
+ * size in `attachments` (or as an unnamed attachment without them) — so each
+ * one can be removed and counts towards `maxFiles`. Uploads still running and
+ * uploads that failed are listed too, in the order `Upload` keeps, but are not
+ * in the value; `onStateChange` reports them so the host can refuse a submit.
+ *
+ * The value emitted on a change is read off the list `Upload` hands back —
+ * the finished files in it, in order — never off this control's state. That
+ * list is `Upload`'s own working copy, which it updates the moment it emits,
+ * so it is current even when two uploads finish before the host re-renders.
+ * `Upload` calls the `onChange` it captured when a file was picked, so it is
+ * given a stable function that forwards to the latest handler.
+ *
+ * Without `onUploadAttachment` nothing can be uploaded, so the control is
+ * disabled and says so rather than listing a file no attachment stands behind.
+ */
+export declare function FileUploadFieldControl({ attachments, field, onChange, onDownloadAttachment, onStateChange, onUploadAttachment, readonly, value, }: FileUploadFieldControlProps): ReactElement;

package/dist/views/forms/renderer/file-upload-field.d.ts

@@ -0,0 +1,84 @@
+import { ReactElement } from 'react';
+import { FileUploadFieldDefinition, FormFieldDefinition, FormFieldValue } from '@rytass/bpm-core-shared/form';
+/**
+ * What a `file_upload` field needs to know about an attachment it did not
+ * upload itself (a resubmitted case, a stored instance) to list it. The shape
+ * is a subset of `AttachmentRecord`, so a host passes its attachment list as is.
+ */
+export interface FormRendererAttachment {
+    readonly filename: string;
+    readonly id: string;
+    readonly sizeBytes: number | string;
+}
+/**
+ * Where a `file_upload` field stands, reported to the host through
+ * `FormRenderer`'s `onFileUploadStateChange`.
+ */
+export interface FileUploadFieldState {
+    /** Files that failed to upload. They are listed, but not in the value. */
+    readonly failedCount: number;
+    /** Files still uploading. They are listed, but not in the value yet. */
+    readonly pendingCount: number;
+}
+/**
+ * The copy to show when a submission is refused because a `file_upload` field
+ * has not settled. An upload still running is a "wait a moment"; a failed one
+ * needs the filler to retry or remove it. Returns `null` when nothing blocks.
+ *
+ * Without this check a submit made while a file is uploading sends the form
+ * without that attachment, although the field lists the file.
+ */
+export declare function readFileUploadSubmissionBlockMessage(states: readonly Pick<FileUploadFieldState, 'failedCount' | 'pendingCount'>[]): string | null;
+export interface FileUploadFieldStates {
+    /** `readFileUploadSubmissionBlockMessage` over every field reported so far. */
+    readonly blockMessage: string | null;
+    /** Pass to `FormRenderer`'s `onFileUploadStateChange`. */
+    readonly onFileUploadStateChange: (fieldKey: string, state: FileUploadFieldState) => void;
+}
+/**
+ * Collects what a form's `file_upload` fields report, for a host that has to
+ * refuse a submit while one of them is uploading or holds a failed upload.
+ */
+export declare function useFileUploadFieldStates(): FileUploadFieldStates;
+export interface FileUploadFieldControlProps {
+    /** Metadata for listing attachments this control did not upload. */
+    readonly attachments?: readonly FormRendererAttachment[];
+    readonly field: FileUploadFieldDefinition;
+    /**
+     * Receives the attachment ids the field now holds. Like a controlled input,
+     * the host renders the value back: the list shows the value it is given.
+     */
+    readonly onChange: (value: FormFieldValue | undefined) => void;
+    /** Opens an attachment the value holds. Without it, only files picked here download. */
+    readonly onDownloadAttachment?: (attachmentId: string) => void;
+    readonly onStateChange?: (state: FileUploadFieldState) => void;
+    readonly onUploadAttachment?: (field: FormFieldDefinition, file: File) => Promise<{
+        readonly id: string;
+    }>;
+    readonly readonly: boolean;
+    readonly value: FormFieldValue | undefined;
+}
+/**
+ * The `file_upload` control.
+ *
+ * Mezzanine's `Upload` is fully controlled: it renders `files` and resets its
+ * working list to that prop after every render, so the list is built here.
+ *
+ * What is attached is the host's value, and only that: every id it holds is
+ * listed — a file picked here by its own `File`, any other id by the name and
+ * size in `attachments` (or as an unnamed attachment without them) — so each
+ * one can be removed and counts towards `maxFiles`. Uploads still running and
+ * uploads that failed are listed too, in the order `Upload` keeps, but are not
+ * in the value; `onStateChange` reports them so the host can refuse a submit.
+ *
+ * The value emitted on a change is read off the list `Upload` hands back —
+ * the finished files in it, in order — never off this control's state. That
+ * list is `Upload`'s own working copy, which it updates the moment it emits,
+ * so it is current even when two uploads finish before the host re-renders.
+ * `Upload` calls the `onChange` it captured when a file was picked, so it is
+ * given a stable function that forwards to the latest handler.
+ *
+ * Without `onUploadAttachment` nothing can be uploaded, so the control is
+ * disabled and says so rather than listing a file no attachment stands behind.
+ */
+export declare function FileUploadFieldControl({ attachments, field, onChange, onDownloadAttachment, onStateChange, onUploadAttachment, readonly, value, }: FileUploadFieldControlProps): ReactElement;

package/dist/views/forms/renderer/form-data-source-field.d.cts

@@ -21,6 +21,14 @@ export interface FormDataSourceFieldState {
     readonly onSearch: (searchText: string) => void;
     readonly options: readonly FormFieldOption[];
     readonly retry: () => void;
+    /**
+     * True when the held value was valid for the form it was picked in, an
+     * `EXPRESSION` binding's inputs have changed since, and the host's resolve
+     * no longer accounts for it. The status is then `INVALID` and the message is
+     * the host's `FORM_DATA_SOURCE_VALUE_NOT_RESOLVED` copy — the same sentence
+     * a `FIELD` binding's stale value gets when the submission is refused.
+     */
+    readonly selectionExpired?: boolean;
     readonly status: FormDataSourceFieldStatus;
 }
 /**
@@ -62,4 +70,4 @@ export declare function isFormDataSourceFieldSubmissionBlocked(state: Pick<FormD
  *
  * Returns `null` when nothing blocks the submission.
  */
-export declare function readFormDataSourceSubmissionBlockMessage(states: readonly Pick<FormDataSourceFieldState, 'hasValue' | 'status'>[]): string | null;
+export declare function readFormDataSourceSubmissionBlockMessage(states: readonly Pick<FormDataSourceFieldState, 'hasValue' | 'selectionExpired' | 'status'>[]): string | null;

package/dist/views/forms/renderer/form-data-source-field.d.ts

@@ -21,6 +21,14 @@ export interface FormDataSourceFieldState {
     readonly onSearch: (searchText: string) => void;
     readonly options: readonly FormFieldOption[];
     readonly retry: () => void;
+    /**
+     * True when the held value was valid for the form it was picked in, an
+     * `EXPRESSION` binding's inputs have changed since, and the host's resolve
+     * no longer accounts for it. The status is then `INVALID` and the message is
+     * the host's `FORM_DATA_SOURCE_VALUE_NOT_RESOLVED` copy — the same sentence
+     * a `FIELD` binding's stale value gets when the submission is refused.
+     */
+    readonly selectionExpired?: boolean;
     readonly status: FormDataSourceFieldStatus;
 }
 /**
@@ -62,4 +70,4 @@ export declare function isFormDataSourceFieldSubmissionBlocked(state: Pick<FormD
  *
  * Returns `null` when nothing blocks the submission.
  */
-export declare function readFormDataSourceSubmissionBlockMessage(states: readonly Pick<FormDataSourceFieldState, 'hasValue' | 'status'>[]): string | null;
+export declare function readFormDataSourceSubmissionBlockMessage(states: readonly Pick<FormDataSourceFieldState, 'hasValue' | 'selectionExpired' | 'status'>[]): string | null;

package/dist/views/forms/renderer/form-value-readers.d.cts

@@ -0,0 +1,7 @@
+import { FormFieldValue } from '@rytass/bpm-core-shared/form';
+/**
+ * A multi-value field's ids or option values, or `[]` for anything else.
+ * A table value is also an array, so the element check is what separates a
+ * multi-select or `file_upload` value from table rows.
+ */
+export declare function readStringArrayValue(value: FormFieldValue | undefined): readonly string[];

package/dist/views/forms/renderer/form-value-readers.d.ts

@@ -0,0 +1,7 @@
+import { FormFieldValue } from '@rytass/bpm-core-shared/form';
+/**
+ * A multi-value field's ids or option values, or `[]` for anything else.
+ * A table value is also an array, so the element check is what separates a
+ * multi-select or `file_upload` value from table rows.
+ */
+export declare function readStringArrayValue(value: FormFieldValue | undefined): readonly string[];

package/dist/views/forms/renderer/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/FormRendererView-ChmM_4Yc.cjs");exports.FormRenderer=e.t,exports.FormRendererView=e.t,exports.isFormDataSourceFieldSubmissionBlocked=e.a,exports.readFormDataSourceFieldStatusMessage=e.o,exports.readFormDataSourceSubmissionBlockMessage=e.s,exports.useFormDataSourceField=e.c;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/FormRendererView-lYSaR8CQ.cjs");exports.FormRenderer=e.t,exports.FormRendererView=e.t,exports.isFormDataSourceFieldSubmissionBlocked=e.s,exports.readFileUploadSubmissionBlockMessage=e.a,exports.readFormDataSourceFieldStatusMessage=e.c,exports.readFormDataSourceSubmissionBlockMessage=e.l,exports.useFormDataSourceField=e.u;

package/dist/views/forms/renderer/index.d.cts

@@ -1,2 +1,3 @@
 export * from './FormRendererView.cjs';
 export * from './form-data-source-field.cjs';
+export { readFileUploadSubmissionBlockMessage, type FileUploadFieldState, type FormRendererAttachment, } from './file-upload-field.cjs';

package/dist/views/forms/renderer/index.d.ts

@@ -1,2 +1,3 @@
 export * from './FormRendererView.js';
 export * from './form-data-source-field.js';
+export { readFileUploadSubmissionBlockMessage, type FileUploadFieldState, type FormRendererAttachment, } from './file-upload-field.js';

package/dist/views/forms/renderer/index.js

@@ -1 +1 @@
-export { t as FormRenderer, t as FormRendererView, a as isFormDataSourceFieldSubmissionBlocked, o as readFormDataSourceFieldStatusMessage, s as readFormDataSourceSubmissionBlockMessage, c as useFormDataSourceField } from "../../../chunks/FormRendererView-CTLlG13b.js";
+export { t as FormRenderer, t as FormRendererView, s as isFormDataSourceFieldSubmissionBlocked, a as readFileUploadSubmissionBlockMessage, c as readFormDataSourceFieldStatusMessage, l as readFormDataSourceSubmissionBlockMessage, u as useFormDataSourceField } from "../../../chunks/FormRendererView-GfbVWEGa.js";

package/dist/views/instances/detail/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/detail-BBC9kqXd.cjs");exports.InstanceAttachmentsSection=e.o,exports.InstanceDetailView=e.t,exports.InstanceFormSection=e.s,exports.InstanceHistorySection=e.r,exports.InstanceSignaturesSection=e.i,exports.InstanceTasksSection=e.a,exports.InstanceWebhookDeliveriesSection=e.n;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/detail-ChseSF55.cjs");exports.InstanceAttachmentsSection=e.o,exports.InstanceDetailView=e.t,exports.InstanceFormSection=e.s,exports.InstanceHistorySection=e.r,exports.InstanceSignaturesSection=e.i,exports.InstanceTasksSection=e.a,exports.InstanceWebhookDeliveriesSection=e.n;

package/dist/views/instances/detail/index.js

@@ -1 +1 @@
-export { o as InstanceAttachmentsSection, t as InstanceDetailView, s as InstanceFormSection, r as InstanceHistorySection, i as InstanceSignaturesSection, a as InstanceTasksSection, n as InstanceWebhookDeliveriesSection } from "../../../chunks/detail-C6XKZjlF.js";
+export { o as InstanceAttachmentsSection, t as InstanceDetailView, s as InstanceFormSection, r as InstanceHistorySection, i as InstanceSignaturesSection, a as InstanceTasksSection, n as InstanceWebhookDeliveriesSection } from "../../../chunks/detail-ByZV1XaI.js";

package/dist/views/instances/detail/sections/InstanceFormSection.d.cts

@@ -3,6 +3,7 @@ import { ResolvedFieldAccess } from '@rytass/bpm-core-shared';
 import { FormDefinitionSchema, FormFieldDefinition } from '@rytass/bpm-core-shared/form';
 import { ApprovalInstanceRecord, WorkflowFormData } from '@rytass/bpm-core-client/workflow';
 import { FormDataSourceFieldState } from '../../../forms/renderer/form-data-source-field.cjs';
+import { FileUploadFieldState, FormRendererAttachment } from '../../../forms/renderer/file-upload-field.cjs';
 /** The fill state of the viewer's own task at a node that fills in fields. */
 export interface InstanceFormSectionFill {
     /** Field errors from the page's check or the server's, keyed by path. */
@@ -48,7 +49,7 @@ export interface InstanceFormSectionProps {
     /** Called when the form data changes in the resubmit flow. */
     readonly onResubmitFormChange: (values: WorkflowFormData) => void;
     /** Called when a dynamic option field changes validation state. */
-    readonly onDataSourceStateChange: (fieldKey: string, state: Pick<FormDataSourceFieldState, 'hasValue' | 'invalidValues' | 'status'>) => void;
+    readonly onDataSourceStateChange: (fieldKey: string, state: Pick<FormDataSourceFieldState, 'hasValue' | 'invalidValues' | 'selectionExpired' | 'status'>) => void;
     /** Called when the user clicks "重新送出". */
     readonly onResubmitInstance: () => void;
     /**
@@ -59,7 +60,23 @@ export interface InstanceFormSectionProps {
     readonly resubmitComment?: string;
     /** Called when the applicant edits the resubmission comment. */
     readonly onResubmitCommentChange?: ((value: string) => void) | null;
-    /** Called when an attachment upload is requested via the form field. */
+    /**
+     * The instance's attachments, so a `file_upload` field lists the files its
+     * value holds by name.
+     */
+    readonly attachments?: readonly FormRendererAttachment[];
+    /** Opens an attachment a `file_upload` field lists. */
+    readonly onDownloadAttachment?: (attachmentId: string) => void;
+    /**
+     * Called when a `file_upload` field starts or settles an upload, so the
+     * container can refuse to resubmit while one is unsettled.
+     */
+    readonly onFileUploadStateChange?: (fieldKey: string, state: FileUploadFieldState) => void;
+    /**
+     * Uploads a file picked in a `file_upload` field while resubmitting. A fill
+     * node never edits one: an approver cannot fill in a `file_upload` field
+     * (ADR 20, refused at publish).
+     */
     readonly onUploadAttachment: (field: FormFieldDefinition, file: File) => Promise<{
         readonly id: string;
     }>;
@@ -69,4 +86,4 @@ export interface InstanceFormSectionProps {
  * Displays the form in read-only mode normally, or editable mode when the
  * instance has been returned and the current member can resubmit it.
  */
-export declare function InstanceFormSection({ canResubmitInstance, deciding, error, fieldAccess, fieldLabelMarkers, fill, instance, loading, onDataSourceStateChange, onResubmitFormChange, onReloadAfterConflict, onResubmitCommentChange, onResubmitInstance, onUploadAttachment, resubmitComment, resubmitFormData, resubmitFormErrors, }: InstanceFormSectionProps): ReactElement;
+export declare function InstanceFormSection({ attachments, canResubmitInstance, deciding, error, fieldAccess, fieldLabelMarkers, fill, instance, loading, onDataSourceStateChange, onDownloadAttachment, onFileUploadStateChange, onResubmitFormChange, onReloadAfterConflict, onResubmitCommentChange, onResubmitInstance, onUploadAttachment, resubmitComment, resubmitFormData, resubmitFormErrors, }: InstanceFormSectionProps): ReactElement;

package/dist/views/instances/detail/sections/InstanceFormSection.d.ts

@@ -3,6 +3,7 @@ import { ResolvedFieldAccess } from '@rytass/bpm-core-shared';
 import { FormDefinitionSchema, FormFieldDefinition } from '@rytass/bpm-core-shared/form';
 import { ApprovalInstanceRecord, WorkflowFormData } from '@rytass/bpm-core-client/workflow';
 import { FormDataSourceFieldState } from '../../../forms/renderer/form-data-source-field.js';
+import { FileUploadFieldState, FormRendererAttachment } from '../../../forms/renderer/file-upload-field.js';
 /** The fill state of the viewer's own task at a node that fills in fields. */
 export interface InstanceFormSectionFill {
     /** Field errors from the page's check or the server's, keyed by path. */
@@ -48,7 +49,7 @@ export interface InstanceFormSectionProps {
     /** Called when the form data changes in the resubmit flow. */
     readonly onResubmitFormChange: (values: WorkflowFormData) => void;
     /** Called when a dynamic option field changes validation state. */
-    readonly onDataSourceStateChange: (fieldKey: string, state: Pick<FormDataSourceFieldState, 'hasValue' | 'invalidValues' | 'status'>) => void;
+    readonly onDataSourceStateChange: (fieldKey: string, state: Pick<FormDataSourceFieldState, 'hasValue' | 'invalidValues' | 'selectionExpired' | 'status'>) => void;
     /** Called when the user clicks "重新送出". */
     readonly onResubmitInstance: () => void;
     /**
@@ -59,7 +60,23 @@ export interface InstanceFormSectionProps {
     readonly resubmitComment?: string;
     /** Called when the applicant edits the resubmission comment. */
     readonly onResubmitCommentChange?: ((value: string) => void) | null;
-    /** Called when an attachment upload is requested via the form field. */
+    /**
+     * The instance's attachments, so a `file_upload` field lists the files its
+     * value holds by name.
+     */
+    readonly attachments?: readonly FormRendererAttachment[];
+    /** Opens an attachment a `file_upload` field lists. */
+    readonly onDownloadAttachment?: (attachmentId: string) => void;
+    /**
+     * Called when a `file_upload` field starts or settles an upload, so the
+     * container can refuse to resubmit while one is unsettled.
+     */
+    readonly onFileUploadStateChange?: (fieldKey: string, state: FileUploadFieldState) => void;
+    /**
+     * Uploads a file picked in a `file_upload` field while resubmitting. A fill
+     * node never edits one: an approver cannot fill in a `file_upload` field
+     * (ADR 20, refused at publish).
+     */
     readonly onUploadAttachment: (field: FormFieldDefinition, file: File) => Promise<{
         readonly id: string;
     }>;
@@ -69,4 +86,4 @@ export interface InstanceFormSectionProps {
  * Displays the form in read-only mode normally, or editable mode when the
  * instance has been returned and the current member can resubmit it.
  */
-export declare function InstanceFormSection({ canResubmitInstance, deciding, error, fieldAccess, fieldLabelMarkers, fill, instance, loading, onDataSourceStateChange, onResubmitFormChange, onReloadAfterConflict, onResubmitCommentChange, onResubmitInstance, onUploadAttachment, resubmitComment, resubmitFormData, resubmitFormErrors, }: InstanceFormSectionProps): ReactElement;
+export declare function InstanceFormSection({ attachments, canResubmitInstance, deciding, error, fieldAccess, fieldLabelMarkers, fill, instance, loading, onDataSourceStateChange, onDownloadAttachment, onFileUploadStateChange, onResubmitFormChange, onReloadAfterConflict, onResubmitCommentChange, onResubmitInstance, onUploadAttachment, resubmitComment, resubmitFormData, resubmitFormErrors, }: InstanceFormSectionProps): ReactElement;

package/dist/views/instances/detail/sections/shared.d.cts

@@ -72,7 +72,7 @@ export declare function readNumberField(record: Readonly<Record<string, unknown>
 export declare function isPresentText(value: string | null): value is string;
 export declare function isRecord(value: unknown): value is Readonly<Record<string, unknown>>;
 export declare function isPendingTask(task: TaskRecord): boolean;
-export declare function readErrorMessage(error: unknown): string;
+export { readErrorMessage } from '../../instance-error-message.cjs';
 export declare function formatFileSize(sizeBytes: number): string;
 export declare function readShortHash(hash: string): string;
 export declare function readInstanceStateLabel(state: string): string;
@@ -147,4 +147,3 @@ export declare function readNodeRuntimeState(node: WorkflowNode, tasks: readonly
     statusLabel: string;
     tone: RuntimeTone;
 }>;
-export {};

package/dist/views/instances/detail/sections/shared.d.ts

@@ -72,7 +72,7 @@ export declare function readNumberField(record: Readonly<Record<string, unknown>
 export declare function isPresentText(value: string | null): value is string;
 export declare function isRecord(value: unknown): value is Readonly<Record<string, unknown>>;
 export declare function isPendingTask(task: TaskRecord): boolean;
-export declare function readErrorMessage(error: unknown): string;
+export { readErrorMessage } from '../../instance-error-message.js';
 export declare function formatFileSize(sizeBytes: number): string;
 export declare function readShortHash(hash: string): string;
 export declare function readInstanceStateLabel(state: string): string;
@@ -147,4 +147,3 @@ export declare function readNodeRuntimeState(node: WorkflowNode, tasks: readonly
     statusLabel: string;
     tone: RuntimeTone;
 }>;
-export {};

package/dist/views/instances/instance-error-message.d.cts

@@ -0,0 +1,5 @@
+/**
+ * The message a case page shows for a failed request: a stable server code
+ * translated into words, otherwise the server's own message.
+ */
+export declare function readErrorMessage(error: unknown): string;

package/dist/views/instances/instance-error-message.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The message a case page shows for a failed request: a stable server code
+ * translated into words, otherwise the server's own message.
+ */
+export declare function readErrorMessage(error: unknown): string;

package/dist/views/instances/new/index.cjs

@@ -1,2 +1,2 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/rolldown-runtime-BocRIvOZ.cjs"),t=require("../../../chunks/approver-filled-form-B4zPg9kz.cjs"),n=require("../../../chunks/format-date-time-D-cx5M8z.cjs"),r=require("../../../chunks/auth-provider-4BeCw7cI.cjs"),i=require("../../../chunks/router-adapter--gYs13E8.cjs"),a=require("../../../chunks/routes-config-C1j_vFKo.cjs"),o=require("../../../chunks/FormRendererView-ChmM_4Yc.cjs");let s=require("react"),c=require("@mezzanine-ui/react"),l=require("react/jsx-runtime"),u=require("@rytass/bpm-core-client/workflow"),d=require("@mezzanine-ui/react/ContentHeader");d=e.t(d,1);let f=require("@mezzanine-ui/icons"),p=require("@rytass/bpm-core-client/form");var m={display:`grid`,gap:16};function h(e={}){return(0,l.jsx)(s.Suspense,{fallback:(0,l.jsx)(_,{}),children:(0,l.jsx)(g,{templateId:e.templateId??void 0})})}function g({templateId:e}){let h=i.r(),g=a.r(),{member:_}=r.n(),y=_?.memberId??null,b=e??null,[x,S]=(0,s.useState)(null),[C,w]=(0,s.useState)({}),[T,E]=(0,s.useState)([]),[D,O]=(0,s.useState)(null),[k,A]=(0,s.useState)({}),[j,M]=(0,s.useState)(!0),[N,P]=(0,s.useState)(!1),[F,I]=(0,s.useState)({}),L=(0,s.useMemo)(()=>x?t.n(x.formVersion.schema,x.templateVersion.workflowDefinition):null,[x]),R=(0,s.useCallback)((e,t)=>{I(n=>{let r=n[e];return r?.hasValue===t.hasValue&&r.status===t.status?n:{...n,[e]:{hasValue:t.hasValue,status:t.status}}})},[]);(0,s.useEffect)(()=>{b?U(b):H()},[b]);let z=(0,s.useMemo)(()=>T.map(e=>({...e,key:e.id,updatedAt:n.t(e.updatedAt),versionLabel:`v${e.version}`})),[T]),B=(0,s.useMemo)(()=>[{dataIndex:`name`,key:`name`,title:`模板名稱`,width:240},{dataIndex:`versionLabel`,key:`versionLabel`,title:`發布版本`,width:120},{dataIndex:`updatedAt`,key:`updatedAt`,title:`更新時間`,width:220}],[]),V=(0,s.useMemo)(()=>({render:e=>[{name:`發起`,onClick:()=>h.push(g.caseNew(e.id)),variant:`base-primary`}],variant:`base-secondary`,width:88}),[h]);async function H(){M(!0),O(null),S(null),I({});try{E(await(0,u.listLaunchableTemplates)())}catch(e){O(v(e))}finally{M(!1)}}async function U(e){M(!0),O(null),E([]),I({});try{S(await(0,u.readLaunchContext)(e))}catch(e){O(v(e))}finally{M(!1)}}async function W(){if(!x||!L||!y)return;P(!0),O(null),A({});let e=o.s(Object.values(F));if(e){O(e),P(!1);return}let n=t.r((0,p.buildFormRendererValues)(L.fields,C),x.templateVersion.workflowDefinition);try{let e=await(0,p.validateFormRendererValuesInWorker)({schema:L,uiSchema:x.formVersion.uiSchema,values:n});if(!e.valid){A(e.errors),O(`請先修正表單中標示的欄位。`),e.firstInvalidFieldKey&&(0,p.focusFormRendererField)(e.firstInvalidFieldKey);return}let t=await(0,u.submitApprovalInstance)({formData:n,initiatorMemberId:y,templateId:x.template.id,title:(0,u.readFormDataCaseTitle)({fallbackTitle:x.template.name,formData:n,schema:L,uiSchema:x.formVersion.uiSchema})});h.push(g.caseDetail(t))}catch(e){O(v(e))}finally{P(!1)}}async function G(e,t){if(!y)throw Error(`尚未登入，無法上傳附件`);return{id:(await(0,u.uploadAttachment)({file:t,formFieldPath:`form.${e.fieldKey}`})).id}}return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(c.PageHeader,{children:(0,l.jsx)(d.default,{description:x?`${x.template.name} · 表單 v${x.formVersion.version}`:`選擇可發起的已發布模板後填寫表單內容。`,title:`發起簽核`,children:x?(0,l.jsx)(c.Button,{disabled:j||N,icon:f.CheckedIcon,iconType:`leading`,onClick:W,variant:`base-primary`,children:`送出`}):null})}),(0,l.jsx)(c.SectionGroup,{children:(0,l.jsx)(c.Section,{children:(0,l.jsxs)(`div`,{style:m,children:[D?(0,l.jsx)(c.Typography,{color:`text-error`,variant:`body`,children:D}):null,j?(0,l.jsx)(c.Typography,{color:`text-neutral`,variant:`body`,children:`載入中...`}):null,x&&L?(0,l.jsx)(o.t,{dataSourceContext:{kind:`runtime`,templateId:x.template.id},errors:k,maxWidth:480,onChange:e=>{w(e),A({})},onDataSourceStateChange:R,onUploadAttachment:G,schema:L,singleColumn:!0,uiSchema:x.formVersion.uiSchema,value:C}):null,!b&&!j?z.length>0?(0,l.jsx)(c.Table,{actions:V,columns:B,dataSource:z,fullWidth:!0}):(0,l.jsx)(c.Typography,{color:`text-neutral`,variant:`body`,children:`目前沒有可發起的已發布模板。`}):null]})})})]})}function _(){return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(c.PageHeader,{children:(0,l.jsx)(d.default,{description:`選擇可發起的已發布模板後填寫表單內容。`,title:`發起簽核`})}),(0,l.jsx)(c.SectionGroup,{children:(0,l.jsx)(c.Section,{children:(0,l.jsx)(c.Typography,{color:`text-neutral`,variant:`body`,children:`載入中...`})})})]})}function v(e){return(0,p.readFormDataSourceErrorMessage)(e)||(e instanceof Error?e.message:`發生未知錯誤`)}exports.InstanceNewView=h;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../chunks/rolldown-runtime-BocRIvOZ.cjs"),t=require("../../../chunks/instance-error-message-DTARGbGo.cjs"),n=require("../../../chunks/format-date-time-D-cx5M8z.cjs"),r=require("../../../chunks/auth-provider-4BeCw7cI.cjs"),i=require("../../../chunks/router-adapter--gYs13E8.cjs"),a=require("../../../chunks/routes-config-C1j_vFKo.cjs"),o=require("../../../chunks/FormRendererView-lYSaR8CQ.cjs");let s=require("react"),c=require("@mezzanine-ui/react"),l=require("react/jsx-runtime"),u=require("@rytass/bpm-core-client/workflow"),d=require("@mezzanine-ui/react/ContentHeader");d=e.t(d,1);let f=require("@mezzanine-ui/icons"),p=require("@rytass/bpm-core-client/form");var m={display:`grid`,gap:16};function h(e={}){return(0,l.jsx)(s.Suspense,{fallback:(0,l.jsx)(_,{}),children:(0,l.jsx)(g,{templateId:e.templateId??void 0})})}function g({templateId:e}){let h=i.r(),g=a.r(),{member:_}=r.n(),v=_?.memberId??null,y=e??null,[b,x]=(0,s.useState)(null),[S,C]=(0,s.useState)({}),[w,T]=(0,s.useState)([]),[E,D]=(0,s.useState)(null),[O,k]=(0,s.useState)({}),[A,j]=(0,s.useState)(!0),[M,N]=(0,s.useState)(!1),[P,F]=(0,s.useState)({}),I=o.o(),L=(0,s.useMemo)(()=>b?t.r(b.formVersion.schema,b.templateVersion.workflowDefinition):null,[b]),R=(0,s.useCallback)((e,t)=>{F(n=>{let r=n[e];return r?.hasValue===t.hasValue&&r.selectionExpired===(t.selectionExpired===!0)&&r.status===t.status?n:{...n,[e]:{hasValue:t.hasValue,selectionExpired:t.selectionExpired===!0,status:t.status}}})},[]);(0,s.useEffect)(()=>{y?U(y):H()},[y]);let z=(0,s.useMemo)(()=>w.map(e=>({...e,key:e.id,updatedAt:n.t(e.updatedAt),versionLabel:`v${e.version}`})),[w]),B=(0,s.useMemo)(()=>[{dataIndex:`name`,key:`name`,title:`模板名稱`,width:240},{dataIndex:`versionLabel`,key:`versionLabel`,title:`發布版本`,width:120},{dataIndex:`updatedAt`,key:`updatedAt`,title:`更新時間`,width:220}],[]),V=(0,s.useMemo)(()=>({render:e=>[{name:`發起`,onClick:()=>h.push(g.caseNew(e.id)),variant:`base-primary`}],variant:`base-secondary`,width:88}),[h]);async function H(){j(!0),D(null),x(null),F({});try{T(await(0,u.listLaunchableTemplates)())}catch(e){D(t.t(e))}finally{j(!1)}}async function U(e){j(!0),D(null),T([]),F({});try{x(await(0,u.readLaunchContext)(e))}catch(e){D(t.t(e))}finally{j(!1)}}async function W(){if(!b||!L||!v)return;N(!0),D(null),k({});let e=o.l(Object.values(P));if(e){D(e),N(!1);return}if(I.blockMessage){D(I.blockMessage),N(!1);return}let n=t.i((0,p.buildFormRendererValues)(L.fields,S),b.templateVersion.workflowDefinition);try{let e=await(0,p.validateFormRendererValuesInWorker)({schema:L,uiSchema:b.formVersion.uiSchema,values:n});if(!e.valid){k(e.errors),D(`請先修正表單中標示的欄位。`),e.firstInvalidFieldKey&&(0,p.focusFormRendererField)(e.firstInvalidFieldKey);return}let t=await(0,u.submitApprovalInstance)({formData:n,initiatorMemberId:v,templateId:b.template.id,title:(0,u.readFormDataCaseTitle)({fallbackTitle:b.template.name,formData:n,schema:L,uiSchema:b.formVersion.uiSchema})});h.push(g.caseDetail(t))}catch(e){D(t.t(e))}finally{N(!1)}}async function G(e,t){if(!v)throw Error(`尚未登入，無法上傳附件`);return{id:(await(0,u.uploadAttachment)({file:t,formFieldPath:`form.${e.fieldKey}`})).id}}return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(c.PageHeader,{children:(0,l.jsx)(d.default,{description:b?`${b.template.name} · 表單 v${b.formVersion.version}`:`選擇可發起的已發布模板後填寫表單內容。`,title:`發起簽核`,children:b?(0,l.jsx)(c.Button,{disabled:A||M,icon:f.CheckedIcon,iconType:`leading`,onClick:W,variant:`base-primary`,children:`送出`}):null})}),(0,l.jsx)(c.SectionGroup,{children:(0,l.jsx)(c.Section,{children:(0,l.jsxs)(`div`,{style:m,children:[E?(0,l.jsx)(c.Typography,{color:`text-error`,variant:`body`,children:E}):null,A?(0,l.jsx)(c.Typography,{color:`text-neutral`,variant:`body`,children:`載入中...`}):null,b&&L?(0,l.jsx)(o.t,{dataSourceContext:{kind:`runtime`,templateId:b.template.id},errors:O,maxWidth:480,onChange:e=>{C(e),k({})},onDataSourceStateChange:R,onFileUploadStateChange:I.onFileUploadStateChange,onUploadAttachment:G,schema:L,singleColumn:!0,uiSchema:b.formVersion.uiSchema,value:S}):null,!y&&!A?z.length>0?(0,l.jsx)(c.Table,{actions:V,columns:B,dataSource:z,fullWidth:!0}):(0,l.jsx)(c.Typography,{color:`text-neutral`,variant:`body`,children:`目前沒有可發起的已發布模板。`}):null]})})})]})}function _(){return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(c.PageHeader,{children:(0,l.jsx)(d.default,{description:`選擇可發起的已發布模板後填寫表單內容。`,title:`發起簽核`})}),(0,l.jsx)(c.SectionGroup,{children:(0,l.jsx)(c.Section,{children:(0,l.jsx)(c.Typography,{color:`text-neutral`,variant:`body`,children:`載入中...`})})})]})}exports.InstanceNewView=h;
 //# sourceMappingURL=index.cjs.map