diff --git a/package.json b/package.json index ed37ee0..9535dca 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@awell-health/ui-library", - "version": "0.1.56", + "version": "0.1.57", "private": false, "description": "UI components to integrate with Awell Health", "repository": { diff --git a/src/hostedPages/activities/form/ConversationalForm.tsx b/src/hostedPages/activities/form/ConversationalForm.tsx index 459dfce..fe11a60 100644 --- a/src/hostedPages/activities/form/ConversationalForm.tsx +++ b/src/hostedPages/activities/form/ConversationalForm.tsx @@ -23,6 +23,7 @@ export const ConversationalForm = ({ onAnswersChange, autoProgress = false, autosaveAnswers = true, + showProgressBar = true, }: FormProps) => { const { submitForm, @@ -83,7 +84,8 @@ export const ConversationalForm = ({ // hide progress indicator when all questions are evaluated or when form only has one question const hideProgressIndicator = (isEvaluatingQuestionVisibility && percentageCompleted === 100) || - form.questions.length === 1 + form.questions.length === 1 || + showProgressBar === false return ( <> diff --git a/src/hostedPages/activities/form/form.stories.tsx b/src/hostedPages/activities/form/form.stories.tsx index 0e55d85..55adfae 100644 --- a/src/hostedPages/activities/form/form.stories.tsx +++ b/src/hostedPages/activities/form/form.stories.tsx @@ -50,6 +50,11 @@ export default { control: { type: 'radio' }, defaultValue: false, }, + showProgressBar: { + options: [true, false], + control: { type: 'radio' }, + defaultValue: true, + }, }, decorators: [ (StoryComponent) => ( @@ -67,6 +72,7 @@ const MyStory: Story = ({ displayMode, autoProgress, errorLabels, + showProgressBar, }) => { const [answers, setAnswers] = React.useState('') const isConversationalMode = displayMode == 'conversational' @@ -92,6 +98,7 @@ const MyStory: Story = ({ storedAnswers={answers} onAnswersChange={handleAnswersChange} key={form.id} + showProgressBar={showProgressBar} questionLabels={{ no_label: 'No', yes_label: 'Yes', @@ -134,6 +141,7 @@ const MyStory: Story = ({ storedAnswers={answers} onAnswersChange={handleAnswersChange} key={form.id} + showProgressBar={showProgressBar} questionLabels={{ no_label: 'No', yes_label: 'Yes', @@ -176,6 +184,7 @@ export const Form: Story = ({ displayMode, errorLabels, autoProgress, + showProgressBar, }) => { return ( ) } @@ -215,6 +225,7 @@ export const FormMobile: Story = ({ buttonLabels, displayMode, errorLabels, + showProgressBar, }) => { return ( ) } diff --git a/src/types/form.ts b/src/types/form.ts index cb50eb8..d029a93 100644 --- a/src/types/form.ts +++ b/src/types/form.ts @@ -26,4 +26,5 @@ export interface FormProps { ) => Promise> autoProgress?: boolean autosaveAnswers?: boolean + showProgressBar?: boolean }