Merge remote-tracking branch 'origin/master' into andreasn/remove-form

CHANGES

@@ -1,3 +1,9 @@
+## 14.0.1
+
+---
+
+- fixed slidercomponent not showing children
+
 ## 14.0.0-beta02
 
 - Added table feature to new major version

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@helsenorge/refero",
-  "version": "14.0.0-beta02",
+  "version": "14.0.1",
   "engines": {
     "node": "^18.0.0",
     "npm": ">=9.0.0"

src/components/formcomponents/choice/choice.tsx

@@ -237,7 +237,11 @@ const Choice: React.FC<ChoiceProps & ValidationProps> = props => {
   };
 
   const renderSlider = (): JSX.Element => {
-    return <SliderView item={props.item} handleChange={handleChange} />;
+    return (
+      <SliderView item={props.item} handleChange={handleChange}>
+        {props.children}
+      </SliderView>
+    );
   };
 
   const renderAutosuggest = (): JSX.Element => {

src/components/formcomponents/choice/slider-view.tsx

@@ -10,11 +10,12 @@ import { getExtension } from '../../../util/extension';
 interface SliderProps {
   item: QuestionnaireItem;
   handleChange: (sliderStep: string) => void;
+  children: React.ReactNode;
 }
 
 type LeftRightLabels = [leftLabel: string, rightLabel: string];
 
-const SliderView: React.FC<SliderProps> = ({ item, handleChange }) => {
+const SliderView: React.FC<SliderProps> = ({ item, handleChange, children }) => {
   const title = item.text;
   const [sliderSteps, setSliderSteps] = React.useState<SliderStep[] | undefined>(undefined);
   const [leftRightLabels, setleftRightLabels] = React.useState<LeftRightLabels | undefined>(undefined);
@@ -36,7 +37,14 @@ const SliderView: React.FC<SliderProps> = ({ item, handleChange }) => {
 
   return (
     <div className="page_refero__component page_refero__component_choice page_refero__component_choice_slider">
-      <Slider title={title} labelLeft={leftRightLabels?.[0]} labelRight={leftRightLabels?.[1]} onChange={onValueChange} steps={sliderSteps} />
+      <Slider
+        title={title}
+        labelLeft={leftRightLabels?.[0]}
+        labelRight={leftRightLabels?.[1]}
+        onChange={onValueChange}
+        steps={sliderSteps}
+      />
+      {children ? <div className="nested-fieldset nested-fieldset--full-height">{children}</div> : undefined}
     </div>
   );
 };

src/components/formcomponents/open-choice/open-choice.tsx

@@ -395,8 +395,13 @@ const OpenChoice: React.FC<OpenChoiceProps & ValidationProps> = props => {
       </AutosuggestView>
     );
   };
+
   const renderSlider = (): JSX.Element => {
-    return <SliderView item={props.item} handleChange={handleChange} />;
+    return (
+      <SliderView item={props.item} handleChange={handleChange}>
+        {props.children}
+      </SliderView>
+    );
   };
   // React.useMemo(() => {
   //   const responseItemHasChanged = props.responseItem !== props.responseItem;