@form-engine-ts/react 2.9.6 → 3.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +32 -13
- package/dist/index.cjs +288 -50
- package/dist/index.d.cts +84 -8
- package/dist/index.d.ts +84 -8
- package/dist/index.js +287 -50
- package/dist/styles.css +34 -0
- package/package.json +3 -3
package/dist/index.d.cts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { QuestionType, FormField, ChoiceOption, FormPage, FormSchema, DisplayCondition, JsonValue, SchemaIssue, FormPolicy, Question, FieldOption, TranslationReport, ValidationError, FormValues, TranslationAdapter, AsyncTranslationAdapter, PopulateTranslationOptions, FormValue, ValidationIssue, AnswerValidationResult, FieldType } from '@form-engine-ts/core';
|
|
2
|
+
export { QuestionType } from '@form-engine-ts/core';
|
|
1
3
|
import * as react from 'react';
|
|
2
|
-
import { ReactNode, ComponentType, MouseEvent } from 'react';
|
|
3
|
-
import { QuestionType, FormField, ChoiceOption, FormPage, FormSchema, DisplayCondition, JsonValue, SchemaIssue, FormPolicy, FieldOption, TranslationReport, ValidationError, FormValues, TranslationAdapter, AsyncTranslationAdapter, PopulateTranslationOptions, FormValue, ValidationIssue, AnswerValidationResult, FieldType } from '@form-engine-ts/core';
|
|
4
|
+
import { ReactNode, ComponentType, KeyboardEvent, MouseEvent } from 'react';
|
|
4
5
|
import { SensitiveDataFinding } from '@form-engine-ts/privacy';
|
|
5
6
|
|
|
6
7
|
interface SubmissionAttempt {
|
|
@@ -139,6 +140,7 @@ interface ComponentBaseProps {
|
|
|
139
140
|
type BuilderActionIconType = "moveUp" | "moveDown" | "delete" | "add" | "edit" | "settings" | "translate" | "close" | "dragHandle";
|
|
140
141
|
interface BuilderButtonProps extends ComponentBaseProps {
|
|
141
142
|
readonly onClick?: () => void;
|
|
143
|
+
readonly noWrap?: boolean;
|
|
142
144
|
readonly variant?: "primary" | "secondary" | "danger";
|
|
143
145
|
readonly children: ReactNode;
|
|
144
146
|
readonly title?: string;
|
|
@@ -165,6 +167,7 @@ interface InputComponentProps extends ComponentBaseProps {
|
|
|
165
167
|
readonly helperText?: string;
|
|
166
168
|
readonly value: string;
|
|
167
169
|
readonly onChange: (value: string) => void;
|
|
170
|
+
readonly onKeyDown?: (event: KeyboardEvent<HTMLElement>) => void;
|
|
168
171
|
readonly placeholder?: string;
|
|
169
172
|
readonly maxLength?: number;
|
|
170
173
|
}
|
|
@@ -181,10 +184,21 @@ interface BuilderTextAreaProps extends InputComponentProps {
|
|
|
181
184
|
interface BuilderSelectOption {
|
|
182
185
|
readonly label: string;
|
|
183
186
|
readonly value: string;
|
|
187
|
+
readonly icon?: ReactNode;
|
|
188
|
+
readonly description?: string;
|
|
184
189
|
readonly disabled?: boolean;
|
|
190
|
+
readonly kind?: string;
|
|
191
|
+
readonly metadata?: Readonly<Record<string, unknown>>;
|
|
192
|
+
}
|
|
193
|
+
interface SelectComponentProps extends InputComponentProps {
|
|
194
|
+
readonly options: readonly (string | BuilderSelectOption)[];
|
|
195
|
+
readonly renderOption?: (option: BuilderSelectOption) => ReactNode;
|
|
196
|
+
readonly renderValue?: (option: BuilderSelectOption | undefined) => ReactNode;
|
|
185
197
|
}
|
|
186
198
|
interface BuilderSelectProps extends InputComponentProps {
|
|
187
199
|
readonly options: readonly BuilderSelectOption[];
|
|
200
|
+
readonly renderOption?: (option: BuilderSelectOption) => ReactNode;
|
|
201
|
+
readonly renderValue?: (option: BuilderSelectOption | undefined) => ReactNode;
|
|
188
202
|
}
|
|
189
203
|
interface BuilderCheckboxProps extends ComponentBaseProps {
|
|
190
204
|
readonly name?: string;
|
|
@@ -227,6 +241,7 @@ interface FormBuilderComponents {
|
|
|
227
241
|
readonly message: string;
|
|
228
242
|
}>;
|
|
229
243
|
readonly renderIcon?: (actionType: BuilderActionIconType) => ReactNode;
|
|
244
|
+
readonly renderFieldTypeIcon?: (type: QuestionType) => ReactNode;
|
|
230
245
|
}
|
|
231
246
|
type FormBuilderActions = Omit<FormBuilderResult, "schema" | "validationIssues">;
|
|
232
247
|
interface ManualTranslationTarget {
|
|
@@ -263,6 +278,21 @@ interface BuilderFieldEditorSlotProps extends BuilderSlotBaseProps {
|
|
|
263
278
|
readonly localization?: boolean;
|
|
264
279
|
readonly conditions?: boolean;
|
|
265
280
|
};
|
|
281
|
+
readonly slots?: Pick<FormBuilderSlots, "fieldTypeSelect" | "fieldEditorHeader">;
|
|
282
|
+
}
|
|
283
|
+
interface FieldTypeSelectSlotProps {
|
|
284
|
+
readonly currentType: QuestionType;
|
|
285
|
+
readonly allowedTypes: readonly QuestionType[];
|
|
286
|
+
readonly onChangeType: (nextType: QuestionType) => void;
|
|
287
|
+
readonly disabled?: boolean;
|
|
288
|
+
readonly readOnly?: boolean;
|
|
289
|
+
readonly renderIcon?: (type: QuestionType) => ReactNode;
|
|
290
|
+
}
|
|
291
|
+
interface FieldEditorHeaderSlotProps {
|
|
292
|
+
readonly field: Question;
|
|
293
|
+
readonly index: number;
|
|
294
|
+
readonly totalFields: number;
|
|
295
|
+
readonly actions: FormBuilderActions;
|
|
266
296
|
}
|
|
267
297
|
interface BuilderOptionEditorSlotProps extends BuilderSlotBaseProps {
|
|
268
298
|
readonly field: FormField & {
|
|
@@ -289,6 +319,11 @@ interface BuilderLocalizationSlotProps extends BuilderSlotBaseProps {
|
|
|
289
319
|
readonly policy?: FormPolicy;
|
|
290
320
|
readonly translationAdapterAvailable?: boolean;
|
|
291
321
|
}
|
|
322
|
+
interface LocalizationSummaryContext {
|
|
323
|
+
readonly defaultLocale: string;
|
|
324
|
+
readonly supportedLocales: readonly string[];
|
|
325
|
+
readonly totalLocales: number;
|
|
326
|
+
}
|
|
292
327
|
interface BuilderTranslationActionsSlotProps extends BuilderSlotBaseProps {
|
|
293
328
|
readonly currentLocale: string;
|
|
294
329
|
readonly onAutoTranslate: () => void;
|
|
@@ -302,6 +337,8 @@ type FormBuilderSectionName = "basicSettings" | "completionMessage" | "questions
|
|
|
302
337
|
interface FormBuilderSlots {
|
|
303
338
|
readonly toolbar?: ComponentType<BuilderToolbarSlotProps>;
|
|
304
339
|
readonly fieldEditor?: ComponentType<BuilderFieldEditorSlotProps>;
|
|
340
|
+
readonly fieldTypeSelect?: ComponentType<FieldTypeSelectSlotProps>;
|
|
341
|
+
readonly fieldEditorHeader?: ComponentType<FieldEditorHeaderSlotProps>;
|
|
305
342
|
readonly optionEditor?: ComponentType<BuilderOptionEditorSlotProps>;
|
|
306
343
|
readonly pages?: ComponentType<BuilderPagesSlotProps>;
|
|
307
344
|
readonly localization?: ComponentType<BuilderLocalizationSlotProps>;
|
|
@@ -338,6 +375,26 @@ interface SubmitResponse {
|
|
|
338
375
|
readonly submissionId?: string;
|
|
339
376
|
readonly submittedAt?: string;
|
|
340
377
|
}
|
|
378
|
+
interface SubmitContext {
|
|
379
|
+
readonly attemptId: string;
|
|
380
|
+
readonly formId: string;
|
|
381
|
+
readonly formVersion: number;
|
|
382
|
+
readonly locale?: string;
|
|
383
|
+
readonly submittedAt: string;
|
|
384
|
+
}
|
|
385
|
+
interface FormRendererMessages {
|
|
386
|
+
readonly submitButton?: string;
|
|
387
|
+
readonly submittingButton?: string;
|
|
388
|
+
readonly retryButton?: string;
|
|
389
|
+
readonly requiredField?: string;
|
|
390
|
+
readonly alreadySubmittedTitle?: string;
|
|
391
|
+
readonly alreadySubmittedMessage?: string;
|
|
392
|
+
readonly serverErrorSummary?: string;
|
|
393
|
+
readonly confirmSensitiveDataTitle?: string;
|
|
394
|
+
readonly confirmSensitiveDataMessage?: string;
|
|
395
|
+
readonly confirmButton?: string;
|
|
396
|
+
readonly cancelButton?: string;
|
|
397
|
+
}
|
|
341
398
|
interface FormSubmittedAnswerItem {
|
|
342
399
|
readonly fieldId: string;
|
|
343
400
|
readonly title: string;
|
|
@@ -350,7 +407,7 @@ interface FormSubmittedAnswerItem {
|
|
|
350
407
|
interface FormCompletionSlotProps {
|
|
351
408
|
readonly message?: string;
|
|
352
409
|
readonly schema: FormSchema;
|
|
353
|
-
readonly answers: Record<string, unknown
|
|
410
|
+
readonly answers: Readonly<Record<string, unknown>>;
|
|
354
411
|
readonly submittedItems: readonly FormSubmittedAnswerItem[];
|
|
355
412
|
readonly response?: SubmitResponse;
|
|
356
413
|
readonly onReset?: () => void;
|
|
@@ -363,7 +420,7 @@ declare class FormSubmissionError extends Error {
|
|
|
363
420
|
readonly payload: FormServerErrorPayload;
|
|
364
421
|
constructor(message: string, payload?: FormServerErrorPayload);
|
|
365
422
|
}
|
|
366
|
-
type FormSubmitHandler = (answers: FormValues) => SubmitResponse | void | Promise<SubmitResponse | undefined> | Promise<void>;
|
|
423
|
+
type FormSubmitHandler = (answers: FormValues, context: SubmitContext) => SubmitResponse | void | Promise<SubmitResponse | undefined> | Promise<void>;
|
|
367
424
|
type SubmissionGuardResult = {
|
|
368
425
|
readonly status: "allow";
|
|
369
426
|
} | {
|
|
@@ -427,8 +484,7 @@ interface FormRendererSlots {
|
|
|
427
484
|
readonly renderValidationSummary?: (props: {
|
|
428
485
|
readonly issues: readonly ValidationError[];
|
|
429
486
|
}) => ReactNode;
|
|
430
|
-
|
|
431
|
-
readonly renderCompletion?: (props: {
|
|
487
|
+
readonly renderCompletion?: (props: FormCompletionSlotProps & {
|
|
432
488
|
readonly message: string;
|
|
433
489
|
}) => ReactNode;
|
|
434
490
|
readonly renderSubmittedValues?: (props: {
|
|
@@ -507,7 +563,7 @@ interface FormContextValue {
|
|
|
507
563
|
readonly restoreValues: (values: FormValues) => void;
|
|
508
564
|
readonly validatePage: (pageIndex: number) => AnswerValidationResult;
|
|
509
565
|
readonly reset: () => void;
|
|
510
|
-
readonly submit: (beforeSubmit?: BeforeSubmit,
|
|
566
|
+
readonly submit: (beforeSubmit?: BeforeSubmit, submitContext?: SubmitContext) => Promise<SubmitResult>;
|
|
511
567
|
readonly translate: (key: string, params?: Readonly<Record<string, string | number>>) => string;
|
|
512
568
|
}
|
|
513
569
|
interface FormProviderProps {
|
|
@@ -529,6 +585,23 @@ interface FieldState {
|
|
|
529
585
|
}
|
|
530
586
|
declare function useField(fieldId: string): FieldState;
|
|
531
587
|
|
|
588
|
+
declare const BUILDER_TRANSLATION_KEYS: {
|
|
589
|
+
readonly ADD_FIELD: "builder.actions.addField";
|
|
590
|
+
readonly SELECT_FIELD_TYPE: "builder.fields.selectType";
|
|
591
|
+
readonly SELECT_LOCALE_TO_ADD: "builder.localization.selectLocaleToAdd";
|
|
592
|
+
readonly FIELD_TYPE_TEXT: "builder.fields.typeText";
|
|
593
|
+
readonly FIELD_TYPE_TEXTAREA: "builder.fields.typeTextarea";
|
|
594
|
+
readonly FIELD_TYPE_NUMBER: "builder.fields.typeNumber";
|
|
595
|
+
readonly FIELD_TYPE_RATING: "builder.fields.typeRating";
|
|
596
|
+
readonly FIELD_TYPE_RADIO: "builder.fields.typeRadio";
|
|
597
|
+
readonly FIELD_TYPE_CHECKBOX: "builder.fields.typeCheckbox";
|
|
598
|
+
readonly FIELD_TYPE_SELECT: "builder.fields.typeSelect";
|
|
599
|
+
readonly FIELD_TYPE_MULTI_SELECT: "builder.fields.typeMultiSelect";
|
|
600
|
+
};
|
|
601
|
+
type BuilderTranslationKey = (typeof BUILDER_TRANSLATION_KEYS)[keyof typeof BUILDER_TRANSLATION_KEYS];
|
|
602
|
+
/** Legacy keys are checked when an older catalog does not contain a canonical key. */
|
|
603
|
+
declare const BUILDER_TRANSLATION_ALIASES: Readonly<Record<string, string>>;
|
|
604
|
+
|
|
532
605
|
interface FieldComponentProps {
|
|
533
606
|
readonly field: FormField;
|
|
534
607
|
readonly value: FormValue;
|
|
@@ -556,6 +629,9 @@ interface FormRendererPresentationProps extends SubmissionProtectionProps {
|
|
|
556
629
|
readonly hideFormOnSuccess?: boolean;
|
|
557
630
|
readonly successMessageKey?: string;
|
|
558
631
|
readonly errorMessageKey?: string;
|
|
632
|
+
readonly attemptIdFactory?: () => string;
|
|
633
|
+
readonly messages?: Partial<FormRendererMessages>;
|
|
634
|
+
readonly messageResolver?: (key: keyof FormRendererMessages, defaultText: string) => string;
|
|
559
635
|
readonly autoSaveKey?: string;
|
|
560
636
|
readonly beforeSubmit?: BeforeSubmit;
|
|
561
637
|
readonly onDraftSave?: (draft: FormValues) => void;
|
|
@@ -572,4 +648,4 @@ interface StandaloneFormRendererProps extends FormRendererPresentationProps {
|
|
|
572
648
|
type FormRendererProps = FormRendererPresentationProps | StandaloneFormRendererProps;
|
|
573
649
|
declare function FormRenderer(props: FormRendererProps): react.JSX.Element;
|
|
574
650
|
|
|
575
|
-
export { type BeforeSubmit, type BuilderActionContext, type BuilderActionError, type BuilderActionIconType, type BuilderActionResult, type BuilderButtonProps, type BuilderCheckboxProps, type BuilderErrorMessageProps, type BuilderFactories, type BuilderFieldEditorSlotProps, type BuilderFieldsetProps, type BuilderIconButtonProps, type BuilderIdKind, type BuilderLocalizationSlotProps, type BuilderOptionEditorSlotProps, type BuilderPagesSlotProps, type BuilderPolicy, type BuilderSectionProps, type BuilderSelectOption, type BuilderSelectProps, type BuilderSlotActions, type BuilderTextAreaProps, type BuilderTextInputProps, type BuilderTextTarget, type BuilderToolbarSlotProps, type BuilderTranslationActionsSlotProps, type ComponentBaseProps, type FieldComponentProps, type FieldComponents, type FieldState, FormBuilder, type FormBuilderActions, type FormBuilderComponents, type FormBuilderFeatures, type FormBuilderOptions, type FormBuilderProps, type FormBuilderResult, type FormBuilderSectionName, type FormBuilderSlots, type FormCompletionSlotProps, type FormContextValue, type FormFieldsSlotProps, FormProvider, type FormProviderProps, FormRenderer, type FormRendererPresentationProps, type FormRendererProps, type FormRendererSlots, type FormServerErrorPayload, FormSubmissionError, type FormSubmitHandler, type FormSubmitState, type FormSubmitStatus, type FormSubmittedAnswerItem, type FormSuccessRenderMode, type IconButtonProps, type InputComponentProps, type ManualTranslationContext, type ManualTranslationTarget, type RenderSubmitButtonProps, type StandaloneFormRendererProps, type SubmissionAttempt, type SubmissionAttemptStore, type SubmissionConfirmationRenderMode, type SubmissionConfirmationSlotProps, type SubmissionGuard, type SubmissionGuardResult, type SubmissionProtectionProps, type SubmissionReceipt, type SubmissionReceiptQuery, type SubmissionReceiptStore, type SubmitResponse, type SubmitResult, type SubmitStatus, type UseSubmissionReceiptsResult, createLocalStorageSubmissionAttemptStore, createLocalStorageSubmissionReceiptStore, resolveInitialFieldType, submissionReceiptQueryKey, useField, useForm, useFormBuilder, useSubmissionReceipts };
|
|
651
|
+
export { BUILDER_TRANSLATION_ALIASES, BUILDER_TRANSLATION_KEYS, type BeforeSubmit, type BuilderActionContext, type BuilderActionError, type BuilderActionIconType, type BuilderActionResult, type BuilderButtonProps, type BuilderCheckboxProps, type BuilderErrorMessageProps, type BuilderFactories, type BuilderFieldEditorSlotProps, type BuilderFieldsetProps, type BuilderIconButtonProps, type BuilderIdKind, type BuilderLocalizationSlotProps, type BuilderOptionEditorSlotProps, type BuilderPagesSlotProps, type BuilderPolicy, type BuilderSectionProps, type BuilderSelectOption, type BuilderSelectProps, type BuilderSlotActions, type BuilderTextAreaProps, type BuilderTextInputProps, type BuilderTextTarget, type BuilderToolbarSlotProps, type BuilderTranslationActionsSlotProps, type BuilderTranslationKey, type ComponentBaseProps, type FieldComponentProps, type FieldComponents, type FieldEditorHeaderSlotProps, type FieldState, type FieldTypeSelectSlotProps, FormBuilder, type FormBuilderActions, type FormBuilderComponents, type FormBuilderFeatures, type FormBuilderOptions, type FormBuilderProps, type FormBuilderResult, type FormBuilderSectionName, type FormBuilderSlots, type FormCompletionSlotProps, type FormContextValue, type FormFieldsSlotProps, FormProvider, type FormProviderProps, FormRenderer, type FormRendererMessages, type FormRendererPresentationProps, type FormRendererProps, type FormRendererSlots, type FormServerErrorPayload, FormSubmissionError, type FormSubmitHandler, type FormSubmitState, type FormSubmitStatus, type FormSubmittedAnswerItem, type FormSuccessRenderMode, type IconButtonProps, type InputComponentProps, type LocalizationSummaryContext, type ManualTranslationContext, type ManualTranslationTarget, type RenderSubmitButtonProps, type SelectComponentProps, type StandaloneFormRendererProps, type SubmissionAttempt, type SubmissionAttemptStore, type SubmissionConfirmationRenderMode, type SubmissionConfirmationSlotProps, type SubmissionGuard, type SubmissionGuardResult, type SubmissionProtectionProps, type SubmissionReceipt, type SubmissionReceiptQuery, type SubmissionReceiptStore, type SubmitContext, type SubmitResponse, type SubmitResult, type SubmitStatus, type UseSubmissionReceiptsResult, createLocalStorageSubmissionAttemptStore, createLocalStorageSubmissionReceiptStore, resolveInitialFieldType, submissionReceiptQueryKey, useField, useForm, useFormBuilder, useSubmissionReceipts };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { QuestionType, FormField, ChoiceOption, FormPage, FormSchema, DisplayCondition, JsonValue, SchemaIssue, FormPolicy, Question, FieldOption, TranslationReport, ValidationError, FormValues, TranslationAdapter, AsyncTranslationAdapter, PopulateTranslationOptions, FormValue, ValidationIssue, AnswerValidationResult, FieldType } from '@form-engine-ts/core';
|
|
2
|
+
export { QuestionType } from '@form-engine-ts/core';
|
|
1
3
|
import * as react from 'react';
|
|
2
|
-
import { ReactNode, ComponentType, MouseEvent } from 'react';
|
|
3
|
-
import { QuestionType, FormField, ChoiceOption, FormPage, FormSchema, DisplayCondition, JsonValue, SchemaIssue, FormPolicy, FieldOption, TranslationReport, ValidationError, FormValues, TranslationAdapter, AsyncTranslationAdapter, PopulateTranslationOptions, FormValue, ValidationIssue, AnswerValidationResult, FieldType } from '@form-engine-ts/core';
|
|
4
|
+
import { ReactNode, ComponentType, KeyboardEvent, MouseEvent } from 'react';
|
|
4
5
|
import { SensitiveDataFinding } from '@form-engine-ts/privacy';
|
|
5
6
|
|
|
6
7
|
interface SubmissionAttempt {
|
|
@@ -139,6 +140,7 @@ interface ComponentBaseProps {
|
|
|
139
140
|
type BuilderActionIconType = "moveUp" | "moveDown" | "delete" | "add" | "edit" | "settings" | "translate" | "close" | "dragHandle";
|
|
140
141
|
interface BuilderButtonProps extends ComponentBaseProps {
|
|
141
142
|
readonly onClick?: () => void;
|
|
143
|
+
readonly noWrap?: boolean;
|
|
142
144
|
readonly variant?: "primary" | "secondary" | "danger";
|
|
143
145
|
readonly children: ReactNode;
|
|
144
146
|
readonly title?: string;
|
|
@@ -165,6 +167,7 @@ interface InputComponentProps extends ComponentBaseProps {
|
|
|
165
167
|
readonly helperText?: string;
|
|
166
168
|
readonly value: string;
|
|
167
169
|
readonly onChange: (value: string) => void;
|
|
170
|
+
readonly onKeyDown?: (event: KeyboardEvent<HTMLElement>) => void;
|
|
168
171
|
readonly placeholder?: string;
|
|
169
172
|
readonly maxLength?: number;
|
|
170
173
|
}
|
|
@@ -181,10 +184,21 @@ interface BuilderTextAreaProps extends InputComponentProps {
|
|
|
181
184
|
interface BuilderSelectOption {
|
|
182
185
|
readonly label: string;
|
|
183
186
|
readonly value: string;
|
|
187
|
+
readonly icon?: ReactNode;
|
|
188
|
+
readonly description?: string;
|
|
184
189
|
readonly disabled?: boolean;
|
|
190
|
+
readonly kind?: string;
|
|
191
|
+
readonly metadata?: Readonly<Record<string, unknown>>;
|
|
192
|
+
}
|
|
193
|
+
interface SelectComponentProps extends InputComponentProps {
|
|
194
|
+
readonly options: readonly (string | BuilderSelectOption)[];
|
|
195
|
+
readonly renderOption?: (option: BuilderSelectOption) => ReactNode;
|
|
196
|
+
readonly renderValue?: (option: BuilderSelectOption | undefined) => ReactNode;
|
|
185
197
|
}
|
|
186
198
|
interface BuilderSelectProps extends InputComponentProps {
|
|
187
199
|
readonly options: readonly BuilderSelectOption[];
|
|
200
|
+
readonly renderOption?: (option: BuilderSelectOption) => ReactNode;
|
|
201
|
+
readonly renderValue?: (option: BuilderSelectOption | undefined) => ReactNode;
|
|
188
202
|
}
|
|
189
203
|
interface BuilderCheckboxProps extends ComponentBaseProps {
|
|
190
204
|
readonly name?: string;
|
|
@@ -227,6 +241,7 @@ interface FormBuilderComponents {
|
|
|
227
241
|
readonly message: string;
|
|
228
242
|
}>;
|
|
229
243
|
readonly renderIcon?: (actionType: BuilderActionIconType) => ReactNode;
|
|
244
|
+
readonly renderFieldTypeIcon?: (type: QuestionType) => ReactNode;
|
|
230
245
|
}
|
|
231
246
|
type FormBuilderActions = Omit<FormBuilderResult, "schema" | "validationIssues">;
|
|
232
247
|
interface ManualTranslationTarget {
|
|
@@ -263,6 +278,21 @@ interface BuilderFieldEditorSlotProps extends BuilderSlotBaseProps {
|
|
|
263
278
|
readonly localization?: boolean;
|
|
264
279
|
readonly conditions?: boolean;
|
|
265
280
|
};
|
|
281
|
+
readonly slots?: Pick<FormBuilderSlots, "fieldTypeSelect" | "fieldEditorHeader">;
|
|
282
|
+
}
|
|
283
|
+
interface FieldTypeSelectSlotProps {
|
|
284
|
+
readonly currentType: QuestionType;
|
|
285
|
+
readonly allowedTypes: readonly QuestionType[];
|
|
286
|
+
readonly onChangeType: (nextType: QuestionType) => void;
|
|
287
|
+
readonly disabled?: boolean;
|
|
288
|
+
readonly readOnly?: boolean;
|
|
289
|
+
readonly renderIcon?: (type: QuestionType) => ReactNode;
|
|
290
|
+
}
|
|
291
|
+
interface FieldEditorHeaderSlotProps {
|
|
292
|
+
readonly field: Question;
|
|
293
|
+
readonly index: number;
|
|
294
|
+
readonly totalFields: number;
|
|
295
|
+
readonly actions: FormBuilderActions;
|
|
266
296
|
}
|
|
267
297
|
interface BuilderOptionEditorSlotProps extends BuilderSlotBaseProps {
|
|
268
298
|
readonly field: FormField & {
|
|
@@ -289,6 +319,11 @@ interface BuilderLocalizationSlotProps extends BuilderSlotBaseProps {
|
|
|
289
319
|
readonly policy?: FormPolicy;
|
|
290
320
|
readonly translationAdapterAvailable?: boolean;
|
|
291
321
|
}
|
|
322
|
+
interface LocalizationSummaryContext {
|
|
323
|
+
readonly defaultLocale: string;
|
|
324
|
+
readonly supportedLocales: readonly string[];
|
|
325
|
+
readonly totalLocales: number;
|
|
326
|
+
}
|
|
292
327
|
interface BuilderTranslationActionsSlotProps extends BuilderSlotBaseProps {
|
|
293
328
|
readonly currentLocale: string;
|
|
294
329
|
readonly onAutoTranslate: () => void;
|
|
@@ -302,6 +337,8 @@ type FormBuilderSectionName = "basicSettings" | "completionMessage" | "questions
|
|
|
302
337
|
interface FormBuilderSlots {
|
|
303
338
|
readonly toolbar?: ComponentType<BuilderToolbarSlotProps>;
|
|
304
339
|
readonly fieldEditor?: ComponentType<BuilderFieldEditorSlotProps>;
|
|
340
|
+
readonly fieldTypeSelect?: ComponentType<FieldTypeSelectSlotProps>;
|
|
341
|
+
readonly fieldEditorHeader?: ComponentType<FieldEditorHeaderSlotProps>;
|
|
305
342
|
readonly optionEditor?: ComponentType<BuilderOptionEditorSlotProps>;
|
|
306
343
|
readonly pages?: ComponentType<BuilderPagesSlotProps>;
|
|
307
344
|
readonly localization?: ComponentType<BuilderLocalizationSlotProps>;
|
|
@@ -338,6 +375,26 @@ interface SubmitResponse {
|
|
|
338
375
|
readonly submissionId?: string;
|
|
339
376
|
readonly submittedAt?: string;
|
|
340
377
|
}
|
|
378
|
+
interface SubmitContext {
|
|
379
|
+
readonly attemptId: string;
|
|
380
|
+
readonly formId: string;
|
|
381
|
+
readonly formVersion: number;
|
|
382
|
+
readonly locale?: string;
|
|
383
|
+
readonly submittedAt: string;
|
|
384
|
+
}
|
|
385
|
+
interface FormRendererMessages {
|
|
386
|
+
readonly submitButton?: string;
|
|
387
|
+
readonly submittingButton?: string;
|
|
388
|
+
readonly retryButton?: string;
|
|
389
|
+
readonly requiredField?: string;
|
|
390
|
+
readonly alreadySubmittedTitle?: string;
|
|
391
|
+
readonly alreadySubmittedMessage?: string;
|
|
392
|
+
readonly serverErrorSummary?: string;
|
|
393
|
+
readonly confirmSensitiveDataTitle?: string;
|
|
394
|
+
readonly confirmSensitiveDataMessage?: string;
|
|
395
|
+
readonly confirmButton?: string;
|
|
396
|
+
readonly cancelButton?: string;
|
|
397
|
+
}
|
|
341
398
|
interface FormSubmittedAnswerItem {
|
|
342
399
|
readonly fieldId: string;
|
|
343
400
|
readonly title: string;
|
|
@@ -350,7 +407,7 @@ interface FormSubmittedAnswerItem {
|
|
|
350
407
|
interface FormCompletionSlotProps {
|
|
351
408
|
readonly message?: string;
|
|
352
409
|
readonly schema: FormSchema;
|
|
353
|
-
readonly answers: Record<string, unknown
|
|
410
|
+
readonly answers: Readonly<Record<string, unknown>>;
|
|
354
411
|
readonly submittedItems: readonly FormSubmittedAnswerItem[];
|
|
355
412
|
readonly response?: SubmitResponse;
|
|
356
413
|
readonly onReset?: () => void;
|
|
@@ -363,7 +420,7 @@ declare class FormSubmissionError extends Error {
|
|
|
363
420
|
readonly payload: FormServerErrorPayload;
|
|
364
421
|
constructor(message: string, payload?: FormServerErrorPayload);
|
|
365
422
|
}
|
|
366
|
-
type FormSubmitHandler = (answers: FormValues) => SubmitResponse | void | Promise<SubmitResponse | undefined> | Promise<void>;
|
|
423
|
+
type FormSubmitHandler = (answers: FormValues, context: SubmitContext) => SubmitResponse | void | Promise<SubmitResponse | undefined> | Promise<void>;
|
|
367
424
|
type SubmissionGuardResult = {
|
|
368
425
|
readonly status: "allow";
|
|
369
426
|
} | {
|
|
@@ -427,8 +484,7 @@ interface FormRendererSlots {
|
|
|
427
484
|
readonly renderValidationSummary?: (props: {
|
|
428
485
|
readonly issues: readonly ValidationError[];
|
|
429
486
|
}) => ReactNode;
|
|
430
|
-
|
|
431
|
-
readonly renderCompletion?: (props: {
|
|
487
|
+
readonly renderCompletion?: (props: FormCompletionSlotProps & {
|
|
432
488
|
readonly message: string;
|
|
433
489
|
}) => ReactNode;
|
|
434
490
|
readonly renderSubmittedValues?: (props: {
|
|
@@ -507,7 +563,7 @@ interface FormContextValue {
|
|
|
507
563
|
readonly restoreValues: (values: FormValues) => void;
|
|
508
564
|
readonly validatePage: (pageIndex: number) => AnswerValidationResult;
|
|
509
565
|
readonly reset: () => void;
|
|
510
|
-
readonly submit: (beforeSubmit?: BeforeSubmit,
|
|
566
|
+
readonly submit: (beforeSubmit?: BeforeSubmit, submitContext?: SubmitContext) => Promise<SubmitResult>;
|
|
511
567
|
readonly translate: (key: string, params?: Readonly<Record<string, string | number>>) => string;
|
|
512
568
|
}
|
|
513
569
|
interface FormProviderProps {
|
|
@@ -529,6 +585,23 @@ interface FieldState {
|
|
|
529
585
|
}
|
|
530
586
|
declare function useField(fieldId: string): FieldState;
|
|
531
587
|
|
|
588
|
+
declare const BUILDER_TRANSLATION_KEYS: {
|
|
589
|
+
readonly ADD_FIELD: "builder.actions.addField";
|
|
590
|
+
readonly SELECT_FIELD_TYPE: "builder.fields.selectType";
|
|
591
|
+
readonly SELECT_LOCALE_TO_ADD: "builder.localization.selectLocaleToAdd";
|
|
592
|
+
readonly FIELD_TYPE_TEXT: "builder.fields.typeText";
|
|
593
|
+
readonly FIELD_TYPE_TEXTAREA: "builder.fields.typeTextarea";
|
|
594
|
+
readonly FIELD_TYPE_NUMBER: "builder.fields.typeNumber";
|
|
595
|
+
readonly FIELD_TYPE_RATING: "builder.fields.typeRating";
|
|
596
|
+
readonly FIELD_TYPE_RADIO: "builder.fields.typeRadio";
|
|
597
|
+
readonly FIELD_TYPE_CHECKBOX: "builder.fields.typeCheckbox";
|
|
598
|
+
readonly FIELD_TYPE_SELECT: "builder.fields.typeSelect";
|
|
599
|
+
readonly FIELD_TYPE_MULTI_SELECT: "builder.fields.typeMultiSelect";
|
|
600
|
+
};
|
|
601
|
+
type BuilderTranslationKey = (typeof BUILDER_TRANSLATION_KEYS)[keyof typeof BUILDER_TRANSLATION_KEYS];
|
|
602
|
+
/** Legacy keys are checked when an older catalog does not contain a canonical key. */
|
|
603
|
+
declare const BUILDER_TRANSLATION_ALIASES: Readonly<Record<string, string>>;
|
|
604
|
+
|
|
532
605
|
interface FieldComponentProps {
|
|
533
606
|
readonly field: FormField;
|
|
534
607
|
readonly value: FormValue;
|
|
@@ -556,6 +629,9 @@ interface FormRendererPresentationProps extends SubmissionProtectionProps {
|
|
|
556
629
|
readonly hideFormOnSuccess?: boolean;
|
|
557
630
|
readonly successMessageKey?: string;
|
|
558
631
|
readonly errorMessageKey?: string;
|
|
632
|
+
readonly attemptIdFactory?: () => string;
|
|
633
|
+
readonly messages?: Partial<FormRendererMessages>;
|
|
634
|
+
readonly messageResolver?: (key: keyof FormRendererMessages, defaultText: string) => string;
|
|
559
635
|
readonly autoSaveKey?: string;
|
|
560
636
|
readonly beforeSubmit?: BeforeSubmit;
|
|
561
637
|
readonly onDraftSave?: (draft: FormValues) => void;
|
|
@@ -572,4 +648,4 @@ interface StandaloneFormRendererProps extends FormRendererPresentationProps {
|
|
|
572
648
|
type FormRendererProps = FormRendererPresentationProps | StandaloneFormRendererProps;
|
|
573
649
|
declare function FormRenderer(props: FormRendererProps): react.JSX.Element;
|
|
574
650
|
|
|
575
|
-
export { type BeforeSubmit, type BuilderActionContext, type BuilderActionError, type BuilderActionIconType, type BuilderActionResult, type BuilderButtonProps, type BuilderCheckboxProps, type BuilderErrorMessageProps, type BuilderFactories, type BuilderFieldEditorSlotProps, type BuilderFieldsetProps, type BuilderIconButtonProps, type BuilderIdKind, type BuilderLocalizationSlotProps, type BuilderOptionEditorSlotProps, type BuilderPagesSlotProps, type BuilderPolicy, type BuilderSectionProps, type BuilderSelectOption, type BuilderSelectProps, type BuilderSlotActions, type BuilderTextAreaProps, type BuilderTextInputProps, type BuilderTextTarget, type BuilderToolbarSlotProps, type BuilderTranslationActionsSlotProps, type ComponentBaseProps, type FieldComponentProps, type FieldComponents, type FieldState, FormBuilder, type FormBuilderActions, type FormBuilderComponents, type FormBuilderFeatures, type FormBuilderOptions, type FormBuilderProps, type FormBuilderResult, type FormBuilderSectionName, type FormBuilderSlots, type FormCompletionSlotProps, type FormContextValue, type FormFieldsSlotProps, FormProvider, type FormProviderProps, FormRenderer, type FormRendererPresentationProps, type FormRendererProps, type FormRendererSlots, type FormServerErrorPayload, FormSubmissionError, type FormSubmitHandler, type FormSubmitState, type FormSubmitStatus, type FormSubmittedAnswerItem, type FormSuccessRenderMode, type IconButtonProps, type InputComponentProps, type ManualTranslationContext, type ManualTranslationTarget, type RenderSubmitButtonProps, type StandaloneFormRendererProps, type SubmissionAttempt, type SubmissionAttemptStore, type SubmissionConfirmationRenderMode, type SubmissionConfirmationSlotProps, type SubmissionGuard, type SubmissionGuardResult, type SubmissionProtectionProps, type SubmissionReceipt, type SubmissionReceiptQuery, type SubmissionReceiptStore, type SubmitResponse, type SubmitResult, type SubmitStatus, type UseSubmissionReceiptsResult, createLocalStorageSubmissionAttemptStore, createLocalStorageSubmissionReceiptStore, resolveInitialFieldType, submissionReceiptQueryKey, useField, useForm, useFormBuilder, useSubmissionReceipts };
|
|
651
|
+
export { BUILDER_TRANSLATION_ALIASES, BUILDER_TRANSLATION_KEYS, type BeforeSubmit, type BuilderActionContext, type BuilderActionError, type BuilderActionIconType, type BuilderActionResult, type BuilderButtonProps, type BuilderCheckboxProps, type BuilderErrorMessageProps, type BuilderFactories, type BuilderFieldEditorSlotProps, type BuilderFieldsetProps, type BuilderIconButtonProps, type BuilderIdKind, type BuilderLocalizationSlotProps, type BuilderOptionEditorSlotProps, type BuilderPagesSlotProps, type BuilderPolicy, type BuilderSectionProps, type BuilderSelectOption, type BuilderSelectProps, type BuilderSlotActions, type BuilderTextAreaProps, type BuilderTextInputProps, type BuilderTextTarget, type BuilderToolbarSlotProps, type BuilderTranslationActionsSlotProps, type BuilderTranslationKey, type ComponentBaseProps, type FieldComponentProps, type FieldComponents, type FieldEditorHeaderSlotProps, type FieldState, type FieldTypeSelectSlotProps, FormBuilder, type FormBuilderActions, type FormBuilderComponents, type FormBuilderFeatures, type FormBuilderOptions, type FormBuilderProps, type FormBuilderResult, type FormBuilderSectionName, type FormBuilderSlots, type FormCompletionSlotProps, type FormContextValue, type FormFieldsSlotProps, FormProvider, type FormProviderProps, FormRenderer, type FormRendererMessages, type FormRendererPresentationProps, type FormRendererProps, type FormRendererSlots, type FormServerErrorPayload, FormSubmissionError, type FormSubmitHandler, type FormSubmitState, type FormSubmitStatus, type FormSubmittedAnswerItem, type FormSuccessRenderMode, type IconButtonProps, type InputComponentProps, type LocalizationSummaryContext, type ManualTranslationContext, type ManualTranslationTarget, type RenderSubmitButtonProps, type SelectComponentProps, type StandaloneFormRendererProps, type SubmissionAttempt, type SubmissionAttemptStore, type SubmissionConfirmationRenderMode, type SubmissionConfirmationSlotProps, type SubmissionGuard, type SubmissionGuardResult, type SubmissionProtectionProps, type SubmissionReceipt, type SubmissionReceiptQuery, type SubmissionReceiptStore, type SubmitContext, type SubmitResponse, type SubmitResult, type SubmitStatus, type UseSubmissionReceiptsResult, createLocalStorageSubmissionAttemptStore, createLocalStorageSubmissionReceiptStore, resolveInitialFieldType, submissionReceiptQueryKey, useField, useForm, useFormBuilder, useSubmissionReceipts };
|