From c01f8e814049d81edfa3009cbc3bdd5e94fede83 Mon Sep 17 00:00:00 2001 From: Luiz Motta Date: Fri, 10 Jan 2025 18:11:49 -0300 Subject: [PATCH] Update snapshots --- .../tests/__snapshots__/AutoForm.test.tsx.snap | 4 ++-- .../tests/__snapshots__/ListField.test.tsx.snap | 2 +- .../tests/__snapshots__/NestField.test.tsx.snap | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/form-code-generator-patternfly-theme/tests/__snapshots__/AutoForm.test.tsx.snap b/packages/form-code-generator-patternfly-theme/tests/__snapshots__/AutoForm.test.tsx.snap index dd5f16892ed..78e7cd9c490 100644 --- a/packages/form-code-generator-patternfly-theme/tests/__snapshots__/AutoForm.test.tsx.snap +++ b/packages/form-code-generator-patternfly-theme/tests/__snapshots__/AutoForm.test.tsx.snap @@ -51,7 +51,7 @@ const Form__HRInterview: React.FC<any> = (props: any) => { const [interview__hire, set__interview__hire] = useState<boolean>(false); const [interview__hiringDate, set__interview__hiringDate] = useState<string>(); - const [friends, set__friends] = useState<any[]>([]); + const [friends, set__friends] = useState<string[]>([]); /* Utility function that fills the form with the data received from the kogito runtime */ const setFormData = (data) => { if (!data) { @@ -574,7 +574,7 @@ const Form__HRInterview: React.FC<any> = (props: any) => { </FormGroup> </CardBody> </Card> - <div fieldId={'uniforms-0000-000x'}> + <div> <Split hasGutter> <SplitItem> {'Friends' && ( diff --git a/packages/form-code-generator-patternfly-theme/tests/__snapshots__/ListField.test.tsx.snap b/packages/form-code-generator-patternfly-theme/tests/__snapshots__/ListField.test.tsx.snap index 32ed4d93a46..69e0ab1e604 100644 --- a/packages/form-code-generator-patternfly-theme/tests/__snapshots__/ListField.test.tsx.snap +++ b/packages/form-code-generator-patternfly-theme/tests/__snapshots__/ListField.test.tsx.snap @@ -2,6 +2,6 @@ exports[` tests 1`] = `
- {"ref":{"binding":"friends","stateName":"friends","stateSetter":"set__friends","dataType":{"name":"string[]","defaultValue":"[]"}},"pfImports":["Split","SplitItem","Button","Card","CardBody","TextInput","FormGroup","SelectOption","SelectOptionObject","Select","SelectVariant","Checkbox","DatePicker","Flex","FlexItem","InputGroup","TimePicker"],"pfIconImports":["PlusCircleIcon","MinusCircleIcon"],"reactImports":["useState"],"jsxCode":"<div fieldId={'id'}>\\n <Split hasGutter>\\n <SplitItem>\\n {'Friends' && (\\n <label className={\\"pf-c-form__label\\"}>\\n <span className={\\"pf-c-form__label-text\\"}>\\n Friends\\n </span>\\n </label>\\n )}\\n </SplitItem>\\n <SplitItem isFilled />\\n <SplitItem>\\n <Button\\n name='$'\\n variant='plain'\\n style={{ paddingLeft: '0', paddingRight: '0' }}\\n disabled={false}\\n onClick={() => {\\n !false && set__friends((friends ?? []).concat([undefined]));\\n }}\\n >\\n <PlusCircleIcon color='#0088ce' />\\n </Button>\\n </SplitItem>\\n </Split>\\n <div>\\n {friends?.map((_, itemIndex) =>\\n (<div\\n key={itemIndex}\\n style={{\\n marginBottom: '1rem',\\n display: 'flex',\\n justifyContent: 'space-between',\\n }}\\n >\\n <div style={{ width: '100%', marginRight: '10px' }}><Card>\\n <CardBody className=\\"pf-c-form\\">\\n \\n <FormGroup\\n fieldId={'uniforms-0000-0003'}\\n label={'Name'}\\n isRequired={true}\\n >\\n <TextInput\\n name={\`friends.\${itemIndex}.name\`}\\n id={'uniforms-0000-0003'}\\n isDisabled={false}\\n placeholder={''}\\n type={'text'}\\n value={friends[itemIndex].name}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].name = newValue;\\n return newState;\\n })\\n }}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-0005'}\\n label={'Age'}\\n isRequired={true}\\n >\\n <TextInput\\n type={'number'}\\n name={\`friends.\${itemIndex}.age\`}\\n isDisabled={false}\\n id={'uniforms-0000-0005'}\\n placeholder={''}\\n step={0.01} \\n value={friends[itemIndex].age}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].age = Number(newValue);\\n return newState;\\n })\\n }}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-0007'}\\n label={'Country'}\\n isRequired={true}\\n ><Select\\n id={'uniforms-0000-0007'}\\n name={\`friends.\${itemIndex}.country\`}\\n variant={SelectVariant.single}\\n isDisabled={false}\\n placeholderText={''}\\n isOpen={friends__$__country__expanded}\\n selections={friends__$__country}\\n onToggle={(isOpen) => set__friends__$__country__expanded(isOpen)}\\n onSelect={\\n (event, value, isPlaceHolder) => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].country = handleSelect(value, isPlaceHolder, friends__$__country, set__friends__$__country, set__friends__$__country__expanded);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].country}\\n >\\n <SelectOption key={'US'} value={'US'}>US</SelectOption>\\n<SelectOption key={'Brazil'} value={'Brazil'}>Brazil</SelectOption>\\n </Select></FormGroup>\\n<FormGroup fieldId='uniforms-0000-0009'>\\n <Checkbox\\n isChecked={friends[itemIndex].married}\\n isDisabled={false}\\n id={'uniforms-0000-0009'}\\n name={\`friends.\${itemIndex}.married\`}\\n label={'Married'}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].married = newValue;\\n return newState;\\n })\\n }}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-000b'}\\n label={'Know'}\\n isRequired={true}\\n >\\n <Checkbox\\n key={'uniforms-0000-000b-Java'}\\n id={'uniforms-0000-000b-Java'}\\n name={\`friends.\${itemIndex}.know\`}\\n aria-label={'friends.$.know'}\\n label={'Java'} \\n isDisabled={false} \\n isChecked={friends__$__know.indexOf('Java') !== -1}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].know = handleCheckboxGroupChange('Java', friends__$__know, set__friends__$__know);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].know}\\n/>\\n<Checkbox\\n key={'uniforms-0000-000b-Node'}\\n id={'uniforms-0000-000b-Node'}\\n name={\`friends.\${itemIndex}.know\`}\\n aria-label={'friends.$.know'}\\n label={'Node'} \\n isDisabled={false} \\n isChecked={friends__$__know.indexOf('Node') !== -1}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].know = handleCheckboxGroupChange('Node', friends__$__know, set__friends__$__know);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].know}\\n/>\\n<Checkbox\\n key={'uniforms-0000-000b-Docker'}\\n id={'uniforms-0000-000b-Docker'}\\n name={\`friends.\${itemIndex}.know\`}\\n aria-label={'friends.$.know'}\\n label={'Docker'} \\n isDisabled={false} \\n isChecked={friends__$__know.indexOf('Docker') !== -1}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].know = handleCheckboxGroupChange('Docker', friends__$__know, set__friends__$__know);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].know}\\n/>\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-000d'}\\n label={'Areas'}\\n isRequired={true}\\n ><Select\\n id={'uniforms-0000-000d'}\\n name={\`friends.\${itemIndex}.areas\`}\\n variant={SelectVariant.single}\\n isDisabled={false}\\n placeholderText={''}\\n isOpen={friends__$__areas__expanded}\\n selections={friends__$__areas}\\n onToggle={(isOpen) => set__friends__$__areas__expanded(isOpen)}\\n onSelect={\\n (event, value, isPlaceHolder) => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].areas = handleSelect(value, isPlaceHolder, friends__$__areas, set__friends__$__areas, set__friends__$__areas__expanded);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].areas}\\n >\\n <SelectOption key={'Developer'} value={'Developer'}>Developer</SelectOption>\\n<SelectOption key={'HR'} value={'HR'}>HR</SelectOption>\\n<SelectOption key={'UX'} value={'UX'}>UX</SelectOption>\\n </Select></FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-000f'}\\n label={'Birthday'}\\n isRequired={true}\\n >\\n <Flex\\n direction={{ default: 'column' }}\\n id={'uniforms-0000-000f'}\\n >\\n <FlexItem>\\n <InputGroup style={{ background: 'transparent' }}>\\n <DatePicker\\n id={'date-picker-uniforms-0000-000f'}\\n isDisabled={false}\\n name={\`friends.\${itemIndex}.birthday\`}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].birthday = onDateChange(newValue, set__friends__$__birthday, friends__$__birthday);\\n return newState;\\n })\\n }}\\n value={parseDate(friends[itemIndex].birthday)}\\n />\\n <TimePicker\\n id={'time-picker-uniforms-0000-000f'}\\n isDisabled={false}\\n name={\`friends.\${itemIndex}.birthday\`}\\n onChange={\\n (time, hours?, minutes?) => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].birthday = onTimeChange(time, set__friends__$__birthday, friends__$__birthday, hours, minutes);\\n return newState;\\n })\\n }}\\n style={{ width: '120px' }}\\n time={parseTime(friends[itemIndex].birthday)}\\n />\\n </InputGroup>\\n </FlexItem>\\n </Flex>\\n </FormGroup>\\n </CardBody></Card></div>\\n <div>\\n <Button\\n disabled={false}\\n variant='plain'\\n style={{ paddingLeft: '0', paddingRight: '0' }}\\n onClick={() => {\\n const value = [...friends]\\n value.splice(itemIndex, 1);\\n !false && set__friends(value);\\n }}\\n >\\n <MinusCircleIcon color='#cc0000' />\\n </Button>\\n </div>\\n </div>)\\n )}\\n </div>\\n </div>","stateCode":"const [ friends, set__friends ] = useState<any[]>([]);","isReadonly":false} + {"ref":{"binding":"friends","stateName":"friends","stateSetter":"set__friends","dataType":{"name":"string[]","defaultValue":"[]"}},"pfImports":["Split","SplitItem","Button","Card","CardBody","TextInput","FormGroup","SelectOption","SelectOptionObject","Select","SelectVariant","Checkbox","DatePicker","Flex","FlexItem","InputGroup","TimePicker"],"pfIconImports":["PlusCircleIcon","MinusCircleIcon"],"reactImports":["useState"],"jsxCode":"<div>\\n <Split hasGutter>\\n <SplitItem>\\n {'Friends' && (\\n <label className={\\"pf-c-form__label\\"}>\\n <span className={\\"pf-c-form__label-text\\"}>\\n Friends\\n </span>\\n </label>\\n )}\\n </SplitItem>\\n <SplitItem isFilled />\\n <SplitItem>\\n <Button\\n name='$'\\n variant='plain'\\n style={{ paddingLeft: '0', paddingRight: '0' }}\\n disabled={false}\\n onClick={() => {\\n !false && set__friends((friends ?? []).concat([undefined]));\\n }}\\n >\\n <PlusCircleIcon color='#0088ce' />\\n </Button>\\n </SplitItem>\\n </Split>\\n <div>\\n {friends?.map((_, itemIndex) =>\\n (<div\\n key={itemIndex}\\n style={{\\n marginBottom: '1rem',\\n display: 'flex',\\n justifyContent: 'space-between',\\n }}\\n >\\n <div style={{ width: '100%', marginRight: '10px' }}><Card>\\n <CardBody className=\\"pf-c-form\\">\\n \\n <FormGroup\\n fieldId={'uniforms-0000-0003'}\\n label={'Name'}\\n isRequired={true}\\n >\\n <TextInput\\n name={\`friends.\${itemIndex}.name\`}\\n id={'uniforms-0000-0003'}\\n isDisabled={false}\\n placeholder={''}\\n type={'text'}\\n value={friends[itemIndex].name}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].name = newValue;\\n return newState;\\n })\\n }}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-0005'}\\n label={'Age'}\\n isRequired={true}\\n >\\n <TextInput\\n type={'number'}\\n name={\`friends.\${itemIndex}.age\`}\\n isDisabled={false}\\n id={'uniforms-0000-0005'}\\n placeholder={''}\\n step={0.01} \\n value={friends[itemIndex].age}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].age = Number(newValue);\\n return newState;\\n })\\n }}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-0007'}\\n label={'Country'}\\n isRequired={true}\\n ><Select\\n id={'uniforms-0000-0007'}\\n name={\`friends.\${itemIndex}.country\`}\\n variant={SelectVariant.single}\\n isDisabled={false}\\n placeholderText={''}\\n isOpen={friends__$__country__expanded}\\n selections={friends__$__country}\\n onToggle={(isOpen) => set__friends__$__country__expanded(isOpen)}\\n onSelect={\\n (event, value, isPlaceHolder) => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].country = handleSelect(value, isPlaceHolder, friends__$__country, set__friends__$__country, set__friends__$__country__expanded);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].country}\\n >\\n <SelectOption key={'US'} value={'US'}>US</SelectOption>\\n<SelectOption key={'Brazil'} value={'Brazil'}>Brazil</SelectOption>\\n </Select></FormGroup>\\n<FormGroup fieldId='uniforms-0000-0009'>\\n <Checkbox\\n isChecked={friends[itemIndex].married}\\n isDisabled={false}\\n id={'uniforms-0000-0009'}\\n name={\`friends.\${itemIndex}.married\`}\\n label={'Married'}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].married = newValue;\\n return newState;\\n })\\n }}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-000b'}\\n label={'Know'}\\n isRequired={true}\\n >\\n <Checkbox\\n key={'uniforms-0000-000b-Java'}\\n id={'uniforms-0000-000b-Java'}\\n name={\`friends.\${itemIndex}.know\`}\\n aria-label={'friends.$.know'}\\n label={'Java'} \\n isDisabled={false} \\n isChecked={friends__$__know.indexOf('Java') !== -1}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].know = handleCheckboxGroupChange('Java', friends__$__know, set__friends__$__know);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].know}\\n/>\\n<Checkbox\\n key={'uniforms-0000-000b-Node'}\\n id={'uniforms-0000-000b-Node'}\\n name={\`friends.\${itemIndex}.know\`}\\n aria-label={'friends.$.know'}\\n label={'Node'} \\n isDisabled={false} \\n isChecked={friends__$__know.indexOf('Node') !== -1}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].know = handleCheckboxGroupChange('Node', friends__$__know, set__friends__$__know);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].know}\\n/>\\n<Checkbox\\n key={'uniforms-0000-000b-Docker'}\\n id={'uniforms-0000-000b-Docker'}\\n name={\`friends.\${itemIndex}.know\`}\\n aria-label={'friends.$.know'}\\n label={'Docker'} \\n isDisabled={false} \\n isChecked={friends__$__know.indexOf('Docker') !== -1}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].know = handleCheckboxGroupChange('Docker', friends__$__know, set__friends__$__know);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].know}\\n/>\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-000d'}\\n label={'Areas'}\\n isRequired={true}\\n ><Select\\n id={'uniforms-0000-000d'}\\n name={\`friends.\${itemIndex}.areas\`}\\n variant={SelectVariant.single}\\n isDisabled={false}\\n placeholderText={''}\\n isOpen={friends__$__areas__expanded}\\n selections={friends__$__areas}\\n onToggle={(isOpen) => set__friends__$__areas__expanded(isOpen)}\\n onSelect={\\n (event, value, isPlaceHolder) => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].areas = handleSelect(value, isPlaceHolder, friends__$__areas, set__friends__$__areas, set__friends__$__areas__expanded);\\n return newState;\\n })\\n }}\\n value={friends[itemIndex].areas}\\n >\\n <SelectOption key={'Developer'} value={'Developer'}>Developer</SelectOption>\\n<SelectOption key={'HR'} value={'HR'}>HR</SelectOption>\\n<SelectOption key={'UX'} value={'UX'}>UX</SelectOption>\\n </Select></FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-000f'}\\n label={'Birthday'}\\n isRequired={true}\\n >\\n <Flex\\n direction={{ default: 'column' }}\\n id={'uniforms-0000-000f'}\\n >\\n <FlexItem>\\n <InputGroup style={{ background: 'transparent' }}>\\n <DatePicker\\n id={'date-picker-uniforms-0000-000f'}\\n isDisabled={false}\\n name={\`friends.\${itemIndex}.birthday\`}\\n onChange={\\n newValue => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].birthday = onDateChange(newValue, set__friends__$__birthday, friends__$__birthday);\\n return newState;\\n })\\n }}\\n value={parseDate(friends[itemIndex].birthday)}\\n />\\n <TimePicker\\n id={'time-picker-uniforms-0000-000f'}\\n isDisabled={false}\\n name={\`friends.\${itemIndex}.birthday\`}\\n onChange={\\n (time, hours?, minutes?) => {\\n set__friends(s => {\\n const newState = [...s];\\n newState[itemIndex].birthday = onTimeChange(time, set__friends__$__birthday, friends__$__birthday, hours, minutes);\\n return newState;\\n })\\n }}\\n style={{ width: '120px' }}\\n time={parseTime(friends[itemIndex].birthday)}\\n />\\n </InputGroup>\\n </FlexItem>\\n </Flex>\\n </FormGroup>\\n </CardBody></Card></div>\\n <div>\\n <Button\\n disabled={false}\\n variant='plain'\\n style={{ paddingLeft: '0', paddingRight: '0' }}\\n onClick={() => {\\n const value = [...friends]\\n value.splice(itemIndex, 1);\\n !false && set__friends(value);\\n }}\\n >\\n <MinusCircleIcon color='#cc0000' />\\n </Button>\\n </div>\\n </div>)\\n )}\\n </div>\\n </div>","stateCode":"const [ friends, set__friends ] = useState<string[]>([]);","isReadonly":false}
`; diff --git a/packages/form-code-generator-patternfly-theme/tests/__snapshots__/NestField.test.tsx.snap b/packages/form-code-generator-patternfly-theme/tests/__snapshots__/NestField.test.tsx.snap index 584144adea1..5c38b7d6e60 100644 --- a/packages/form-code-generator-patternfly-theme/tests/__snapshots__/NestField.test.tsx.snap +++ b/packages/form-code-generator-patternfly-theme/tests/__snapshots__/NestField.test.tsx.snap @@ -2,6 +2,6 @@ exports[` tests - rendering 1`] = `
- {"pfImports":["Card","CardBody","TextInput","FormGroup","SelectOption","SelectOptionObject","Select","SelectVariant","Split","SplitItem","Button"],"pfIconImports":["PlusCircleIcon","MinusCircleIcon"],"reactImports":["useState"],"requiredCode":["select_functions"],"stateCode":"const [ candidate__name, set__candidate__name ] = useState<string>(\\"\\");\\nconst [ candidate__age, set__candidate__age ] = useState<number>();\\nconst [ candidate__role, set__candidate__role ] = useState<string>(\\"\\");\\nconst [ candidate__role__expanded, set__candidate__role__expanded ] = useState<boolean>(false);\\nconst [ candidate__skills, set__candidate__skills ] = useState<any[]>([]);","jsxCode":"<Card>\\n <CardBody className=\\"pf-c-form\\">\\n <label><b>Candidate</b></label>\\n <FormGroup\\n fieldId={'uniforms-0000-0001'}\\n label={'Name'}\\n isRequired={true}\\n >\\n <TextInput\\n name={'candidate.name'}\\n id={'uniforms-0000-0001'}\\n isDisabled={false}\\n placeholder={''}\\n type={'text'}\\n value={candidate__name}\\n onChange={set__candidate__name}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-0003'}\\n label={'Age'}\\n isRequired={true}\\n >\\n <TextInput\\n type={'number'}\\n name={'candidate.age'}\\n isDisabled={false}\\n id={'uniforms-0000-0003'}\\n placeholder={''}\\n step={1} \\n value={candidate__age}\\n onChange={(newValue) => set__candidate__age(Number(newValue))}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-0005'}\\n label={'Role'}\\n isRequired={true}\\n ><Select\\n id={'uniforms-0000-0005'}\\n name={'candidate.role'}\\n variant={SelectVariant.single}\\n isDisabled={false}\\n placeholderText={''}\\n isOpen={candidate__role__expanded}\\n selections={candidate__role}\\n onToggle={(isOpen) => set__candidate__role__expanded(isOpen)}\\n onSelect={(event, value, isPlaceHolder) => handleSelect(value, isPlaceHolder, candidate__role, set__candidate__role, set__candidate__role__expanded)}\\n value={candidate__role}\\n >\\n <SelectOption key={'Developer'} value={'Developer'}>Developer</SelectOption>\\n<SelectOption key={'HR'} value={'HR'}>HR</SelectOption>\\n<SelectOption key={'UX'} value={'UX'}>UX</SelectOption>\\n </Select></FormGroup>\\n<div fieldId={'uniforms-0000-0007'}>\\n <Split hasGutter>\\n <SplitItem>\\n {'Skills' && (\\n <label className={\\"pf-c-form__label\\"}>\\n <span className={\\"pf-c-form__label-text\\"}>\\n Skills\\n </span>\\n </label>\\n )}\\n </SplitItem>\\n <SplitItem isFilled />\\n <SplitItem>\\n <Button\\n name='$'\\n variant='plain'\\n style={{ paddingLeft: '0', paddingRight: '0' }}\\n disabled={false}\\n onClick={() => {\\n !false && set__candidate__skills((candidate__skills ?? []).concat([undefined]));\\n }}\\n >\\n <PlusCircleIcon color='#0088ce' />\\n </Button>\\n </SplitItem>\\n </Split>\\n <div>\\n {candidate__skills?.map((_, itemIndex) =>\\n (<div\\n key={itemIndex}\\n style={{\\n marginBottom: '1rem',\\n display: 'flex',\\n justifyContent: 'space-between',\\n }}\\n >\\n <div style={{ width: '100%', marginRight: '10px' }}><Card>\\n <CardBody className=\\"pf-c-form\\">\\n \\n <FormGroup\\n fieldId={'uniforms-0000-000a'}\\n label={'Name'}\\n isRequired={true}\\n >\\n <TextInput\\n name={\`candidate.skills.\${itemIndex}.name\`}\\n id={'uniforms-0000-000a'}\\n isDisabled={false}\\n placeholder={''}\\n type={'text'}\\n value={candidate__skills[itemIndex].name}\\n onChange={\\n newValue => {\\n set__candidate__skills(s => {\\n const newState = [...s];\\n newState[itemIndex].name = newValue;\\n return newState;\\n })\\n }}\\n />\\n </FormGroup>\\n </CardBody></Card></div>\\n <div>\\n <Button\\n disabled={false}\\n variant='plain'\\n style={{ paddingLeft: '0', paddingRight: '0' }}\\n onClick={() => {\\n const value = [...candidate__skills]\\n value.splice(itemIndex, 1);\\n !false && set__candidate__skills(value);\\n }}\\n >\\n <MinusCircleIcon color='#cc0000' />\\n </Button>\\n </div>\\n </div>)\\n )}\\n </div>\\n </div>\\n </CardBody></Card>","ref":{"binding":"candidate","stateName":"candidate","stateSetter":"set__candidate","dataType":{"name":"any"}},"childRefs":[{"binding":"candidate.name","stateName":"candidate__name","stateSetter":"set__candidate__name","dataType":{"name":"string","defaultValue":"\\"\\""}},{"binding":"candidate.age","stateName":"candidate__age","stateSetter":"set__candidate__age","dataType":{"name":"number"}},{"binding":"candidate.role","stateName":"candidate__role","stateSetter":"set__candidate__role","dataType":{"name":"string","defaultValue":"\\"\\""}},{"binding":"candidate.skills","stateName":"candidate__skills","stateSetter":"set__candidate__skills","dataType":{"name":"string[]","defaultValue":"[]"}}],"isReadonly":false} + {"pfImports":["Card","CardBody","TextInput","FormGroup","SelectOption","SelectOptionObject","Select","SelectVariant","Split","SplitItem","Button"],"pfIconImports":["PlusCircleIcon","MinusCircleIcon"],"reactImports":["useState"],"requiredCode":["select_functions"],"stateCode":"const [ candidate__name, set__candidate__name ] = useState<string>(\\"\\");\\nconst [ candidate__age, set__candidate__age ] = useState<number>();\\nconst [ candidate__role, set__candidate__role ] = useState<string>(\\"\\");\\nconst [ candidate__role__expanded, set__candidate__role__expanded ] = useState<boolean>(false);\\nconst [ candidate__skills, set__candidate__skills ] = useState<string[]>([]);","jsxCode":"<Card>\\n <CardBody className=\\"pf-c-form\\">\\n <label><b>Candidate</b></label>\\n <FormGroup\\n fieldId={'uniforms-0000-0001'}\\n label={'Name'}\\n isRequired={true}\\n >\\n <TextInput\\n name={'candidate.name'}\\n id={'uniforms-0000-0001'}\\n isDisabled={false}\\n placeholder={''}\\n type={'text'}\\n value={candidate__name}\\n onChange={set__candidate__name}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-0003'}\\n label={'Age'}\\n isRequired={true}\\n >\\n <TextInput\\n type={'number'}\\n name={'candidate.age'}\\n isDisabled={false}\\n id={'uniforms-0000-0003'}\\n placeholder={''}\\n step={1} \\n value={candidate__age}\\n onChange={(newValue) => set__candidate__age(Number(newValue))}\\n />\\n </FormGroup>\\n<FormGroup\\n fieldId={'uniforms-0000-0005'}\\n label={'Role'}\\n isRequired={true}\\n ><Select\\n id={'uniforms-0000-0005'}\\n name={'candidate.role'}\\n variant={SelectVariant.single}\\n isDisabled={false}\\n placeholderText={''}\\n isOpen={candidate__role__expanded}\\n selections={candidate__role}\\n onToggle={(isOpen) => set__candidate__role__expanded(isOpen)}\\n onSelect={(event, value, isPlaceHolder) => handleSelect(value, isPlaceHolder, candidate__role, set__candidate__role, set__candidate__role__expanded)}\\n value={candidate__role}\\n >\\n <SelectOption key={'Developer'} value={'Developer'}>Developer</SelectOption>\\n<SelectOption key={'HR'} value={'HR'}>HR</SelectOption>\\n<SelectOption key={'UX'} value={'UX'}>UX</SelectOption>\\n </Select></FormGroup>\\n<div>\\n <Split hasGutter>\\n <SplitItem>\\n {'Skills' && (\\n <label className={\\"pf-c-form__label\\"}>\\n <span className={\\"pf-c-form__label-text\\"}>\\n Skills\\n </span>\\n </label>\\n )}\\n </SplitItem>\\n <SplitItem isFilled />\\n <SplitItem>\\n <Button\\n name='$'\\n variant='plain'\\n style={{ paddingLeft: '0', paddingRight: '0' }}\\n disabled={false}\\n onClick={() => {\\n !false && set__candidate__skills((candidate__skills ?? []).concat([undefined]));\\n }}\\n >\\n <PlusCircleIcon color='#0088ce' />\\n </Button>\\n </SplitItem>\\n </Split>\\n <div>\\n {candidate__skills?.map((_, itemIndex) =>\\n (<div\\n key={itemIndex}\\n style={{\\n marginBottom: '1rem',\\n display: 'flex',\\n justifyContent: 'space-between',\\n }}\\n >\\n <div style={{ width: '100%', marginRight: '10px' }}><Card>\\n <CardBody className=\\"pf-c-form\\">\\n \\n <FormGroup\\n fieldId={'uniforms-0000-000a'}\\n label={'Name'}\\n isRequired={true}\\n >\\n <TextInput\\n name={\`candidate.skills.\${itemIndex}.name\`}\\n id={'uniforms-0000-000a'}\\n isDisabled={false}\\n placeholder={''}\\n type={'text'}\\n value={candidate__skills[itemIndex].name}\\n onChange={\\n newValue => {\\n set__candidate__skills(s => {\\n const newState = [...s];\\n newState[itemIndex].name = newValue;\\n return newState;\\n })\\n }}\\n />\\n </FormGroup>\\n </CardBody></Card></div>\\n <div>\\n <Button\\n disabled={false}\\n variant='plain'\\n style={{ paddingLeft: '0', paddingRight: '0' }}\\n onClick={() => {\\n const value = [...candidate__skills]\\n value.splice(itemIndex, 1);\\n !false && set__candidate__skills(value);\\n }}\\n >\\n <MinusCircleIcon color='#cc0000' />\\n </Button>\\n </div>\\n </div>)\\n )}\\n </div>\\n </div>\\n </CardBody></Card>","ref":{"binding":"candidate","stateName":"candidate","stateSetter":"set__candidate","dataType":{"name":"any"}},"childRefs":[{"binding":"candidate.name","stateName":"candidate__name","stateSetter":"set__candidate__name","dataType":{"name":"string","defaultValue":"\\"\\""}},{"binding":"candidate.age","stateName":"candidate__age","stateSetter":"set__candidate__age","dataType":{"name":"number"}},{"binding":"candidate.role","stateName":"candidate__role","stateSetter":"set__candidate__role","dataType":{"name":"string","defaultValue":"\\"\\""}},{"binding":"candidate.skills","stateName":"candidate__skills","stateSetter":"set__candidate__skills","dataType":{"name":"string[]","defaultValue":"[]"}}],"isReadonly":false}
`;