@pega/cosmos-react-demos 3.0.4 → 3.0.6
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/jsx/core/ListToolbar/ListToolbar.mocks.d.ts.map +1 -1
- package/jsx/core/ListToolbar/ListToolbar.mocks.jsx +47 -52
- package/jsx/core/ListToolbar/ListToolbar.mocks.jsx.map +1 -1
- package/jsx/core/MultiStepForm/MultiStepForm.mocks.d.ts +4 -1
- package/jsx/core/MultiStepForm/MultiStepForm.mocks.d.ts.map +1 -1
- package/jsx/core/MultiStepForm/MultiStepForm.mocks.jsx +25 -3
- package/jsx/core/MultiStepForm/MultiStepForm.mocks.jsx.map +1 -1
- package/jsx/core/MultiStepForm/MultiStepForm.stories.d.ts.map +1 -1
- package/jsx/core/MultiStepForm/MultiStepForm.stories.jsx +49 -29
- package/jsx/core/MultiStepForm/MultiStepForm.stories.jsx.map +1 -1
- package/jsx/work/Stages/Stages.mocks.jsx +6 -6
- package/jsx/work/Stages/Stages.mocks.jsx.map +1 -1
- package/jsx/work/Stages/Stages.stories.d.ts.map +1 -1
- package/jsx/work/Stages/Stages.stories.jsx +22 -8
- package/jsx/work/Stages/Stages.stories.jsx.map +1 -1
- package/lib/core/ListToolbar/ListToolbar.mocks.d.ts.map +1 -1
- package/lib/core/ListToolbar/ListToolbar.mocks.js +26 -33
- package/lib/core/ListToolbar/ListToolbar.mocks.js.map +1 -1
- package/lib/core/MultiStepForm/MultiStepForm.mocks.d.ts +4 -1
- package/lib/core/MultiStepForm/MultiStepForm.mocks.d.ts.map +1 -1
- package/lib/core/MultiStepForm/MultiStepForm.mocks.js +17 -4
- package/lib/core/MultiStepForm/MultiStepForm.mocks.js.map +1 -1
- package/lib/core/MultiStepForm/MultiStepForm.stories.d.ts.map +1 -1
- package/lib/core/MultiStepForm/MultiStepForm.stories.js +47 -27
- package/lib/core/MultiStepForm/MultiStepForm.stories.js.map +1 -1
- package/lib/work/Stages/Stages.mocks.js +6 -6
- package/lib/work/Stages/Stages.mocks.js.map +1 -1
- package/lib/work/Stages/Stages.stories.d.ts.map +1 -1
- package/lib/work/Stages/Stages.stories.js +22 -8
- package/lib/work/Stages/Stages.stories.js.map +1 -1
- package/package.json +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListToolbar.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ListToolbar.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,MAAM,EAAsC,MAAM,yBAAyB,CAAC;AACrF,OAAO,EAAE,iBAAiB,EAAE,MAAM,sEAAsE,CAAC;AAMzG,eAAO,MAAM,OAAO,EAAE,MAAM,EAIzB,CAAC;AAEJ,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,OAAO,CAIhD,CAAC;AAEF,eAAO,MAAM,0BAA0B,2CAA4C,CAAC;AAwDpF,eAAO,MAAM,cAAc,mBAE1B,CAAC;AAEF,eAAO,MAAM,aAAa,mBAEzB,CAAC"}
|
|
@@ -1,5 +1,8 @@
|
|
|
1
|
-
import { createContext
|
|
2
|
-
import {
|
|
1
|
+
import { createContext } from 'react';
|
|
2
|
+
import { Select, Option, Flex, Button, Icon } from '@pega/cosmos-react-core';
|
|
3
|
+
import { ConditionBuilder } from '@pega/cosmos-react-condition-builder';
|
|
4
|
+
import FieldSelector from '@pega/cosmos-react-condition-builder/lib/components/ConditionBuilder/RhsControls/FieldSelector';
|
|
5
|
+
import { demoFields } from '../../condition-builder/ConditionBuilder/props.mock';
|
|
3
6
|
export const actions = ['Action 1', 'Action 2', 'Action 3'].map(text => ({
|
|
4
7
|
text,
|
|
5
8
|
id: text,
|
|
@@ -11,61 +14,53 @@ export const mockViews = [
|
|
|
11
14
|
{ id: '3', text: 'Data view 3', selected: false }
|
|
12
15
|
];
|
|
13
16
|
export const StagedStateDispatchContext = createContext(() => { });
|
|
14
|
-
const
|
|
15
|
-
const MockCondition = () => {
|
|
16
|
-
const setStagedState = useContext(StagedStateDispatchContext);
|
|
17
|
-
const conditionId = useUID();
|
|
18
|
-
const [localState, setLocalState] = useState({
|
|
19
|
-
lhs: 'Field 1',
|
|
20
|
-
comparator: 'Equals',
|
|
21
|
-
rhs: ''
|
|
22
|
-
});
|
|
23
|
-
useAfterInitialEffect(() => {
|
|
24
|
-
setStagedState({
|
|
25
|
-
[conditionId]: localState
|
|
26
|
-
});
|
|
27
|
-
}, [conditionId, localState, setStagedState]);
|
|
28
|
-
return (<Grid container={{ gap: 2, cols: 'repeat(3, minmax(0, 1fr))' }}>
|
|
29
|
-
<Select label='Field' onChange={(e) => {
|
|
30
|
-
setLocalState(cur => ({ ...cur, lhs: e.target.value }));
|
|
31
|
-
}}>
|
|
32
|
-
{mockFields.map(field => {
|
|
33
|
-
return (<Option value={field} key={field}>
|
|
34
|
-
{field}
|
|
35
|
-
</Option>);
|
|
36
|
-
})}
|
|
37
|
-
</Select>
|
|
38
|
-
<Select label='Comparator' onChange={(e) => {
|
|
39
|
-
setLocalState(cur => ({ ...cur, comparator: e.target.value }));
|
|
40
|
-
}}>
|
|
41
|
-
{['Equals', 'Contains', 'Starts with'].map(comparator => {
|
|
42
|
-
return (<Option value={comparator} key={comparator}>
|
|
43
|
-
{comparator}
|
|
44
|
-
</Option>);
|
|
45
|
-
})}
|
|
46
|
-
</Select>
|
|
47
|
-
<Input label='Value' value={localState.rhs} onChange={(e) => {
|
|
48
|
-
setLocalState(cur => ({ ...cur, rhs: e.target.value }));
|
|
49
|
-
}}/>
|
|
50
|
-
</Grid>);
|
|
51
|
-
};
|
|
52
|
-
export const FilterRenderer = () => {
|
|
53
|
-
const [conditions, setConditions] = useState(() => [<MockCondition key={1}/>]);
|
|
17
|
+
const GroupByMock = () => {
|
|
54
18
|
return (<Flex container={{ direction: 'column', gap: 2 }}>
|
|
55
|
-
{
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
19
|
+
<Flex container={{ direction: 'column', gap: 1 }}>
|
|
20
|
+
<Flex container={{
|
|
21
|
+
justify: 'between',
|
|
22
|
+
alignItems: 'center',
|
|
23
|
+
direction: 'row',
|
|
24
|
+
wrap: 'nowrap',
|
|
25
|
+
itemGap: 0.5
|
|
59
26
|
}}>
|
|
60
|
-
<Flex container={{
|
|
61
|
-
|
|
62
|
-
|
|
27
|
+
<Flex container={{
|
|
28
|
+
justify: 'start',
|
|
29
|
+
alignItems: 'center',
|
|
30
|
+
direction: 'row',
|
|
31
|
+
wrap: 'nowrap',
|
|
32
|
+
itemGap: 0.5
|
|
33
|
+
}} item={{ grow: 1 }}>
|
|
34
|
+
<Icon name='drag'/>
|
|
35
|
+
<Flex item={{ grow: 1, basis: '50%' }}>
|
|
36
|
+
<FieldSelector fields={[]} value='' onChange={() => { }}/>
|
|
37
|
+
</Flex>
|
|
38
|
+
<Flex as={Select} item={{ basis: '50%' }}>
|
|
39
|
+
<Option> </Option>
|
|
40
|
+
<Option>Item A</Option>
|
|
41
|
+
</Flex>
|
|
63
42
|
</Flex>
|
|
64
|
-
|
|
65
|
-
|
|
43
|
+
<Button aria-label='Delete group' icon variant='simple'>
|
|
44
|
+
<Icon name='trash'/>
|
|
45
|
+
</Button>
|
|
46
|
+
</Flex>
|
|
47
|
+
</Flex>
|
|
48
|
+
<Button variant='link' aria-label='Add a group'>
|
|
49
|
+
<Flex container={{
|
|
50
|
+
inline: true,
|
|
51
|
+
alignItems: 'start',
|
|
52
|
+
gap: 1
|
|
53
|
+
}} as='span'>
|
|
54
|
+
<Icon name='plus'/>
|
|
55
|
+
<span>Add</span>
|
|
56
|
+
</Flex>
|
|
57
|
+
</Button>
|
|
66
58
|
</Flex>);
|
|
67
59
|
};
|
|
60
|
+
export const FilterRenderer = () => {
|
|
61
|
+
return <ConditionBuilder fields={demoFields}/>;
|
|
62
|
+
};
|
|
68
63
|
export const GroupRenderer = () => {
|
|
69
|
-
return
|
|
64
|
+
return <GroupByMock />;
|
|
70
65
|
};
|
|
71
66
|
//# sourceMappingURL=ListToolbar.mocks.jsx.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListToolbar.mocks.jsx","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ListToolbar.mocks.jsx","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createContext, Dispatch } from 'react';\n\nimport { Action, Select, Option, Flex, Button, Icon } from '@pega/cosmos-react-core';\nimport { ViewSelectorProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\nimport { ConditionBuilder } from '@pega/cosmos-react-condition-builder';\nimport FieldSelector from '@pega/cosmos-react-condition-builder/lib/components/ConditionBuilder/RhsControls/FieldSelector';\n\nimport { demoFields } from '../../condition-builder/ConditionBuilder/props.mock';\n\nexport const actions: Action[] = ['Action 1', 'Action 2', 'Action 3'].map(text => ({\n text,\n id: text,\n icon: 'filter'\n}));\n\nexport const mockViews: ViewSelectorProps['views'] = [\n { id: '1', text: 'Data view 1', selected: true },\n { id: '2', text: 'Data view 2', selected: false },\n { id: '3', text: 'Data view 3', selected: false }\n];\n\nexport const StagedStateDispatchContext = createContext<Dispatch<object>>(() => {});\n\nconst GroupByMock = () => {\n return (\n <Flex container={{ direction: 'column', gap: 2 }}>\n <Flex container={{ direction: 'column', gap: 1 }}>\n <Flex\n container={{\n justify: 'between',\n alignItems: 'center',\n direction: 'row',\n wrap: 'nowrap',\n itemGap: 0.5\n }}\n >\n <Flex\n container={{\n justify: 'start',\n alignItems: 'center',\n direction: 'row',\n wrap: 'nowrap',\n itemGap: 0.5\n }}\n item={{ grow: 1 }}\n >\n <Icon name='drag' />\n <Flex item={{ grow: 1, basis: '50%' }}>\n <FieldSelector fields={[]} value='' onChange={() => {}} />\n </Flex>\n <Flex as={Select} item={{ basis: '50%' }}>\n <Option> </Option>\n <Option>Item A</Option>\n </Flex>\n </Flex>\n <Button aria-label='Delete group' icon variant='simple'>\n <Icon name='trash' />\n </Button>\n </Flex>\n </Flex>\n <Button variant='link' aria-label='Add a group'>\n <Flex\n container={{\n inline: true,\n alignItems: 'start',\n gap: 1\n }}\n as='span'\n >\n <Icon name='plus' />\n <span>Add</span>\n </Flex>\n </Button>\n </Flex>\n );\n};\n\nexport const FilterRenderer = () => {\n return <ConditionBuilder fields={demoFields} />;\n};\n\nexport const GroupRenderer = () => {\n return <GroupByMock />;\n};\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export interface DemoFormDataType {
|
|
3
|
-
[key: string]: string | undefined;
|
|
3
|
+
[key: string]: string | boolean | undefined;
|
|
4
4
|
firstName?: string;
|
|
5
5
|
lastName?: string;
|
|
6
6
|
currentTitle?: string;
|
|
@@ -11,6 +11,8 @@ export interface DemoFormDataType {
|
|
|
11
11
|
priorityTwo?: string;
|
|
12
12
|
priorityThree?: string;
|
|
13
13
|
interviewNotes?: string;
|
|
14
|
+
additionalInterview?: boolean;
|
|
15
|
+
nextInterviewer?: string;
|
|
14
16
|
salaryRequestReview?: string;
|
|
15
17
|
cultureFit?: string;
|
|
16
18
|
finalRecommendation?: string;
|
|
@@ -29,6 +31,7 @@ interface MockFormArgs {
|
|
|
29
31
|
}
|
|
30
32
|
export declare const ApplicantDetailsFields: ({ formData, formErrors, dispatch }: MockFormArgs) => JSX.Element;
|
|
31
33
|
export declare const InterviewNotesFields: ({ formData, formErrors, dispatch }: MockFormArgs) => JSX.Element;
|
|
34
|
+
export declare const NextInterviewFields: ({ formData, formErrors, dispatch }: MockFormArgs) => JSX.Element;
|
|
32
35
|
export declare const RecommendationsFields: ({ formData, formErrors, dispatch }: MockFormArgs) => JSX.Element;
|
|
33
36
|
export {};
|
|
34
37
|
//# sourceMappingURL=MultiStepForm.mocks.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStepForm.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/MultiStepForm/MultiStepForm.mocks.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"MultiStepForm.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/MultiStepForm/MultiStepForm.mocks.tsx"],"names":[],"mappings":";AAeA,MAAM,WAAW,gBAAgB;IAC/B,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC;AAED,MAAM,WAAW,kBAAkB;IACjC,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;CACrC;AAED,UAAU,YAAY;IACpB,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,UAAU,EAAE,kBAAkB,CAAC;IAC/B,QAAQ,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,GAAG,CAAA;KAAE,KAAK,IAAI,CAAC;CAC5D;AAED,eAAO,MAAM,sBAAsB,uCAAwC,YAAY,gBAuGtF,CAAC;AAEF,eAAO,MAAM,oBAAoB,uCAAwC,YAAY,gBA6BpF,CAAC;AAEF,eAAO,MAAM,mBAAmB,uCAAwC,YAAY,gBAuBnF,CAAC;AAEF,eAAO,MAAM,qBAAqB,uCAAwC,YAAY,gBAkKrF,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Input, Grid, FieldGroup, TextArea, RadioButtonGroup, RadioButton, CurrencyInput, Select, Option } from '@pega/cosmos-react-core';
|
|
1
|
+
import { Input, Grid, FieldGroup, TextArea, RadioButtonGroup, RadioButton, CurrencyInput, Select, Option, Checkbox } from '@pega/cosmos-react-core';
|
|
2
2
|
export const ApplicantDetailsFields = ({ formData, formErrors, dispatch }) => {
|
|
3
3
|
return (<Grid container={{ gap: 1, cols: 'repeat(2, minmax(0, 1fr))' }}>
|
|
4
4
|
<Input name='firstName' label='First name' value={formData.firstName} readOnly/>
|
|
@@ -54,12 +54,34 @@ export const ApplicantDetailsFields = ({ formData, formErrors, dispatch }) => {
|
|
|
54
54
|
</Grid>);
|
|
55
55
|
};
|
|
56
56
|
export const InterviewNotesFields = ({ formData, formErrors, dispatch }) => {
|
|
57
|
-
return (<
|
|
57
|
+
return (<Grid container={{ gap: 1, cols: '1fr' }}>
|
|
58
|
+
<TextArea name='impressions' label='Impressions' value={formData.interviewNotes} onChange={(e) => {
|
|
58
59
|
dispatch({
|
|
59
60
|
type: 'setFieldValue',
|
|
60
61
|
payload: { field: 'interviewNotes', value: e.target.value }
|
|
61
62
|
});
|
|
62
|
-
}} status={formErrors.impressions ? 'error' : undefined} info={formErrors.impressions ? formErrors.impressions : undefined}/>
|
|
63
|
+
}} status={formErrors.impressions ? 'error' : undefined} info={formErrors.impressions ? formErrors.impressions : undefined}/>
|
|
64
|
+
<Checkbox name='additionalInterview' label='Request additional interview' defaultChecked={formData.additionalInterview} onChange={(e) => {
|
|
65
|
+
dispatch({
|
|
66
|
+
type: 'setFieldValue',
|
|
67
|
+
payload: { field: 'additionalInterview', value: e.target.checked }
|
|
68
|
+
});
|
|
69
|
+
}}/>
|
|
70
|
+
</Grid>);
|
|
71
|
+
};
|
|
72
|
+
export const NextInterviewFields = ({ formData, formErrors, dispatch }) => {
|
|
73
|
+
return (<Select name='nextInterviewer' label='Next interviewer' value={formData.nextInterviewer} onChange={(e) => {
|
|
74
|
+
dispatch({
|
|
75
|
+
type: 'setFieldValue',
|
|
76
|
+
payload: { field: 'nextInterviewer', value: e.target.value }
|
|
77
|
+
});
|
|
78
|
+
}} status={formErrors.nextInterviewer ? 'error' : undefined} info={formErrors.nextInterviewer ? formErrors.nextInterviewer : undefined} required>
|
|
79
|
+
<Option value=''>Choose an option...</Option>
|
|
80
|
+
<Option>Myself</Option>
|
|
81
|
+
<Option>Cindy Turner </Option>
|
|
82
|
+
<Option>Seth DeAngelo</Option>
|
|
83
|
+
<Option>Janet Moore</Option>
|
|
84
|
+
</Select>);
|
|
63
85
|
};
|
|
64
86
|
export const RecommendationsFields = ({ formData, formErrors, dispatch }) => {
|
|
65
87
|
return (<Grid container={{ gap: 1, cols: '1fr' }}>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStepForm.mocks.jsx","sourceRoot":"","sources":["../../../src/core/MultiStepForm/MultiStepForm.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ChangeEvent } from 'react';\n\nimport {\n Input,\n Grid,\n FieldGroup,\n TextArea,\n RadioButtonGroup,\n RadioButton,\n CurrencyInput,\n Select,\n Option\n} from '@pega/cosmos-react-core';\n\nexport interface DemoFormDataType {\n [key: string]: string | undefined;\n firstName?: string;\n lastName?: string;\n currentTitle?: string;\n currentCompany?: string;\n salaryRequested?: string;\n experienceLevel?: string;\n priorityOne?: string;\n priorityTwo?: string;\n priorityThree?: string;\n interviewNotes?: string;\n salaryRequestReview?: string;\n cultureFit?: string;\n finalRecommendation?: string;\n recommendationComments?: string;\n}\n\nexport interface DemoFormErrorsType {\n [field: string]: string | undefined;\n}\n\ninterface MockFormArgs {\n formData: DemoFormDataType;\n formErrors: DemoFormErrorsType;\n dispatch: (value: { type: string; payload?: any }) => void;\n}\n\nexport const ApplicantDetailsFields = ({ formData, formErrors, dispatch }: MockFormArgs) => {\n return (\n <Grid container={{ gap: 1, cols: 'repeat(2, minmax(0, 1fr))' }}>\n <Input name='firstName' label='First name' value={formData.firstName} readOnly />\n <Input name='lastName' label='Last name' value={formData.lastName} readOnly />\n <Input\n name='currentTitle'\n label='Current title'\n value={formData.currentTitle}\n onChange={(e: ChangeEvent<HTMLInputElement>) =>\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'currentTitle', value: e.target.value }\n })\n }\n />\n <Input\n name='currentCompany'\n label='Current company'\n value={formData.currentCompany}\n onChange={(e: ChangeEvent<HTMLInputElement>) =>\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'currentCompany', value: e.target.value }\n })\n }\n />\n <CurrencyInput\n name='salaryRequested'\n label='Salary requested'\n value={formData.salaryRequested}\n currencyISOCode='USD'\n onChange={value =>\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'salaryRequested', value }\n })\n }\n status={formErrors.salaryRequested ? 'error' : undefined}\n info={formErrors.salaryRequested ? formErrors.salaryRequested : undefined}\n required\n />\n <Select\n id='experienceLevel'\n label='Weighted experience'\n value={formData.experienceLevel}\n onChange={(e: ChangeEvent<HTMLSelectElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'experienceLevel', value: e.target.value }\n });\n }}\n status={formErrors.experienceLevel ? 'error' : undefined}\n info={formErrors.experienceLevel ? formErrors.experienceLevel : undefined}\n required\n >\n <Option value=''>--</Option>\n <Option value='junior'>0-3 years (junior)</Option>\n <Option value='mid-level'>4-6 years (mid)</Option>\n <Option value='senior'>7-10 years (senior)</Option>\n <Option value='expert'>10+ years (expert)</Option>\n </Select>\n <Grid item={{ colStart: '1', colEnd: '-1' }}>\n <FieldGroup name='Work priorities'>\n <Grid container={{ gap: 1, cols: 'repeat(3, minmax(0, 1fr))' }}>\n <Input\n name='priorityOne'\n label='First'\n value={formData.priorityOne}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'priorityOne', value: e.target.value }\n });\n }}\n />\n <Input\n name='priorityTwo'\n label='Second'\n value={formData.priorityTwo}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'priorityTwo', value: e.target.value }\n });\n }}\n />\n <Input\n name='priorityThree'\n label='Third'\n value={formData.priorityThree}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'priorityThree', value: e.target.value }\n });\n }}\n />\n </Grid>\n </FieldGroup>\n </Grid>\n </Grid>\n );\n};\n\nexport const InterviewNotesFields = ({ formData, formErrors, dispatch }: MockFormArgs) => {\n return (\n <TextArea\n name='impressions'\n label='Impressions'\n value={formData.interviewNotes}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'interviewNotes', value: e.target.value }\n });\n }}\n status={formErrors.impressions ? 'error' : undefined}\n info={formErrors.impressions ? formErrors.impressions : undefined}\n />\n );\n};\n\nexport const RecommendationsFields = ({ formData, formErrors, dispatch }: MockFormArgs) => {\n return (\n <Grid container={{ gap: 1, cols: '1fr' }}>\n <CurrencyInput\n name='salaryRequestedReview'\n label='Salary requested'\n value={formData.salaryRequested}\n onChange={() => {}}\n currencyISOCode='USD'\n readOnly\n />\n\n <p>$99,000 is the recommended salary for this position.</p>\n\n <RadioButtonGroup\n label='Salary request fit'\n name='salaryRequestReview'\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: {\n field: 'salaryRequestReview',\n value: e.target.value\n }\n });\n }}\n status={formErrors.salaryRequestReview ? 'error' : undefined}\n info={formErrors.salaryRequestReview ? formErrors.salaryRequestReview : undefined}\n inline\n required\n >\n <RadioButton\n label='Very low'\n id='salaryTargetVeryLow'\n value='salaryTargetVeryLow'\n checked={formData.salaryRequestReview === 'salaryTargetVeryLow'}\n />\n <RadioButton\n label='Low'\n id='salaryTargetLow'\n value='salaryTargetLow'\n checked={formData.salaryRequestReview === 'salaryTargetLow'}\n />\n <RadioButton\n label='On trend'\n id='salaryTargetOnTrend'\n value='salaryTargetOnTrend'\n checked={formData.salaryRequestReview === 'salaryTargetOnTrend'}\n />\n <RadioButton\n label='High'\n id='salaryTargetHigh'\n value='salaryTargetHigh'\n checked={formData.salaryRequestReview === 'salaryTargetHigh'}\n />\n <RadioButton\n label='Very high'\n id='salaryTargetVeryHigh'\n value='salaryTargetVeryHigh'\n checked={formData.salaryRequestReview === 'salaryTargetVeryHigh'}\n />\n </RadioButtonGroup>\n\n <RadioButtonGroup\n label='Culture fit'\n name='cultureFit'\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: {\n field: 'cultureFit',\n value: e.target.value\n }\n });\n }}\n status={formErrors.cultureFit ? 'error' : undefined}\n info={formErrors.cultureFit ? formErrors.cultureFit : undefined}\n inline\n required\n >\n <RadioButton\n label='High risk'\n id='cultureFitHighRisk'\n value='cultureFitHighRisk'\n checked={formData.cultureFit === 'cultureFitHighRisk'}\n />\n <RadioButton\n label='Signs of risk'\n id='cultureFitSomeRisk'\n value='cultureFitSomeRisk'\n checked={formData.cultureFit === 'cultureFitSomeRisk'}\n />\n <RadioButton\n label='Indeterminate'\n id='cultureFitIndeterminate'\n value='cultureFitIndeterminate'\n checked={formData.cultureFit === 'cultureFitIndeterminate'}\n />\n <RadioButton\n label='Good'\n id='cultureFitGood'\n value='cultureFitGood'\n checked={formData.cultureFit === 'cultureFitGood'}\n />\n <RadioButton\n label='Perfect'\n id='cultureFitPerfect'\n value='cultureFitPerfect'\n checked={formData.cultureFit === 'cultureFitPerfect'}\n />\n </RadioButtonGroup>\n\n <RadioButtonGroup\n label='Final recomendation'\n name='finalRecommendation'\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: {\n field: 'finalRecommendation',\n value: e.target.value\n }\n });\n }}\n status={formErrors.finalRecommendation ? 'error' : undefined}\n info={formErrors.finalRecommendation ? formErrors.finalRecommendation : undefined}\n inline\n required\n >\n <RadioButton\n label='Do not recommend'\n id='doNotRecommend'\n value='doNotRecommend'\n checked={formData.finalRecommendation === 'doNotRecommend'}\n />\n <RadioButton\n label='Indeterminate'\n id='noRecommendation'\n value='noRecommendation'\n checked={formData.finalRecommendation === 'noRecommendation'}\n />\n <RadioButton\n label='Recommend'\n id='recommend'\n value='recommend'\n checked={formData.finalRecommendation === 'recommend'}\n />\n </RadioButtonGroup>\n\n <TextArea\n name='comments'\n label='Comments'\n value={formData.recommendationComments}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'recommendationComments', value: e.target.value }\n });\n }}\n />\n </Grid>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"MultiStepForm.mocks.jsx","sourceRoot":"","sources":["../../../src/core/MultiStepForm/MultiStepForm.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ChangeEvent } from 'react';\n\nimport {\n Input,\n Grid,\n FieldGroup,\n TextArea,\n RadioButtonGroup,\n RadioButton,\n CurrencyInput,\n Select,\n Option,\n Checkbox\n} from '@pega/cosmos-react-core';\n\nexport interface DemoFormDataType {\n [key: string]: string | boolean | undefined;\n firstName?: string;\n lastName?: string;\n currentTitle?: string;\n currentCompany?: string;\n salaryRequested?: string;\n experienceLevel?: string;\n priorityOne?: string;\n priorityTwo?: string;\n priorityThree?: string;\n interviewNotes?: string;\n additionalInterview?: boolean;\n nextInterviewer?: string;\n salaryRequestReview?: string;\n cultureFit?: string;\n finalRecommendation?: string;\n recommendationComments?: string;\n}\n\nexport interface DemoFormErrorsType {\n [field: string]: string | undefined;\n}\n\ninterface MockFormArgs {\n formData: DemoFormDataType;\n formErrors: DemoFormErrorsType;\n dispatch: (value: { type: string; payload?: any }) => void;\n}\n\nexport const ApplicantDetailsFields = ({ formData, formErrors, dispatch }: MockFormArgs) => {\n return (\n <Grid container={{ gap: 1, cols: 'repeat(2, minmax(0, 1fr))' }}>\n <Input name='firstName' label='First name' value={formData.firstName} readOnly />\n <Input name='lastName' label='Last name' value={formData.lastName} readOnly />\n <Input\n name='currentTitle'\n label='Current title'\n value={formData.currentTitle}\n onChange={(e: ChangeEvent<HTMLInputElement>) =>\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'currentTitle', value: e.target.value }\n })\n }\n />\n <Input\n name='currentCompany'\n label='Current company'\n value={formData.currentCompany}\n onChange={(e: ChangeEvent<HTMLInputElement>) =>\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'currentCompany', value: e.target.value }\n })\n }\n />\n <CurrencyInput\n name='salaryRequested'\n label='Salary requested'\n value={formData.salaryRequested}\n currencyISOCode='USD'\n onChange={value =>\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'salaryRequested', value }\n })\n }\n status={formErrors.salaryRequested ? 'error' : undefined}\n info={formErrors.salaryRequested ? formErrors.salaryRequested : undefined}\n required\n />\n <Select\n id='experienceLevel'\n label='Weighted experience'\n value={formData.experienceLevel}\n onChange={(e: ChangeEvent<HTMLSelectElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'experienceLevel', value: e.target.value }\n });\n }}\n status={formErrors.experienceLevel ? 'error' : undefined}\n info={formErrors.experienceLevel ? formErrors.experienceLevel : undefined}\n required\n >\n <Option value=''>--</Option>\n <Option value='junior'>0-3 years (junior)</Option>\n <Option value='mid-level'>4-6 years (mid)</Option>\n <Option value='senior'>7-10 years (senior)</Option>\n <Option value='expert'>10+ years (expert)</Option>\n </Select>\n <Grid item={{ colStart: '1', colEnd: '-1' }}>\n <FieldGroup name='Work priorities'>\n <Grid container={{ gap: 1, cols: 'repeat(3, minmax(0, 1fr))' }}>\n <Input\n name='priorityOne'\n label='First'\n value={formData.priorityOne}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'priorityOne', value: e.target.value }\n });\n }}\n />\n <Input\n name='priorityTwo'\n label='Second'\n value={formData.priorityTwo}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'priorityTwo', value: e.target.value }\n });\n }}\n />\n <Input\n name='priorityThree'\n label='Third'\n value={formData.priorityThree}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'priorityThree', value: e.target.value }\n });\n }}\n />\n </Grid>\n </FieldGroup>\n </Grid>\n </Grid>\n );\n};\n\nexport const InterviewNotesFields = ({ formData, formErrors, dispatch }: MockFormArgs) => {\n return (\n <Grid container={{ gap: 1, cols: '1fr' }}>\n <TextArea\n name='impressions'\n label='Impressions'\n value={formData.interviewNotes}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'interviewNotes', value: e.target.value }\n });\n }}\n status={formErrors.impressions ? 'error' : undefined}\n info={formErrors.impressions ? formErrors.impressions : undefined}\n />\n <Checkbox\n name='additionalInterview'\n label='Request additional interview'\n defaultChecked={formData.additionalInterview}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'additionalInterview', value: e.target.checked }\n });\n }}\n />\n </Grid>\n );\n};\n\nexport const NextInterviewFields = ({ formData, formErrors, dispatch }: MockFormArgs) => {\n return (\n <Select\n name='nextInterviewer'\n label='Next interviewer'\n value={formData.nextInterviewer}\n onChange={(e: ChangeEvent<HTMLSelectElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'nextInterviewer', value: e.target.value }\n });\n }}\n status={formErrors.nextInterviewer ? 'error' : undefined}\n info={formErrors.nextInterviewer ? formErrors.nextInterviewer : undefined}\n required\n >\n <Option value=''>Choose an option...</Option>\n <Option>Myself</Option>\n <Option>Cindy Turner </Option>\n <Option>Seth DeAngelo</Option>\n <Option>Janet Moore</Option>\n </Select>\n );\n};\n\nexport const RecommendationsFields = ({ formData, formErrors, dispatch }: MockFormArgs) => {\n return (\n <Grid container={{ gap: 1, cols: '1fr' }}>\n <CurrencyInput\n name='salaryRequestedReview'\n label='Salary requested'\n value={formData.salaryRequested}\n onChange={() => {}}\n currencyISOCode='USD'\n readOnly\n />\n\n <p>$99,000 is the recommended salary for this position.</p>\n\n <RadioButtonGroup\n label='Salary request fit'\n name='salaryRequestReview'\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: {\n field: 'salaryRequestReview',\n value: e.target.value\n }\n });\n }}\n status={formErrors.salaryRequestReview ? 'error' : undefined}\n info={formErrors.salaryRequestReview ? formErrors.salaryRequestReview : undefined}\n inline\n required\n >\n <RadioButton\n label='Very low'\n id='salaryTargetVeryLow'\n value='salaryTargetVeryLow'\n checked={formData.salaryRequestReview === 'salaryTargetVeryLow'}\n />\n <RadioButton\n label='Low'\n id='salaryTargetLow'\n value='salaryTargetLow'\n checked={formData.salaryRequestReview === 'salaryTargetLow'}\n />\n <RadioButton\n label='On trend'\n id='salaryTargetOnTrend'\n value='salaryTargetOnTrend'\n checked={formData.salaryRequestReview === 'salaryTargetOnTrend'}\n />\n <RadioButton\n label='High'\n id='salaryTargetHigh'\n value='salaryTargetHigh'\n checked={formData.salaryRequestReview === 'salaryTargetHigh'}\n />\n <RadioButton\n label='Very high'\n id='salaryTargetVeryHigh'\n value='salaryTargetVeryHigh'\n checked={formData.salaryRequestReview === 'salaryTargetVeryHigh'}\n />\n </RadioButtonGroup>\n\n <RadioButtonGroup\n label='Culture fit'\n name='cultureFit'\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: {\n field: 'cultureFit',\n value: e.target.value\n }\n });\n }}\n status={formErrors.cultureFit ? 'error' : undefined}\n info={formErrors.cultureFit ? formErrors.cultureFit : undefined}\n inline\n required\n >\n <RadioButton\n label='High risk'\n id='cultureFitHighRisk'\n value='cultureFitHighRisk'\n checked={formData.cultureFit === 'cultureFitHighRisk'}\n />\n <RadioButton\n label='Signs of risk'\n id='cultureFitSomeRisk'\n value='cultureFitSomeRisk'\n checked={formData.cultureFit === 'cultureFitSomeRisk'}\n />\n <RadioButton\n label='Indeterminate'\n id='cultureFitIndeterminate'\n value='cultureFitIndeterminate'\n checked={formData.cultureFit === 'cultureFitIndeterminate'}\n />\n <RadioButton\n label='Good'\n id='cultureFitGood'\n value='cultureFitGood'\n checked={formData.cultureFit === 'cultureFitGood'}\n />\n <RadioButton\n label='Perfect'\n id='cultureFitPerfect'\n value='cultureFitPerfect'\n checked={formData.cultureFit === 'cultureFitPerfect'}\n />\n </RadioButtonGroup>\n\n <RadioButtonGroup\n label='Final recomendation'\n name='finalRecommendation'\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: {\n field: 'finalRecommendation',\n value: e.target.value\n }\n });\n }}\n status={formErrors.finalRecommendation ? 'error' : undefined}\n info={formErrors.finalRecommendation ? formErrors.finalRecommendation : undefined}\n inline\n required\n >\n <RadioButton\n label='Do not recommend'\n id='doNotRecommend'\n value='doNotRecommend'\n checked={formData.finalRecommendation === 'doNotRecommend'}\n />\n <RadioButton\n label='Indeterminate'\n id='noRecommendation'\n value='noRecommendation'\n checked={formData.finalRecommendation === 'noRecommendation'}\n />\n <RadioButton\n label='Recommend'\n id='recommend'\n value='recommend'\n checked={formData.finalRecommendation === 'recommend'}\n />\n </RadioButtonGroup>\n\n <TextArea\n name='comments'\n label='Comments'\n value={formData.recommendationComments}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => {\n dispatch({\n type: 'setFieldValue',\n payload: { field: 'recommendationComments', value: e.target.value }\n });\n }}\n />\n </Grid>\n );\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStepForm.stories.d.ts","sourceRoot":"","sources":["../../../src/core/MultiStepForm/MultiStepForm.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;
|
|
1
|
+
{"version":3,"file":"MultiStepForm.stories.d.ts","sourceRoot":"","sources":["../../../src/core/MultiStepForm/MultiStepForm.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAe/C,wBAGU;AAuBV,eAAO,MAAM,iBAAiB,EAAE,KAyT/B,CAAC"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { useReducer, useMemo } from 'react';
|
|
2
2
|
import { Button, Banner, Flex, MultiStepForm, Text } from '@pega/cosmos-react-core';
|
|
3
|
-
import { ApplicantDetailsFields, InterviewNotesFields, RecommendationsFields } from './MultiStepForm.mocks';
|
|
3
|
+
import { ApplicantDetailsFields, InterviewNotesFields, RecommendationsFields, NextInterviewFields } from './MultiStepForm.mocks';
|
|
4
4
|
export default {
|
|
5
5
|
title: 'Core/MultiStepForm',
|
|
6
6
|
component: MultiStepForm
|
|
7
7
|
};
|
|
8
8
|
export const MultiStepFormDemo = () => {
|
|
9
9
|
const initialState = useMemo(() => ({
|
|
10
|
-
|
|
10
|
+
currentStepIndex: 0,
|
|
11
11
|
cancelled: false,
|
|
12
12
|
finished: false,
|
|
13
13
|
numSteps: 3,
|
|
@@ -28,6 +28,10 @@ export const MultiStepFormDemo = () => {
|
|
|
28
28
|
message: 'This field is required.',
|
|
29
29
|
validator: (value) => value?.length > 0
|
|
30
30
|
},
|
|
31
|
+
nextInterviewer: {
|
|
32
|
+
message: 'This field is required.',
|
|
33
|
+
validator: (value) => value?.length > 0
|
|
34
|
+
},
|
|
31
35
|
salaryRequestReview: {
|
|
32
36
|
message: 'This field is required.',
|
|
33
37
|
validator: (value) => value?.length > 0
|
|
@@ -42,8 +46,8 @@ export const MultiStepFormDemo = () => {
|
|
|
42
46
|
}
|
|
43
47
|
}), []);
|
|
44
48
|
const stepFields = useMemo(() => {
|
|
45
|
-
return
|
|
46
|
-
|
|
49
|
+
return [
|
|
50
|
+
[
|
|
47
51
|
'firstName',
|
|
48
52
|
'lastName',
|
|
49
53
|
'currentTitle',
|
|
@@ -54,9 +58,10 @@ export const MultiStepFormDemo = () => {
|
|
|
54
58
|
'priorityTwo',
|
|
55
59
|
'priorityThree'
|
|
56
60
|
],
|
|
57
|
-
'
|
|
58
|
-
|
|
59
|
-
|
|
61
|
+
['interviewNotes', 'additionalInterview'],
|
|
62
|
+
['nextInterviewer'],
|
|
63
|
+
['salaryRequestReview', 'cultureFit', 'finalRecommendation', 'recommendationComments']
|
|
64
|
+
];
|
|
60
65
|
}, []);
|
|
61
66
|
const reducer = (state, action) => {
|
|
62
67
|
const type = action.type;
|
|
@@ -80,7 +85,8 @@ export const MultiStepFormDemo = () => {
|
|
|
80
85
|
case 'setStep': {
|
|
81
86
|
return {
|
|
82
87
|
...state,
|
|
83
|
-
|
|
88
|
+
currentStepIndex: payload,
|
|
89
|
+
formErrors: {}
|
|
84
90
|
};
|
|
85
91
|
}
|
|
86
92
|
case 'setFieldValue': {
|
|
@@ -108,7 +114,9 @@ export const MultiStepFormDemo = () => {
|
|
|
108
114
|
};
|
|
109
115
|
}
|
|
110
116
|
case 'submitCurrentStep': {
|
|
111
|
-
const
|
|
117
|
+
const stepIndex = state.numSteps === 4 || state.currentStepIndex <= 1
|
|
118
|
+
? state.currentStepIndex
|
|
119
|
+
: state.currentStepIndex + 1;
|
|
112
120
|
const formErrors = { ...state.formErrors };
|
|
113
121
|
let isValid = true;
|
|
114
122
|
const validateFields = (fields) => {
|
|
@@ -127,13 +135,14 @@ export const MultiStepFormDemo = () => {
|
|
|
127
135
|
}
|
|
128
136
|
});
|
|
129
137
|
};
|
|
130
|
-
validateFields(stepFields[
|
|
138
|
+
validateFields(stepFields[stepIndex]);
|
|
131
139
|
return {
|
|
132
140
|
...state,
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
141
|
+
numSteps: state.formData.additionalInterview ? 4 : 3,
|
|
142
|
+
currentStepIndex: isValid && state.currentStepIndex !== state.numSteps - 1
|
|
143
|
+
? state.currentStepIndex + 1
|
|
144
|
+
: state.currentStepIndex,
|
|
145
|
+
finished: isValid && state.currentStepIndex === state.numSteps - 1,
|
|
137
146
|
formErrors
|
|
138
147
|
};
|
|
139
148
|
}
|
|
@@ -146,13 +155,13 @@ export const MultiStepFormDemo = () => {
|
|
|
146
155
|
const stepActions = (<>
|
|
147
156
|
<Button onClick={() => dispatch({ type: 'cancel' })}>Cancel</Button>
|
|
148
157
|
<div>
|
|
149
|
-
{state.
|
|
158
|
+
{state.currentStepIndex > 0 && (<Button onClick={() => dispatch({ type: 'setStep', payload: state.currentStepIndex - 1 })}>
|
|
150
159
|
Previous
|
|
151
160
|
</Button>)}
|
|
152
|
-
{state.
|
|
161
|
+
{state.currentStepIndex !== state.numSteps - 1 && (<Button variant='primary' onClick={() => dispatch({ type: 'submitCurrentStep' })}>
|
|
153
162
|
Next
|
|
154
163
|
</Button>)}
|
|
155
|
-
{state.
|
|
164
|
+
{state.currentStepIndex === state.numSteps - 1 && (<Button type='submit' variant='primary' onClick={(e) => {
|
|
156
165
|
e.preventDefault();
|
|
157
166
|
dispatch({ type: 'submitCurrentStep' });
|
|
158
167
|
}}>
|
|
@@ -160,38 +169,49 @@ export const MultiStepFormDemo = () => {
|
|
|
160
169
|
</Button>)}
|
|
161
170
|
</div>
|
|
162
171
|
</>);
|
|
163
|
-
const
|
|
164
|
-
return stepFields[
|
|
172
|
+
const applicantErrors = Object.keys(state.formErrors).filter(errorField => {
|
|
173
|
+
return stepFields[0].includes(errorField);
|
|
165
174
|
});
|
|
166
|
-
const
|
|
175
|
+
const recommendationErrors = Object.keys(state.formErrors).filter(errorField => {
|
|
167
176
|
return stepFields[3].includes(errorField);
|
|
168
177
|
});
|
|
169
|
-
|
|
178
|
+
const steps = [
|
|
170
179
|
{
|
|
171
|
-
id: '
|
|
180
|
+
id: 'applicant_details',
|
|
172
181
|
name: 'Applicant details',
|
|
173
182
|
description: 'This applicant has passed initial screening and has been cleared to have an interview scheduled. ' +
|
|
174
183
|
'Please confirm their details and have a discussion regarding the open position and the company.',
|
|
175
|
-
banners:
|
|
184
|
+
banners: applicantErrors?.length ? (<Banner id='formBanner' heading='Your submission failed to process.' messages={['Please correct all errors and try again.']} variant='urgent'/>) : undefined,
|
|
176
185
|
content: (<ApplicantDetailsFields formData={state.formData} formErrors={state.formErrors} dispatch={dispatch}/>),
|
|
177
186
|
actions: stepActions
|
|
178
187
|
},
|
|
179
188
|
{
|
|
180
|
-
id: '
|
|
189
|
+
id: 'interview_notes',
|
|
181
190
|
name: 'Interview notes',
|
|
182
191
|
content: (<InterviewNotesFields formData={state.formData} formErrors={state.formErrors} dispatch={dispatch}/>),
|
|
183
192
|
actions: stepActions
|
|
184
193
|
},
|
|
185
194
|
{
|
|
186
|
-
id: '
|
|
187
|
-
name: '
|
|
195
|
+
id: 'recommendations',
|
|
196
|
+
name: 'Final recommendations',
|
|
188
197
|
description: 'Based on your screening call with the applicant please submit your recomendations.',
|
|
189
|
-
banners:
|
|
198
|
+
banners: recommendationErrors?.length ? (<Banner id='formBanner' heading='Your submission failed to process.' messages={['Please correct all errors and try again.']} variant='urgent'/>) : undefined,
|
|
190
199
|
content: (<RecommendationsFields formData={state.formData} formErrors={state.formErrors} dispatch={dispatch}/>),
|
|
191
200
|
actions: stepActions
|
|
192
201
|
}
|
|
193
202
|
];
|
|
194
|
-
|
|
203
|
+
if (state.numSteps === 4) {
|
|
204
|
+
steps.splice(2, 0, {
|
|
205
|
+
id: 'next_interview',
|
|
206
|
+
name: 'Next interview',
|
|
207
|
+
description: 'Please select an individual to conduct the next interview.',
|
|
208
|
+
banners: undefined,
|
|
209
|
+
content: (<NextInterviewFields formData={state.formData} formErrors={state.formErrors} dispatch={dispatch}/>),
|
|
210
|
+
actions: stepActions
|
|
211
|
+
});
|
|
212
|
+
}
|
|
213
|
+
return steps;
|
|
214
|
+
}, [state.formData, state.formErrors, state.currentStepIndex]);
|
|
195
215
|
return (<>
|
|
196
216
|
{(state.cancelled || state.finished) && (<Flex container={{ gap: 2, alignItems: 'center' }}>
|
|
197
217
|
<Text variant='h1'>HR screening {state.cancelled ? 'cancelled' : 'finished'}</Text>
|
|
@@ -202,7 +222,7 @@ export const MultiStepFormDemo = () => {
|
|
|
202
222
|
</Button>
|
|
203
223
|
</Flex>)}
|
|
204
224
|
|
|
205
|
-
{!state.cancelled && !state.finished && (<MultiStepForm heading='HR Screening' steps={stepData} currentStepId={
|
|
225
|
+
{!state.cancelled && !state.finished && (<MultiStepForm heading='HR Screening' steps={stepData} currentStepId={stepData[state.currentStepIndex].id}/>)}
|
|
206
226
|
</>);
|
|
207
227
|
};
|
|
208
228
|
//# sourceMappingURL=MultiStepForm.stories.jsx.map
|