fix: added a few use client and if provider is not used asContainer, …

…the consumer needs to create a container themself
EAVFW · Apr 19, 2024 · 005f5fe · 005f5fe
1 parent 8d872c8
commit 005f5fe
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 5 deletions.
diff --git a/packages/core/src/components/error-popup/ErrorPopup.tsx b/packages/core/src/components/error-popup/ErrorPopup.tsx
@@ -1,3 +1,4 @@
+"use client";
 import React, { useState, useEffect } from 'react';
 import { useQuickForm } from "../../state/QuickFormContext";
 import { quickformtokens } from '../../style/quickFormTokensDefinition';

diff --git a/packages/core/src/components/paragraph/Paragraph.tsx b/packages/core/src/components/paragraph/Paragraph.tsx
@@ -1,3 +1,4 @@
+"use client";
 import { ReactNode } from "react";
 import React from "react";
 import { quickformtokens } from "../../style/quickFormTokensDefinition";

diff --git a/packages/core/src/components/renderers/slide-renderer/SlideRenderer.tsx b/packages/core/src/components/renderers/slide-renderer/SlideRenderer.tsx
@@ -1,3 +1,4 @@
+"use client";
 import React, { useEffect, useRef, useState } from 'react';
 import { useQuickForm } from '../../../state/QuickFormContext';
 import { Button } from '../../button/Button';

diff --git a/packages/core/src/state/QuickFormContext.tsx b/packages/core/src/state/QuickFormContext.tsx
@@ -16,6 +16,7 @@ interface IQuickFormContext {
     isFirstQuestionInCurrentSlide: (questionLogicalName: string) => boolean;
     getCurrentSlide: () => SlideModel;
     onSubmitAsync: (formdata: any) => Promise<string>;
+    cssVariables: { [key: string]: string };
 }
 
 export const QuickFormContext = React.createContext<IQuickFormContext>(
@@ -33,6 +34,7 @@ export const QuickFormContext = React.createContext<IQuickFormContext>(
             { questions: [], rows: [], isAnswered: false, addQuestion: () => ({ type: "question", ref: "" }) }
         ),
         onSubmitAsync: async (formdata) => { return "" },
+        cssVariables: {}
     }
 );
 

diff --git a/packages/core/src/state/QuickformProvider.tsx b/packages/core/src/state/QuickformProvider.tsx
@@ -10,6 +10,7 @@ import { kbaQuickFormTokens } from "../style/kbaQuickFormTokens";
 import { isFirstQInCurrentSlide } from "../utils/isFirstQuestionInSlide";
 
 type QuickFormProviderProps = {
+    className?:string,
     children: React.ReactNode;
     definition: QuickFormDefinition;
     tokens?: Partial<QuickFormTokens>;
@@ -20,6 +21,7 @@ type QuickFormProviderProps = {
 
 export const QuickFormProvider: React.FC<QuickFormProviderProps> = (
     {
+        className,
         children,
         definition,
         payload,
@@ -50,7 +52,7 @@ export const QuickFormProvider: React.FC<QuickFormProviderProps> = (
     const setErrorMsg = (msg: string) => { dispatch({ type: "SET_ERROR_MSG", msg: msg }) };
     const isFirstQuestionInCurrentSlide = (questionLogicalName: string) => { return isFirstQInCurrentSlide(questionLogicalName, state); }
     const getCurrentSlide = () => (state.slides[state.currIdx]);
-
+    console.log("children", children);
     return (
         <QuickFormContext.Provider value={{
             state,
@@ -64,6 +66,7 @@ export const QuickFormProvider: React.FC<QuickFormProviderProps> = (
             isFirstQuestionInCurrentSlide,
             getCurrentSlide,
             onSubmitAsync,
+            cssVariables
         }}>
 
             {asContainer ? (
@@ -72,10 +75,8 @@ export const QuickFormProvider: React.FC<QuickFormProviderProps> = (
                     {children}
                 </QuickFormContainer>
             ) : (
-                <div style={cssVariables}>
-                    <ErrorPopup message={state.errorMsg} />
-                    {children}
-                </div>
+                     children 
+
             )
             }
         </QuickFormContext.Provider>