diff --git a/example/src/Onboarding.tsx b/example/src/Onboarding.tsx index 76a3a355..fa68e73a 100644 --- a/example/src/Onboarding.tsx +++ b/example/src/Onboarding.tsx @@ -374,7 +374,7 @@ const OnboardingWithProps = ({ }, DEU: { // Germany - contract_details: 1, + contract_details: 4, }, BLR: { // Belarus diff --git a/src/components/form/fields/default/RadioGroupFieldDefault.tsx b/src/components/form/fields/default/RadioGroupFieldDefault.tsx index aaf34d1d..366a5ee0 100644 --- a/src/components/form/fields/default/RadioGroupFieldDefault.tsx +++ b/src/components/form/fields/default/RadioGroupFieldDefault.tsx @@ -8,14 +8,15 @@ import { } from '@/src/components/ui/form'; import { RadioGroup, RadioGroupItem } from '@/src/components/ui/radio-group'; import { cn } from '@/src/lib/utils'; -import { FieldComponentProps } from '@/src/types/fields'; +import { RadioGroupComponentProps } from '@/src/types/fields'; import { HelpCenter } from '@/src/components/shared/zendesk-drawer/HelpCenter'; +import { Badge } from '@/src/components/ui/badge'; export const RadioGroupFieldDefault = ({ field, fieldData, fieldState, -}: FieldComponentProps) => { +}: RadioGroupComponentProps) => { const { name, label, description, options } = fieldData; return (
{options?.map((option) => (
- {option.label} + {option.label}{' '} + {option.recommended && ( + + Recommended + + )} {option.description && ( diff --git a/src/types/fields.ts b/src/types/fields.ts index ef0567ac..5e9a3bfa 100644 --- a/src/types/fields.ts +++ b/src/types/fields.ts @@ -147,3 +147,22 @@ export type PricingPlanComponentProps = Omit< export type TelFieldComponentProps = Omit & { fieldData: TelFieldDataProps; }; + +type RadioGroupDataProps = Omit & { + options?: Array<{ + value: string; + label: string; + description?: string; + disabled?: boolean; + recommended?: boolean; + nested_field?: string; + meta?: Record; + }>; +}; + +export type RadioGroupComponentProps = Omit< + FieldComponentProps, + 'fieldData' +> & { + fieldData: RadioGroupDataProps; +}; diff --git a/src/types/remoteFlows.ts b/src/types/remoteFlows.ts index b6965657..0134c52e 100644 --- a/src/types/remoteFlows.ts +++ b/src/types/remoteFlows.ts @@ -14,6 +14,7 @@ import { TextFieldComponentProps, WorkScheduleComponentProps, TelFieldComponentProps, + RadioGroupComponentProps, } from '@/src/types/fields'; type AuthResponse = { @@ -137,6 +138,7 @@ type FieldComponentTypes = Exclude< | 'money' | 'date' | 'tel' + | 'radio' >; export type Components = { @@ -155,6 +157,7 @@ export type Components = { 'work-schedule'?: React.ComponentType; pdfViewer?: React.ComponentType; tel?: React.ComponentType; + radio?: React.ComponentType; }; export type RemoteFlowsSDKProps = Omit & {