@wise/dynamic-flow-client 2.9.3 → 2.9.4
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/build/i18n/pt.json +1 -1
- package/build/i18n/th.json +3 -3
- package/build/main.css +2 -2
- package/build/main.js +20 -11
- package/build/main.min.js +1 -1
- package/build/types/legacy/formControl/utils/getAutocompleteString.d.ts +1 -1
- package/build/types/legacy/layout/modal/DynamicModal.d.ts +3 -3
- package/build/types/revamp/DynamicFlowCore.d.ts +2 -3
- package/build/types/revamp/DynamicFlowWise.d.ts +1 -1
- package/build/types/revamp/domain/components/AllOfComponent.d.ts +2 -2
- package/build/types/revamp/domain/components/BooleanInputComponent.d.ts +5 -3
- package/build/types/revamp/domain/components/ConstComponent.d.ts +3 -2
- package/build/types/revamp/domain/components/ContainerComponent.d.ts +3 -3
- package/build/types/revamp/domain/components/DateInputComponent.d.ts +4 -2
- package/build/types/revamp/domain/components/IntegerInputComponent.d.ts +4 -2
- package/build/types/revamp/domain/components/MultiUploadInputComponent.d.ts +21 -0
- package/build/types/revamp/domain/components/NumberInputComponent.d.ts +4 -2
- package/build/types/revamp/domain/components/ObjectComponent.d.ts +3 -11
- package/build/types/revamp/domain/components/SelectInputComponent.d.ts +5 -4
- package/build/types/revamp/domain/components/TextInputComponent.d.ts +4 -2
- package/build/types/revamp/domain/components/UploadInputComponent.d.ts +7 -4
- package/build/types/revamp/domain/components/repeatableComponent/RepeatableComponent.d.ts +7 -14
- package/build/types/revamp/domain/components/utils/file-utils.d.ts +1 -0
- package/build/types/revamp/domain/components/utils/isModelMatchWithValue.d.ts +3 -0
- package/build/types/revamp/domain/components/utils/isModelMatchWithValue.spec..d.ts +1 -0
- package/build/types/revamp/domain/features/persistAsync/getComponentPersistAsync.d.ts +7 -1
- package/build/types/revamp/domain/features/persistAsync/getPerformPersistAsync.d.ts +4 -4
- package/build/types/revamp/domain/features/persistAsync/persist-async-utils.d.ts +1 -1
- package/build/types/revamp/domain/features/search/getPerformSearchFunction.d.ts +1 -1
- package/build/types/revamp/domain/features/summary/summary-utils.d.ts +2 -2
- package/build/types/revamp/domain/features/validation/spec-utils.d.ts +2 -0
- package/build/types/revamp/domain/features/validation/validation-functions.d.ts +3 -3
- package/build/types/revamp/domain/features/validation/value-checks.d.ts +9 -6
- package/build/types/revamp/domain/mappers/layout/alertLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/boxLayoutToComponents.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/buttonLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/columnsLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/decisionLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/dividerLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/formLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/headingLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/imageLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/infoLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/instructionsLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/listLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/loadingIndicatorLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/markdownLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/modalLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/paragraphLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/reviewLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/searchLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/layout/statusListLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/mapLayoutToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/schema/arraySchemaToComponent/arraySchemaToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/schema/arraySchemaToComponent/arraySchemaToMultiUploadComponent.d.ts +9 -0
- package/build/types/revamp/domain/mappers/schema/blobSchemaToComponent.d.ts +5 -0
- package/build/types/revamp/domain/mappers/schema/constSchemaToComponent.d.ts +1 -1
- package/build/types/revamp/domain/mappers/schema/tests/test-utils.d.ts +1 -0
- package/build/types/revamp/domain/mappers/schema/types.d.ts +2 -1
- package/build/types/revamp/domain/mappers/schema/utils/mapCommonSchemaProps.d.ts +1 -1
- package/build/types/revamp/domain/mappers/types.d.ts +2 -0
- package/build/types/revamp/domain/types.d.ts +37 -18
- package/build/types/revamp/flow/getResponseType.d.ts +10 -0
- package/build/types/revamp/flow/performAction.d.ts +25 -0
- package/build/types/revamp/flow/response-utils.d.ts +6 -0
- package/build/types/revamp/renderers/CoreContainerRenderer.d.ts +2 -2
- package/build/types/revamp/renderers/mappers/instructionsComponentToProps.d.ts +2 -7
- package/build/types/revamp/renderers/mappers/multiUploadInputComponentToProps.d.ts +3 -0
- package/build/types/revamp/renderers/mappers/repeatableComponentToProps.d.ts +1 -1
- package/build/types/revamp/renderers/mappers/utils/inputComponentToProps.d.ts +3 -3
- package/build/types/revamp/renderers/types.d.ts +112 -66
- package/build/types/revamp/step/Step.d.ts +3 -3
- package/build/types/revamp/step/utils/getRenderFunction.d.ts +2 -2
- package/build/types/revamp/test-utils/step-utils.d.ts +2 -0
- package/build/types/revamp/types.d.ts +41 -0
- package/build/types/revamp/utils/component-utils.d.ts +2 -2
- package/build/types/revamp/utils/findComponent.d.ts +1 -1
- package/build/types/revamp/utils/type-utils.d.ts +11 -1
- package/build/types/revamp/wise/renderers/MultiUploadInputRenderer.d.ts +3 -0
- package/build/types/revamp/wise/renderers/components/LabelContentWithHelp.d.ts +4 -0
- package/build/types/revamp/wise/renderers/components/UploadFieldInput.d.ts +11 -0
- package/build/types/revamp/wise/renderers/getWiseRenderers.d.ts +1 -2
- package/build/types/revamp/wise/renderers/utils/file-utils.d.ts +3 -0
- package/build/types/revamp/wise/renderers/utils/getRandomId.d.ts +1 -0
- package/package.json +24 -24
- package/build/types/revamp/domain/components/utils/isModelPartialOf.d.ts +0 -2
- package/build/types/revamp/dynamic-flow-types.d.ts +0 -38
- /package/build/types/{legacy/jsonSchemaForm/arrayTypeSchema/arrayListSchema/multipleFileUploadSchema/MultipleFileUploadSchema.messages.d.ts → common/messages/multi-file-upload.messages.d.ts} +0 -0
|
@@ -2,7 +2,7 @@ import type { Step as DFStep, Model, Schema, ValidationError } from '@wise/dynam
|
|
|
2
2
|
import type { OnAction, UpdateComponent } from '../../types';
|
|
3
3
|
import type { GetErrorMessageFunctions, PersistAsyncConfig } from '../types';
|
|
4
4
|
import type { AnalyticsEventDispatcher, LoggingEventDispatcher } from '../../features/events';
|
|
5
|
-
import type { HttpClient } from '../../../
|
|
5
|
+
import type { HttpClient } from '../../../types';
|
|
6
6
|
export type MapperProps = {
|
|
7
7
|
step: DFStep;
|
|
8
8
|
getErrorMessageFunctions: GetErrorMessageFunctions;
|
|
@@ -13,6 +13,7 @@ export type MapperProps = {
|
|
|
13
13
|
logEvent: LoggingEventDispatcher;
|
|
14
14
|
};
|
|
15
15
|
export type SchemaMapperProps = {
|
|
16
|
+
uid: string;
|
|
16
17
|
schema: Schema;
|
|
17
18
|
model: Model;
|
|
18
19
|
required?: boolean;
|
|
@@ -14,7 +14,7 @@ export declare const mapCommonSchemaProps: (schemaMapperProps: SchemaMapperProps
|
|
|
14
14
|
required: boolean;
|
|
15
15
|
title: string | undefined;
|
|
16
16
|
performPersistAsync: import("../../../features/persistAsync/getPerformPersistAsync").PerformPersistAsync | undefined;
|
|
17
|
-
summariser: (
|
|
17
|
+
summariser: (value: import("../../../types").LocalValue) => {
|
|
18
18
|
title?: undefined;
|
|
19
19
|
description?: undefined;
|
|
20
20
|
icon?: undefined;
|
|
@@ -8,6 +8,8 @@ export type ErrorMessageFunctions = {
|
|
|
8
8
|
minimumDate: (minDate: string) => string;
|
|
9
9
|
maxLength: (maxLength: number) => string;
|
|
10
10
|
minLength: (minLength: number) => string;
|
|
11
|
+
maxFiles: (maxFiles: number) => string;
|
|
12
|
+
minFiles: (minFiles: number) => string;
|
|
11
13
|
maxItems: (maxItems: number) => string;
|
|
12
14
|
minItems: (minItems: number) => string;
|
|
13
15
|
pattern: () => string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { Action, Icon, Image, Margin, Model } from '@wise/dynamic-flow-types/build/next';
|
|
1
|
+
import type { Action, Icon, Image, JsonElement, Margin, Model } from '@wise/dynamic-flow-types/build/next';
|
|
2
2
|
import type { ConstComponent } from './components/ConstComponent';
|
|
3
3
|
import type { AlertComponent } from './components/AlertComponent';
|
|
4
4
|
import type { AllOfComponent } from './components/AllOfComponent';
|
|
@@ -28,38 +28,55 @@ import type { SelectInputComponent } from './components/SelectInputComponent';
|
|
|
28
28
|
import type { StatusListComponent } from './components/StatusListComponent';
|
|
29
29
|
import type { TextInputComponent } from './components/TextInputComponent';
|
|
30
30
|
import type { UploadInputComponent } from './components/UploadInputComponent';
|
|
31
|
-
|
|
32
|
-
export type
|
|
31
|
+
import type { MultiUploadInputComponent } from './components/MultiUploadInputComponent';
|
|
32
|
+
export type StepComponent = AlertComponent | AllOfComponent | BooleanInputComponent | BoxComponent | ButtonComponent | ColumnsComponent | ConstComponent | ContainerComponent | DateInputComponent | DecisionComponent | DividerComponent | FormComponent | HeadingComponent | ImageComponent | InstructionsComponent | IntegerInputComponent | LoadingIndicatorComponent | MarkdownComponent | ModalComponent | MultiUploadInputComponent | NumberInputComponent | ObjectComponent | ParagraphComponent | RepeatableComponent | ReviewComponent | SearchComponent | SelectInputComponent | StatusListComponent | TextInputComponent | UploadInputComponent;
|
|
33
|
+
export type LocalValue = LocalValuePrimitive | LocalValueObject | LocalValueArray;
|
|
34
|
+
export type LocalValuePrimitive = string | number | boolean | File | null;
|
|
35
|
+
export interface LocalValueObject extends Record<string, LocalValuePrimitive | LocalValueObject | LocalValueArray> {
|
|
36
|
+
}
|
|
37
|
+
export interface LocalValueArray extends Array<LocalValuePrimitive | LocalValueObject | LocalValueArray> {
|
|
38
|
+
}
|
|
39
|
+
export type BaseComponent = {
|
|
33
40
|
type: string;
|
|
34
41
|
uid: string;
|
|
35
42
|
analyticsId?: string;
|
|
36
43
|
getSubmittableValue: () => Promise<Model>;
|
|
37
|
-
getLocalValue: () => M | null;
|
|
38
44
|
getSummary: () => RepeatableSummary;
|
|
39
45
|
validate: () => boolean;
|
|
40
46
|
};
|
|
41
|
-
export type LayoutComponent = BaseComponent
|
|
47
|
+
export type LayoutComponent = BaseComponent & {
|
|
42
48
|
control?: string;
|
|
43
49
|
margin: Margin;
|
|
50
|
+
getLocalValue: () => LocalValueArray | null;
|
|
44
51
|
};
|
|
45
|
-
|
|
46
|
-
id: string;
|
|
47
|
-
autoComplete: string;
|
|
52
|
+
type ComponentWithTitle = BaseComponent & {
|
|
48
53
|
control?: string;
|
|
49
54
|
description?: string;
|
|
55
|
+
help?: string;
|
|
56
|
+
hidden: boolean;
|
|
57
|
+
title?: string;
|
|
58
|
+
};
|
|
59
|
+
export type ListComponent = ComponentWithTitle & {
|
|
60
|
+
components: StepComponent[];
|
|
61
|
+
getChildren: () => StepComponent[];
|
|
62
|
+
getLocalValue: () => LocalValueArray;
|
|
63
|
+
};
|
|
64
|
+
export type MapComponent = ComponentWithTitle & {
|
|
65
|
+
componentMap: Record<string, StepComponent>;
|
|
66
|
+
getChildren: () => StepComponent[];
|
|
67
|
+
getLocalValue: () => LocalValueObject;
|
|
68
|
+
};
|
|
69
|
+
export type InputComponent<V extends LocalValue> = ComponentWithTitle & {
|
|
70
|
+
id: string;
|
|
71
|
+
autoComplete: string;
|
|
50
72
|
disabled: boolean;
|
|
51
73
|
errors: string[];
|
|
52
|
-
help?: string;
|
|
53
74
|
placeholder?: string;
|
|
54
75
|
required: boolean;
|
|
55
|
-
|
|
56
|
-
value: M | null;
|
|
57
|
-
persistedState: PersistedState<M>;
|
|
58
|
-
hidden: boolean;
|
|
59
|
-
onChange: (value: M | null) => void;
|
|
76
|
+
value: V;
|
|
60
77
|
onBlur: () => void;
|
|
61
78
|
onFocus: () => void;
|
|
62
|
-
getLocalValue: () =>
|
|
79
|
+
getLocalValue: () => V;
|
|
63
80
|
};
|
|
64
81
|
export type UpdateComponent = (id: string, update: (component: StepComponent) => void) => void;
|
|
65
82
|
export type OnAction = (action: Action) => Promise<void>;
|
|
@@ -72,8 +89,10 @@ export type RepeatableSummary = {
|
|
|
72
89
|
icon?: Icon;
|
|
73
90
|
image?: Image;
|
|
74
91
|
};
|
|
75
|
-
export type PersistedState
|
|
92
|
+
export type PersistedState = {
|
|
93
|
+
id?: string;
|
|
76
94
|
abortController: AbortController;
|
|
77
|
-
lastSubmitted:
|
|
78
|
-
submission: Promise<
|
|
95
|
+
lastSubmitted: LocalValue;
|
|
96
|
+
submission: Promise<JsonElement | null>;
|
|
79
97
|
};
|
|
98
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
declare const responseTypes: readonly ["step", "action", "exit"];
|
|
2
|
+
export type ResponseType = (typeof responseTypes)[number];
|
|
3
|
+
/**
|
|
4
|
+
* Returns either 'step', 'action', or 'exit' based on the response headers and body.
|
|
5
|
+
* This function is async because, for legacy reasons, we still need to parse the response body as JSON
|
|
6
|
+
* to determine the response type, in cases where the response headers are not set.
|
|
7
|
+
* Ideally it should just be a matter of checking the "X-Df-Response-Type" response header.
|
|
8
|
+
*/
|
|
9
|
+
export declare const getResponseType: (response: Response) => Promise<ResponseType>;
|
|
10
|
+
export {};
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { Action, Model, Step, ErrorResponseBody } from '@wise/dynamic-flow-types/build/next';
|
|
2
|
+
import type { AnalyticsEventDispatcher } from '../domain/features/events';
|
|
3
|
+
type Command = {
|
|
4
|
+
type: 'complete';
|
|
5
|
+
result: Model;
|
|
6
|
+
} | {
|
|
7
|
+
type: 'replace-step';
|
|
8
|
+
step: Step;
|
|
9
|
+
etag: string | null;
|
|
10
|
+
} | {
|
|
11
|
+
type: 'refresh-step';
|
|
12
|
+
step: Step;
|
|
13
|
+
etag: string | null;
|
|
14
|
+
} | {
|
|
15
|
+
type: 'errors';
|
|
16
|
+
errors: ErrorResponseBody;
|
|
17
|
+
};
|
|
18
|
+
export declare const performAction: (props: {
|
|
19
|
+
type: 'submit' | 'refresh';
|
|
20
|
+
action: Action;
|
|
21
|
+
model: Model;
|
|
22
|
+
httpClient: typeof fetch;
|
|
23
|
+
trackEvent: AnalyticsEventDispatcher;
|
|
24
|
+
}) => Promise<Command>;
|
|
25
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { ActionResponseBody, ErrorResponseBody, JsonElement, Step } from '@wise/dynamic-flow-types/build/next';
|
|
2
|
+
export declare const assertResponseIsValid: (response: unknown) => void;
|
|
3
|
+
export declare const parseResponseBodyAsJsonElement: (response: Response) => Promise<JsonElement>;
|
|
4
|
+
export declare function assertActionResponseBody(body: unknown): asserts body is ActionResponseBody;
|
|
5
|
+
export declare function assertErrorResponseBody(body: unknown): asserts body is ErrorResponseBody;
|
|
6
|
+
export declare function assertStepResponseBody(body: unknown): asserts body is Step;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
|
-
import type { Renderer
|
|
3
|
-
export interface CoreContainerRendererProps
|
|
2
|
+
import type { Renderer } from './types';
|
|
3
|
+
export interface CoreContainerRendererProps {
|
|
4
4
|
type: 'container';
|
|
5
5
|
children: ReactNode;
|
|
6
6
|
}
|
|
@@ -1,8 +1,3 @@
|
|
|
1
1
|
import type { InstructionsComponent } from '../../domain/components/InstructionsComponent';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
control: string | undefined;
|
|
5
|
-
items: import("../../domain/components/InstructionsComponent").InstructionItem[];
|
|
6
|
-
margin: import("@wise/dynamic-flow-types/build/next").Size;
|
|
7
|
-
title: string | undefined;
|
|
8
|
-
};
|
|
2
|
+
import type { InstructionsRendererProps } from '../types';
|
|
3
|
+
export declare const instructionsComponentToProps: ({ control, items, margin, title, }: InstructionsComponent) => InstructionsRendererProps;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import type { MultiUploadInputComponent } from '../../domain/components/MultiUploadInputComponent';
|
|
2
|
+
import type { MultiUploadInputRendererProps } from '../types';
|
|
3
|
+
export declare const multiUploadInputComponentToProps: (component: MultiUploadInputComponent) => MultiUploadInputRendererProps;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
2
|
import type { RepeatableRendererProps } from '../types';
|
|
3
3
|
import type { RepeatableComponent } from '../../domain/components/repeatableComponent/RepeatableComponent';
|
|
4
|
-
export declare const repeatableComponentToProps: (component: RepeatableComponent, editableItemChildren: ReactNode) => RepeatableRendererProps;
|
|
4
|
+
export declare const repeatableComponentToProps: (component: RepeatableComponent, children: ReactNode[], editableItemChildren: ReactNode) => RepeatableRendererProps;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type { InputComponent } from '../../../domain/types';
|
|
2
|
-
export declare const inputComponentToProps: <T extends string,
|
|
1
|
+
import type { InputComponent, LocalValue } from '../../../domain/types';
|
|
2
|
+
export declare const inputComponentToProps: <T extends string, V extends LocalValue>(component: InputComponent<V>, type: T) => {
|
|
3
3
|
type: T;
|
|
4
4
|
autoComplete: string;
|
|
5
5
|
control: string | undefined;
|
|
@@ -11,7 +11,7 @@ export declare const inputComponentToProps: <T extends string, M extends import(
|
|
|
11
11
|
label: string | undefined;
|
|
12
12
|
placeholder: string | undefined;
|
|
13
13
|
required: boolean;
|
|
14
|
-
value:
|
|
14
|
+
value: V;
|
|
15
15
|
onBlur: () => void;
|
|
16
16
|
onFocus: () => void;
|
|
17
17
|
};
|
|
@@ -3,10 +3,7 @@ import type { ReactNode } from 'react';
|
|
|
3
3
|
import type { DecisionOption as DomainDecisionOption } from '../domain/components/DecisionComponent';
|
|
4
4
|
import type { InstructionItem as DomainInstructionItem } from '../domain/components/InstructionsComponent';
|
|
5
5
|
import type { ReviewCallToAction as DomainReviewCallToAction, ReviewField as DomainReviewField } from '../domain/components/ReviewComponent';
|
|
6
|
-
|
|
7
|
-
canRender: (props: RendererProps) => boolean;
|
|
8
|
-
render: (props: P) => JSX.Element;
|
|
9
|
-
};
|
|
6
|
+
import type { CoreContainerRendererProps } from './CoreContainerRenderer';
|
|
10
7
|
export type Align = 'start' | 'center' | 'end';
|
|
11
8
|
export type Bias = 'none' | 'start' | 'end';
|
|
12
9
|
export type Context = 'positive' | 'negative' | 'warning' | 'neutral';
|
|
@@ -17,81 +14,96 @@ export type Image = {
|
|
|
17
14
|
accessibilityDescription?: string;
|
|
18
15
|
};
|
|
19
16
|
export type Icon = DFIcon;
|
|
20
|
-
export
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
17
|
+
export type Renderer<P extends RendererProps> = {
|
|
18
|
+
canRenderType: P['type'];
|
|
19
|
+
canRender?: (props: P) => boolean;
|
|
20
|
+
render: (props: P) => JSX.Element;
|
|
21
|
+
};
|
|
22
|
+
export type RendererProps = CoreContainerRendererProps | AlertRendererProps | BoxRendererProps | ColumnsRendererProps | DecisionRendererProps | DividerRendererProps | FormRendererProps | HeadingRendererProps | InstructionsRendererProps | LoadingIndicatorRendererProps | MarkdownRendererProps | ImageRendererProps | ModalRendererProps | ParagraphRendererProps | ReviewRendererProps | SearchRendererProps | StatusListRendererProps | FormSectionRendererProps | BooleanInputRendererProps | ButtonRendererProps | DateInputRendererProps | HiddenRendererProps | IntegerInputRendererProps | NumberInputRendererProps | RepeatableRendererProps | SelectInputRendererProps | TextInputRendererProps | UploadInputRendererProps | MultiUploadInputRendererProps;
|
|
23
|
+
export type AlertRendererProps = {
|
|
25
24
|
type: 'alert';
|
|
25
|
+
control?: string;
|
|
26
26
|
context: Context;
|
|
27
27
|
margin: Margin;
|
|
28
28
|
markdown: string;
|
|
29
|
-
}
|
|
30
|
-
export
|
|
29
|
+
};
|
|
30
|
+
export type BoxRendererProps = {
|
|
31
31
|
type: 'box';
|
|
32
|
+
control?: string;
|
|
32
33
|
border: boolean;
|
|
33
34
|
children: ReactNode;
|
|
34
35
|
margin: Margin;
|
|
35
36
|
width: Size;
|
|
36
|
-
}
|
|
37
|
-
export
|
|
37
|
+
};
|
|
38
|
+
export type ColumnsRendererProps = {
|
|
38
39
|
type: 'columns';
|
|
40
|
+
control?: string;
|
|
39
41
|
bias: Bias;
|
|
40
42
|
margin: Margin;
|
|
41
43
|
startChildren: ReactNode;
|
|
42
44
|
endChildren: ReactNode;
|
|
43
|
-
}
|
|
44
|
-
export
|
|
45
|
+
};
|
|
46
|
+
export type DecisionRendererProps = {
|
|
45
47
|
type: 'decision';
|
|
48
|
+
control?: string;
|
|
46
49
|
options: DecisionOption[];
|
|
47
50
|
margin: Margin;
|
|
48
|
-
}
|
|
51
|
+
};
|
|
49
52
|
export type DecisionOption = DomainDecisionOption;
|
|
50
|
-
export
|
|
53
|
+
export type DividerRendererProps = {
|
|
51
54
|
type: 'divider';
|
|
55
|
+
control?: string;
|
|
52
56
|
margin: Margin;
|
|
53
|
-
}
|
|
54
|
-
export
|
|
57
|
+
};
|
|
58
|
+
export type FormRendererProps = {
|
|
55
59
|
type: 'form';
|
|
60
|
+
control?: string;
|
|
56
61
|
children: ReactNode;
|
|
57
62
|
margin: Margin;
|
|
58
|
-
}
|
|
63
|
+
};
|
|
59
64
|
/**
|
|
60
65
|
* Known values for "control" are: 'display'.
|
|
61
66
|
*/
|
|
62
|
-
export
|
|
67
|
+
export type HeadingRendererProps = {
|
|
63
68
|
type: 'heading';
|
|
69
|
+
control?: string;
|
|
64
70
|
align: Align;
|
|
65
71
|
margin: Margin;
|
|
66
72
|
size: Size;
|
|
67
73
|
text: string;
|
|
68
|
-
}
|
|
69
|
-
export
|
|
74
|
+
};
|
|
75
|
+
export type InstructionsRendererProps = {
|
|
76
|
+
type: 'instructions';
|
|
77
|
+
control?: string;
|
|
70
78
|
items: InstructionItem[];
|
|
71
79
|
margin: Margin;
|
|
72
80
|
title?: string;
|
|
73
|
-
}
|
|
81
|
+
};
|
|
74
82
|
export type InstructionItem = DomainInstructionItem;
|
|
75
|
-
export
|
|
83
|
+
export type LoadingIndicatorRendererProps = {
|
|
76
84
|
type: 'loading-indicator';
|
|
85
|
+
control?: string;
|
|
77
86
|
margin: Margin;
|
|
78
87
|
size: Size;
|
|
79
|
-
}
|
|
80
|
-
export
|
|
88
|
+
};
|
|
89
|
+
export type MarkdownRendererProps = {
|
|
81
90
|
type: 'markdown';
|
|
91
|
+
control?: string;
|
|
82
92
|
align: Align;
|
|
83
93
|
margin: Margin;
|
|
84
94
|
content: string;
|
|
85
|
-
}
|
|
86
|
-
export
|
|
95
|
+
};
|
|
96
|
+
export type ImageRendererProps = {
|
|
87
97
|
type: 'image';
|
|
98
|
+
control?: string;
|
|
88
99
|
accessibilityDescription?: string;
|
|
89
100
|
size: Size;
|
|
90
101
|
margin: Margin;
|
|
91
102
|
url: string;
|
|
92
|
-
}
|
|
93
|
-
export
|
|
103
|
+
};
|
|
104
|
+
export type ModalRendererProps = {
|
|
94
105
|
type: 'modal';
|
|
106
|
+
control?: string;
|
|
95
107
|
content: {
|
|
96
108
|
components: ReactNode;
|
|
97
109
|
};
|
|
@@ -99,27 +111,30 @@ export interface ModalRendererProps extends RendererProps {
|
|
|
99
111
|
trigger: {
|
|
100
112
|
title: string;
|
|
101
113
|
};
|
|
102
|
-
}
|
|
114
|
+
};
|
|
103
115
|
/**
|
|
104
116
|
* Known values for "control" are: 'copyable'.
|
|
105
117
|
*/
|
|
106
|
-
export
|
|
118
|
+
export type ParagraphRendererProps = {
|
|
107
119
|
type: 'paragraph';
|
|
120
|
+
control?: string;
|
|
108
121
|
align: Align;
|
|
109
122
|
margin: Margin;
|
|
110
123
|
text: string;
|
|
111
|
-
}
|
|
112
|
-
export
|
|
124
|
+
};
|
|
125
|
+
export type ReviewRendererProps = {
|
|
113
126
|
type: 'review';
|
|
127
|
+
control?: string;
|
|
114
128
|
fields: ReviewField[];
|
|
115
129
|
margin: Margin;
|
|
116
130
|
title?: string;
|
|
117
131
|
callToAction?: ReviewCallToAction;
|
|
118
|
-
}
|
|
132
|
+
};
|
|
119
133
|
export type ReviewCallToAction = DomainReviewCallToAction;
|
|
120
134
|
export type ReviewField = DomainReviewField;
|
|
121
|
-
export
|
|
135
|
+
export type SearchRendererProps = {
|
|
122
136
|
type: 'search';
|
|
137
|
+
control?: string;
|
|
123
138
|
id: string;
|
|
124
139
|
emptyMessage?: string;
|
|
125
140
|
isLoading: boolean;
|
|
@@ -128,7 +143,7 @@ export interface SearchRendererProps extends RendererProps {
|
|
|
128
143
|
onChange: (query: string) => void;
|
|
129
144
|
state: SearchState;
|
|
130
145
|
title: string;
|
|
131
|
-
}
|
|
146
|
+
};
|
|
132
147
|
export type SearchState = PendingSearchState | NoResultsSearchState | ResultsSearchState | ErrorSearchState;
|
|
133
148
|
export type PendingSearchState = {
|
|
134
149
|
type: 'pending';
|
|
@@ -148,12 +163,13 @@ export type ResultsSearchState = {
|
|
|
148
163
|
export type SearchResult = Pick<SearchResultSpec, 'description' | 'icon' | 'image' | 'title'> & {
|
|
149
164
|
onClick: () => void;
|
|
150
165
|
};
|
|
151
|
-
export
|
|
166
|
+
export type StatusListRendererProps = {
|
|
152
167
|
type: 'status-list';
|
|
168
|
+
control?: string;
|
|
153
169
|
items: StatusListItem[];
|
|
154
170
|
margin: Margin;
|
|
155
171
|
title?: string;
|
|
156
|
-
}
|
|
172
|
+
};
|
|
157
173
|
export type StatusListItem = {
|
|
158
174
|
description?: string;
|
|
159
175
|
icon: Icon;
|
|
@@ -161,15 +177,17 @@ export type StatusListItem = {
|
|
|
161
177
|
title: string;
|
|
162
178
|
};
|
|
163
179
|
export type StatusListItemStatus = 'done' | 'not-done' | 'pending';
|
|
164
|
-
export
|
|
180
|
+
export type FormSectionRendererProps = {
|
|
165
181
|
type: 'form-section';
|
|
182
|
+
control?: string;
|
|
166
183
|
title?: string;
|
|
167
184
|
description?: string;
|
|
168
185
|
help?: string;
|
|
169
186
|
children: ReactNode;
|
|
170
|
-
}
|
|
171
|
-
interface BaseInputRendererProps
|
|
187
|
+
};
|
|
188
|
+
interface BaseInputRendererProps {
|
|
172
189
|
id: string;
|
|
190
|
+
control?: string;
|
|
173
191
|
autoComplete: string;
|
|
174
192
|
description?: string;
|
|
175
193
|
disabled: boolean;
|
|
@@ -178,20 +196,20 @@ interface BaseInputRendererProps<M extends string | number | boolean | null> ext
|
|
|
178
196
|
label?: string;
|
|
179
197
|
placeholder?: string;
|
|
180
198
|
required: boolean;
|
|
181
|
-
value: M | null;
|
|
182
|
-
onChange: (value: M | null) => void;
|
|
183
199
|
onBlur: () => void;
|
|
184
200
|
onFocus: () => void;
|
|
185
201
|
}
|
|
186
|
-
export interface BooleanInputRendererProps extends BaseInputRendererProps
|
|
202
|
+
export interface BooleanInputRendererProps extends BaseInputRendererProps {
|
|
187
203
|
type: 'input-boolean';
|
|
188
204
|
value: boolean;
|
|
205
|
+
onChange: (value: boolean) => void;
|
|
189
206
|
}
|
|
190
207
|
/**
|
|
191
208
|
* Known values for "control" are: 'primary' | 'secondary' | 'tertiary'.
|
|
192
209
|
*/
|
|
193
|
-
export
|
|
210
|
+
export type ButtonRendererProps = {
|
|
194
211
|
type: 'button';
|
|
212
|
+
control?: string;
|
|
195
213
|
context: Context;
|
|
196
214
|
disabled: boolean;
|
|
197
215
|
margin: Margin;
|
|
@@ -199,28 +217,37 @@ export interface ButtonRendererProps extends RendererProps {
|
|
|
199
217
|
size?: Size;
|
|
200
218
|
title: string;
|
|
201
219
|
onClick: () => void;
|
|
202
|
-
}
|
|
220
|
+
};
|
|
203
221
|
/**
|
|
204
222
|
* Known values for "control" are: 'date-lookup'.
|
|
205
223
|
*/
|
|
206
|
-
export
|
|
224
|
+
export type DateInputRendererProps = BaseInputRendererProps & {
|
|
207
225
|
type: 'input-date';
|
|
208
226
|
minimumDate?: string;
|
|
209
227
|
maximumDate?: string;
|
|
210
|
-
|
|
211
|
-
|
|
228
|
+
value: string | null;
|
|
229
|
+
onChange: (value: string | null) => void;
|
|
230
|
+
};
|
|
231
|
+
export type HiddenRendererProps = {
|
|
212
232
|
type: 'hidden';
|
|
213
|
-
|
|
214
|
-
|
|
233
|
+
control?: string;
|
|
234
|
+
};
|
|
235
|
+
export type IntegerInputRendererProps = BaseInputRendererProps & {
|
|
215
236
|
type: 'input-integer';
|
|
216
|
-
|
|
217
|
-
|
|
237
|
+
value: number | null;
|
|
238
|
+
onChange: (value: number | null) => void;
|
|
239
|
+
};
|
|
240
|
+
export type NumberInputRendererProps = BaseInputRendererProps & {
|
|
218
241
|
type: 'input-number';
|
|
219
|
-
|
|
220
|
-
|
|
242
|
+
value: number | null;
|
|
243
|
+
onChange: (value: number | null) => void;
|
|
244
|
+
};
|
|
245
|
+
export type RepeatableRendererProps = {
|
|
221
246
|
type: 'repeatable';
|
|
247
|
+
control?: string;
|
|
222
248
|
addItemTitle: string;
|
|
223
249
|
description?: string;
|
|
250
|
+
children: ReactNode[];
|
|
224
251
|
editableItem: ReactNode;
|
|
225
252
|
editItemTitle: string;
|
|
226
253
|
error?: string;
|
|
@@ -230,20 +257,20 @@ export interface RepeatableRendererProps extends RendererProps {
|
|
|
230
257
|
onEdit: (itemIndex: number) => void;
|
|
231
258
|
onSave: () => boolean;
|
|
232
259
|
onRemove: () => void;
|
|
233
|
-
}
|
|
234
|
-
export
|
|
260
|
+
};
|
|
261
|
+
export type RepeatableItemRendererProps = {
|
|
235
262
|
description?: string;
|
|
236
263
|
icon?: Icon;
|
|
237
264
|
image?: Image;
|
|
238
265
|
title?: string;
|
|
239
|
-
}
|
|
240
|
-
export
|
|
266
|
+
};
|
|
267
|
+
export type SelectInputRendererProps = BaseInputRendererProps & {
|
|
241
268
|
type: 'input-select';
|
|
242
269
|
children: ReactNode;
|
|
243
270
|
options: SelectInputRendererOption[];
|
|
244
271
|
selectedIndex: number | null;
|
|
245
272
|
onSelect: (index: number | null) => void;
|
|
246
|
-
}
|
|
273
|
+
};
|
|
247
274
|
export type SelectInputRendererOption = {
|
|
248
275
|
description?: string;
|
|
249
276
|
disabled: boolean;
|
|
@@ -255,13 +282,32 @@ export type SelectInputRendererOption = {
|
|
|
255
282
|
/**
|
|
256
283
|
* Known values for "control" are: 'password' | 'textarea' | 'email' | 'numeric' | 'phone-number'.
|
|
257
284
|
*/
|
|
258
|
-
export
|
|
285
|
+
export type TextInputRendererProps = BaseInputRendererProps & {
|
|
259
286
|
type: 'input-text';
|
|
260
287
|
displayFormat?: string;
|
|
261
|
-
|
|
262
|
-
|
|
288
|
+
value: string | null;
|
|
289
|
+
onChange: (value: string | null) => void;
|
|
290
|
+
};
|
|
291
|
+
export type UploadInputRendererProps = BaseInputRendererProps & {
|
|
263
292
|
type: 'input-upload';
|
|
264
293
|
maxSize?: number;
|
|
265
294
|
accepts?: string[];
|
|
266
|
-
|
|
295
|
+
value: File | null;
|
|
296
|
+
onUpload: (file: File | null) => Promise<void>;
|
|
297
|
+
};
|
|
298
|
+
export type MultiUploadInputRendererProps = BaseInputRendererProps & {
|
|
299
|
+
type: 'input-upload-multi';
|
|
300
|
+
maxSize?: number;
|
|
301
|
+
minItems?: number;
|
|
302
|
+
maxItems?: number;
|
|
303
|
+
accepts?: string[];
|
|
304
|
+
uploadLabel?: string;
|
|
305
|
+
value: FileWithId[];
|
|
306
|
+
onUpload: (file: File, fileId: string) => Promise<void>;
|
|
307
|
+
onDelete: (fileId: string) => Promise<void>;
|
|
308
|
+
};
|
|
309
|
+
type FileWithId = {
|
|
310
|
+
id: string;
|
|
311
|
+
file: File;
|
|
312
|
+
};
|
|
267
313
|
export {};
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import type { Action, Step as DFStep, Model } from '@wise/dynamic-flow-types/build/next';
|
|
2
2
|
import type { StepComponent } from '../domain/types';
|
|
3
3
|
import type { AnalyticsEventDispatcher, LoggingEventDispatcher } from '../domain/features/events';
|
|
4
|
-
import type { HttpClient } from '../
|
|
4
|
+
import type { HttpClient } from '../types';
|
|
5
5
|
type StepProps = {
|
|
6
6
|
step: DFStep;
|
|
7
7
|
render: (component: StepComponent) => JSX.Element;
|
|
8
8
|
httpClient: HttpClient;
|
|
9
9
|
trackEvent: AnalyticsEventDispatcher;
|
|
10
10
|
logEvent: LoggingEventDispatcher;
|
|
11
|
-
|
|
11
|
+
triggerAction: (type: 'submit' | 'refresh', action: Action, model: Model) => Promise<void>;
|
|
12
12
|
};
|
|
13
|
-
declare function Step({ step, render, httpClient, trackEvent, logEvent,
|
|
13
|
+
declare function Step({ step, render, httpClient, trackEvent, logEvent, triggerAction }: StepProps): JSX.Element;
|
|
14
14
|
export default Step;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { StepComponent } from '../../domain/types';
|
|
2
|
-
import type {
|
|
3
|
-
export declare const getRenderFunction: (renderers:
|
|
2
|
+
import type { Renderers } from '../../types';
|
|
3
|
+
export declare const getRenderFunction: (renderers: Renderers) => (component: StepComponent) => JSX.Element;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import type { Step, Model } from '@wise/dynamic-flow-types/build/next';
|
|
2
|
+
import type { AnalyticsEventHandler, LoggingEventHandler } from './domain/features/events';
|
|
3
|
+
import type { CoreContainerRendererProps } from './renderers/CoreContainerRenderer';
|
|
4
|
+
import type { Renderer, AlertRendererProps, BoxRendererProps, ColumnsRendererProps, DecisionRendererProps, DividerRendererProps, FormRendererProps, HeadingRendererProps, InstructionsRendererProps, LoadingIndicatorRendererProps, MarkdownRendererProps, ImageRendererProps, ModalRendererProps, ParagraphRendererProps, ReviewRendererProps, SearchRendererProps, StatusListRendererProps, FormSectionRendererProps, BooleanInputRendererProps, ButtonRendererProps, DateInputRendererProps, HiddenRendererProps, IntegerInputRendererProps, NumberInputRendererProps, RepeatableRendererProps, SelectInputRendererProps, TextInputRendererProps, UploadInputRendererProps, MultiUploadInputRendererProps } from './renderers/types';
|
|
5
|
+
export type DynamicFlowProps = DynamicFlowPropsWithInitialAction | DynamicFlowPropsWithInitialStep;
|
|
6
|
+
export type DynamicFlowPropsWithInitialAction = DynamicFlowPropsBasic & {
|
|
7
|
+
initialAction: InitialAction;
|
|
8
|
+
initialStep?: never;
|
|
9
|
+
};
|
|
10
|
+
export type DynamicFlowPropsWithInitialStep = DynamicFlowPropsBasic & {
|
|
11
|
+
initialAction?: never;
|
|
12
|
+
initialStep: Step;
|
|
13
|
+
};
|
|
14
|
+
export type InitialAction = {
|
|
15
|
+
$id?: string;
|
|
16
|
+
url: string;
|
|
17
|
+
method?: 'GET';
|
|
18
|
+
data?: never;
|
|
19
|
+
} | {
|
|
20
|
+
$id?: string;
|
|
21
|
+
url: string;
|
|
22
|
+
method: 'POST';
|
|
23
|
+
data: Model;
|
|
24
|
+
};
|
|
25
|
+
type DynamicFlowPropsBasic = {
|
|
26
|
+
flowId: string;
|
|
27
|
+
displayStepTitle?: boolean;
|
|
28
|
+
features?: Feature[];
|
|
29
|
+
httpClient: HttpClient;
|
|
30
|
+
onCompletion: (result: Model) => void;
|
|
31
|
+
onError: (error: unknown, status?: number) => void;
|
|
32
|
+
onEvent?: AnalyticsEventHandler;
|
|
33
|
+
onLog?: LoggingEventHandler;
|
|
34
|
+
};
|
|
35
|
+
export type HttpClient = typeof fetch;
|
|
36
|
+
type Feature = {
|
|
37
|
+
featureName: string;
|
|
38
|
+
variant: number | null;
|
|
39
|
+
};
|
|
40
|
+
export type Renderers = (Renderer<CoreContainerRendererProps> | Renderer<AlertRendererProps> | Renderer<BoxRendererProps> | Renderer<ColumnsRendererProps> | Renderer<DecisionRendererProps> | Renderer<DividerRendererProps> | Renderer<FormRendererProps> | Renderer<HeadingRendererProps> | Renderer<InstructionsRendererProps> | Renderer<LoadingIndicatorRendererProps> | Renderer<MarkdownRendererProps> | Renderer<ImageRendererProps> | Renderer<ModalRendererProps> | Renderer<ParagraphRendererProps> | Renderer<ReviewRendererProps> | Renderer<SearchRendererProps> | Renderer<StatusListRendererProps> | Renderer<FormSectionRendererProps> | Renderer<BooleanInputRendererProps> | Renderer<ButtonRendererProps> | Renderer<DateInputRendererProps> | Renderer<HiddenRendererProps> | Renderer<IntegerInputRendererProps> | Renderer<NumberInputRendererProps> | Renderer<RepeatableRendererProps> | Renderer<SelectInputRendererProps> | Renderer<TextInputRendererProps> | Renderer<UploadInputRendererProps> | Renderer<MultiUploadInputRendererProps>)[];
|
|
41
|
+
export {};
|