@norges-domstoler/dds-components 13.4.0 → 13.6.0

package/dist/components/BackLink/BackLink.js

@@ -23,19 +23,17 @@ var StyledIcon = styled(Icon).withConfig({
   componentId: "sc-lzrkx8-1"
 })(["color:", ";"], backLinkTokens.icon.color);
 var BackLink = /*#__PURE__*/forwardRef(function (props, ref) {
-  return jsxs(Nav, Object.assign({
-    ref: ref
-  }, {
+  return jsxs(Nav, {
+    ref: ref,
     children: [jsx(StyledIcon, {
       icon: ArrowLeftIcon,
       iconSize: "small"
-    }), jsx(Typography, Object.assign({
+    }), jsx(Typography, {
       typographyType: "a",
-      href: props.href
-    }, {
+      href: props.href,
       children: props.label
-    }))]
-  }));
+    })]
+  });
 });
 BackLink.displayName = 'BackLink';
 

package/dist/components/Breadcrumbs/Breadcrumb.js

@@ -16,22 +16,20 @@ var Breadcrumb = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
     rest = __rest(props, ["children"]);
   if (isAnchorTypographyProps(props)) {
-    return jsx(Typography, Object.assign({
+    return jsx(Typography, {
       htmlProps: rest,
       ref: ref,
-      typographyType: "a"
-    }, {
+      typographyType: "a",
       children: children
-    }));
+    });
   }
-  return jsx(Typography, Object.assign({
+  return jsx(Typography, {
     htmlProps: rest,
     ref: ref,
     as: "span",
-    color: "interactive"
-  }, {
+    color: "interactive",
     children: children
-  }));
+  });
 });
 Breadcrumb.displayName = 'Breadcrumb';
 

package/dist/components/Breadcrumbs/Breadcrumbs.js

@@ -43,8 +43,7 @@ var Breadcrumbs = /*#__PURE__*/forwardRef(function (props, ref) {
   });
   return jsx("nav", Object.assign({}, getBaseHTMLProps(id, className, htmlProps, rest), {
     ref: ref,
-    "aria-label": "br\xF8dsmulesti"
-  }, {
+    "aria-label": "br\xF8dsmulesti",
     children: jsx(List, {
       children: breadcrumbChildren
     })

package/dist/components/Button/Button.js

@@ -63,36 +63,32 @@ var Button = /*#__PURE__*/forwardRef(function (props, ref) {
     onBlur: onBlur
   });
   var isIconButton = !hasLabel && hasIcon;
-  var iconElement = icon && jsx(StyledIconWrapperSpan, Object.assign({
+  var iconElement = icon && jsx(StyledIconWrapperSpan, {
     size: size,
     isHidden: hasIcon && loading,
-    justIcon: isIconButton
-  }, {
+    justIcon: isIconButton,
     children: jsx(Icon, {
       icon: icon,
       iconSize: "inherit"
     })
-  }));
+  });
   return jsxs(ButtonWrapper, Object.assign({}, wrapperProps, {
-    "aria-disabled": loading
-  }, {
+    "aria-disabled": loading,
     children: [!isIconButton && jsxs(Fragment, {
-      children: [iconPosition === 'left' && iconElement, jsx(Label, Object.assign({
+      children: [iconPosition === 'left' && iconElement, jsx(Label, {
         isHidden: loading,
-        "aria-hidden": loading
-      }, {
+        "aria-hidden": loading,
         children: label
-      })), iconPosition === 'right' && iconElement]
-    }), isIconButton && iconElement, loading && jsx(StyledIconWrapperSpan, Object.assign({
+      }), iconPosition === 'right' && iconElement]
+    }), isIconButton && iconElement, loading && jsx(StyledIconWrapperSpan, {
       size: size,
-      absolutePosition: hasIcon || hasLabel
-    }, {
+      absolutePosition: hasIcon || hasLabel,
       children: jsx(Spinner, {
         color: appearances[appearance].purpose[purpose].base.color,
         size: sizes[size].justIcon.icon.fontSize,
         tooltip: loadingTooltip
       })
-    }))]
+    })]
   }));
 });
 Button.displayName = 'Button';

package/dist/components/Button/Button.stories.d.ts

@@ -2,7 +2,7 @@
 import { ButtonProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onFocus" | "onBlur" | "onClick" | "type">, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onFocus" | "onBlur" | "onClick">, "className" | "id"> & {
         size?: import("./Button.types").ButtonSize | undefined;
         label?: string | undefined;
         purpose?: import("./Button.types").ButtonPurpose | undefined;
@@ -15,12 +15,12 @@ declare const _default: {
         href?: string | undefined;
         target?: string | undefined;
     } & {
+        type?: "button" | "submit" | "reset" | undefined;
         onFocus?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
         onBlur?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
         onClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
-        type?: "button" | "submit" | "reset" | undefined;
     } & {
-        htmlProps?: Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onFocus" | "onBlur" | "onClick" | "type"> | undefined;
+        htmlProps?: Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onFocus" | "onBlur" | "onClick"> | undefined;
     } & import("react").RefAttributes<HTMLButtonElement>>;
     argTypes: {
         label: {

package/dist/components/Card/Card.js

@@ -39,8 +39,7 @@ var Card = function Card(props) {
       as: "a",
       ref: cardRef,
       href: href,
-      target: target
-    }, {
+      target: target,
       children: children
     }));
   }
@@ -48,8 +47,7 @@ var Card = function Card(props) {
     cardType: cardType,
     color: color,
     as: "div",
-    ref: cardRef
-  }, {
+    ref: cardRef,
     children: children
   }));
 };

package/dist/components/Card/CardAccordion/CardAccordionBody.js

@@ -79,11 +79,9 @@ var CardAccordionBody = /*#__PURE__*/forwardRef(function (props, ref) {
   return jsx(Body, Object.assign({}, bodyProps, {
     animate: animate,
     "aria-labelledby": headerId,
-    "aria-hidden": !isExpanded
-  }, {
+    "aria-hidden": !isExpanded,
     children: jsx(BodyContainer, Object.assign({}, bodyContainerProps, {
-      animate: animate
-    }, {
+      animate: animate,
       children: children
     }))
   }));

package/dist/components/Card/CardAccordion/CardAccordionHeader.js

@@ -84,19 +84,17 @@ var CardAccordionHeader = /*#__PURE__*/forwardRef(function (props, ref) {
     height: cardAccordionTokens.chevron.height
   };
   return jsx(HeaderWrapperButton, Object.assign({}, headerWrapperProps, {
-    type: "button"
-  }, {
-    children: jsxs(HeaderContainer, Object.assign({
+    type: "button",
+    children: jsxs(HeaderContainer, {
       typographyType: typographyType,
       padding: padding,
-      bold: bold
-    }, {
+      bold: bold,
       children: [jsx(ContentWrapper, {
         children: children
       }), jsx(ChevronWrapper, {
         children: jsx(AnimatedChevronUpDown, Object.assign({}, chevronProps))
       })]
-    }))
+    })
   }));
 });
 CardAccordionHeader.displayName = 'CardAccordionHeader';

package/dist/components/Checkbox/Checkbox.js

@@ -66,20 +66,18 @@ var Checkbox = /*#__PURE__*/forwardRef(function (props, ref) {
     'aria-readonly': readOnly
   });
   return jsxs(Container, Object.assign({}, containerProps, {
-    controlType: "checkbox"
-  }, {
+    controlType: "checkbox",
     children: [jsx(HiddenInput, Object.assign({}, inputProps, {
       type: "checkbox",
       "data-indeterminate": indeterminate
     })), jsx(CustomSelectionControl, {
       controlType: "checkbox"
-    }), hasLabel && jsx(Typography, Object.assign({
+    }), hasLabel && jsx(Typography, {
       color: "inherit",
       as: "span",
-      typographyType: "bodySans02"
-    }, {
+      typographyType: "bodySans02",
       children: label
-    }))]
+    })]
   }));
 });
 Checkbox.displayName = 'Checkbox';

package/dist/components/Checkbox/Checkbox.stories.d.ts

@@ -2,14 +2,14 @@
 import { CheckboxProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "defaultChecked" | "defaultValue" | "aria-describedby" | "onBlur" | "onChange" | "name" | "value" | "checked">, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "name" | "defaultChecked" | "defaultValue" | "aria-describedby" | "onBlur" | "onChange" | "value" | "checked">, "className" | "id"> & {
         label?: string | undefined;
         error?: boolean | undefined;
         disabled?: boolean | undefined;
         readOnly?: boolean | undefined;
         indeterminate?: boolean | undefined;
     } & import("../../types").CheckboxPickedHTMLAttributes & {
-        htmlProps?: Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "defaultChecked" | "defaultValue" | "aria-describedby" | "onBlur" | "onChange" | "name" | "value" | "checked"> | undefined;
+        htmlProps?: Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "name" | "defaultChecked" | "defaultValue" | "aria-describedby" | "onBlur" | "onChange" | "value" | "checked"> | undefined;
     } & import("react").RefAttributes<HTMLInputElement>>;
     argTypes: {
         label: {

package/dist/components/Checkbox/CheckboxGroup.js

@@ -55,24 +55,21 @@ var CheckboxGroup = function CheckboxGroup(props) {
   return jsxs(OuterGroupContainer, Object.assign({}, getBaseHTMLProps(id, className, Object.assign(Object.assign({}, htmlProps), {
     'aria-required': ariaRequired
   }), rest), {
-    children: [jsxs(Typography, Object.assign({
+    children: [jsxs(Typography, {
       as: "span",
       typographyType: "supportingStyleLabel01",
-      id: uniqueGroupId
-    }, {
+      id: uniqueGroupId,
       children: [label, " ", showRequiredMarker && jsx(RequiredMarker, {})]
-    })), renderInputMessage(tip, tipId), jsx(CheckboxGroupContext.Provider, Object.assign({
-      value: Object.assign({}, contextProps)
-    }, {
-      children: jsx(GroupContainer, Object.assign({
+    }), renderInputMessage(tip, tipId), jsx(CheckboxGroupContext.Provider, {
+      value: Object.assign({}, contextProps),
+      children: jsx(GroupContainer, {
         role: "group",
         "aria-labelledby": uniqueGroupId,
         "aria-describedby": tip ? tipId : undefined,
-        direction: direction
-      }, {
+        direction: direction,
         children: children
-      }))
-    })), renderInputMessage(undefined, undefined, errorMessage, errorMessageId)]
+      })
+    }), renderInputMessage(undefined, undefined, errorMessage, errorMessageId)]
   }));
 };
 CheckboxGroup.displayName = 'CheckboxGroup';

package/dist/components/Chip/Chip.js

@@ -36,8 +36,7 @@ var Chip = /*#__PURE__*/forwardRef(function (props, ref) {
   };
   return isOpen ? jsxs(Container, Object.assign({}, getBaseHTMLProps(id, className, restHTMLprops, rest), {
     ref: ref,
-    as: "div"
-  }, {
+    as: "div",
     children: [jsx(TextOverflowEllipsisInner, {
       children: text
     }), jsx(Button, {

package/dist/components/Chip/Chip.stories.d.ts

@@ -2,7 +2,7 @@
 import { ChipProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
         text?: string | undefined;
         onClose?: (() => void) | undefined;
     } & {

package/dist/components/Chip/ChipGroup.js

@@ -19,8 +19,7 @@ var ChipGroup = /*#__PURE__*/forwardRef(function (_a, ref) {
     }, "chip-".concat(index));
   });
   return jsx(Group, Object.assign({}, rest, {
-    ref: ref
-  }, {
+    ref: ref,
     children: groupChildren
   }));
 });

package/dist/components/Datepicker/Datepicker.js

@@ -85,12 +85,11 @@ var Datepicker = /*#__PURE__*/forwardRef(function (_a, ref) {
     className: className
   };
   return jsxs(OuterInputContainer, Object.assign({}, outerinputContainerProps, {
-    children: [hasLabel && jsx(Label, Object.assign({
+    children: [hasLabel && jsx(Label, {
       htmlFor: uniqueId,
-      showRequiredStyling: showRequiredStyling
-    }, {
+      showRequiredStyling: showRequiredStyling,
       children: label
-    })), jsx(StyledInput, Object.assign({}, inputProps)), renderInputMessage(tip, tipId, errorMessage, errorMessageId)]
+    }), jsx(StyledInput, Object.assign({}, inputProps)), renderInputMessage(tip, tipId, errorMessage, errorMessageId)]
   }));
 });
 Datepicker.displayName = 'Datepicker';

package/dist/components/DescriptionList/DescriptionList.stories.d.ts

@@ -2,9 +2,9 @@
 import { DescriptionListProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDListElement>, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDListElement>, "className" | "id"> & {
         appearance?: import("./DescriptionList").DescriptionListAppearance | undefined;
-        direction?: "row" | "column" | undefined;
+        direction?: "column" | "row" | undefined;
     } & {
         children?: import("react").ReactNode;
     } & {

package/dist/components/Divider/Divider.stories.d.ts

@@ -2,7 +2,7 @@
 import { DividerProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLHRElement>, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLHRElement>, "className" | "id"> & {
         color?: import("./Divider").DividerColor | undefined;
     } & {
         htmlProps?: import("react").HTMLAttributes<HTMLHRElement> | undefined;

package/dist/components/Drawer/Drawer.js

@@ -120,16 +120,14 @@ var Drawer = /*#__PURE__*/forwardRef(function (props, ref) {
     id: headerId
   };
   return isOpen || hasTransitionedIn ? /*#__PURE__*/createPortal(jsxs(Container, Object.assign({}, containerProps, {
-    elevation: 4
-  }, {
+    elevation: 4,
     children: [jsx(ScrollableContainer, {
       children: jsxs(ContentContainer, {
         children: [hasHeader && jsx(HeaderContainer, Object.assign({}, headerContainerProps, {
-          children: typeof header === 'string' ? jsx(Typography, Object.assign({
-            typographyType: "headingSans03"
-          }, {
+          children: typeof header === 'string' ? jsx(Typography, {
+            typographyType: "headingSans03",
             children: header
-          })) : header
+          }) : header
         })), children]
       })
     }), jsx(StyledButton, {

package/dist/components/Drawer/Drawer.stories.d.ts

@@ -2,7 +2,7 @@
 import { DrawerProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
         size?: import("./Drawer").DrawerSize | undefined;
         placement?: import("./Drawer").DrawerPlacement | undefined;
         header?: import("react").ReactNode;

package/dist/components/EmptyContent/EmptyContent.js

@@ -26,15 +26,13 @@ function EmptyContent(_a) {
     rest = __rest(_a, ["title", "message"]);
   return jsx(StyledEmptyContent, Object.assign({}, rest, {
     children: jsxs(StyledEmptyContentText, {
-      children: [title && jsx(Typography, Object.assign({
-        typographyType: "headingSans02"
-      }, {
+      children: [title && jsx(Typography, {
+        typographyType: "headingSans02",
         children: title
-      })), jsx(Typography, Object.assign({
-        typographyType: "bodySans02"
-      }, {
+      }), jsx(Typography, {
+        typographyType: "bodySans02",
         children: message
-      }))]
+      })]
     })
   }));
 }

package/dist/components/Feedback/CommentComponent.d.ts

@@ -0,0 +1,13 @@
+import { Rating } from './Feedback.types';
+type CommentComponentType = {
+    rating: Rating | null;
+    feedbackText: string | undefined;
+    positiveFeedbackLabel: string;
+    negativeFeedbackLabel: string;
+    ratingSubmittedTitle: string;
+    loading: boolean;
+    handleSubmit: () => void;
+    handleFeedbackTextChange: (newText: string) => void;
+};
+export declare const CommentComponent: ({ rating, feedbackText, positiveFeedbackLabel, negativeFeedbackLabel, ratingSubmittedTitle, loading, handleSubmit, handleFeedbackTextChange, }: CommentComponentType) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Feedback/CommentComponent.js

@@ -0,0 +1,59 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import styled from 'styled-components';
+import { FlexContainer } from './FlexContainer.js';
+import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
+import { Icon } from '../Icon/Icon.js';
+import 'tslib';
+import '../../icons/utils/StyledSvg.js';
+import { ThumbdownFilled } from '../../icons/tsx/thumbdownFilled.js';
+import { ThumbupFilled } from '../../icons/tsx/thumbupFilled.js';
+import { Button } from '../Button/Button.js';
+import { TextArea } from '../TextArea/TextArea.js';
+import '../Typography/Typography/Typography.js';
+import '../Typography/Label/Label.js';
+import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
+import '../Typography/Heading/Heading.js';
+import '../Typography/Link/Link.js';
+import '../Typography/Legend/Legend.js';
+import '../Typography/Caption/Caption.js';
+
+var IconLabelSpan = styled.span.withConfig({
+  displayName: "CommentComponent__IconLabelSpan",
+  componentId: "sc-15c6vik-0"
+})(["display:inline-flex;align-items:center;gap:", ";"], ddsBaseTokens.spacing.SizesDdsSpacingLocalX05);
+var CommentComponent = function CommentComponent(_ref) {
+  var rating = _ref.rating,
+    feedbackText = _ref.feedbackText,
+    positiveFeedbackLabel = _ref.positiveFeedbackLabel,
+    negativeFeedbackLabel = _ref.negativeFeedbackLabel,
+    ratingSubmittedTitle = _ref.ratingSubmittedTitle,
+    loading = _ref.loading,
+    handleSubmit = _ref.handleSubmit,
+    handleFeedbackTextChange = _ref.handleFeedbackTextChange;
+  return jsxs(FlexContainer, {
+    flexDirection: "column",
+    children: [jsxs(IconLabelSpan, {
+      children: [jsx(Icon, {
+        icon: rating === 'positive' ? ThumbupFilled : ThumbdownFilled,
+        color: ddsBaseTokens.colors.DdsColorInteractiveBase
+      }), jsxs(Paragraph, {
+        children: [ratingSubmittedTitle, " "]
+      })]
+    }), jsx(TextArea, {
+      value: feedbackText,
+      onChange: function onChange(e) {
+        return handleFeedbackTextChange(e.target.value);
+      },
+      label: rating === 'positive' ? positiveFeedbackLabel : negativeFeedbackLabel,
+      tip: "Ikke send inn personopplysninger eller annen sensitiv informasjon"
+    }), jsx(Button, {
+      label: "Send inn",
+      purpose: "secondary",
+      size: "small",
+      onClick: handleSubmit,
+      loading: loading
+    })]
+  });
+};
+
+export { CommentComponent };

package/dist/components/Feedback/Feedback.d.ts

@@ -0,0 +1,2 @@
+import { FeedbackProps } from './Feedback.types';
+export declare const Feedback: ({ layout, ratingLabel, positiveFeedbackLabel, negativeFeedbackLabel, ratingSubmittedTitle, submittedTitle, ratingValue: ratingProp, feedbackTextValue: feedbackTextProp, thumbUpTooltip, thumbDownTooltip, feedbackTextAreaExcluded, loading, isSubmitted: isSubmittedProp, onRating, onFeedbackTextChange, onSubmit, }: FeedbackProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Feedback/Feedback.js

@@ -0,0 +1,103 @@
+import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+import '../Typography/Typography/Typography.js';
+import '../Typography/Label/Label.js';
+import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
+import '../Typography/Heading/Heading.js';
+import '../Typography/Link/Link.js';
+import '../Typography/Legend/Legend.js';
+import '../Typography/Caption/Caption.js';
+import { RatingComponent } from './RatingComponent.js';
+import { CommentComponent } from './CommentComponent.js';
+
+var Feedback = function Feedback(_ref) {
+  var _ref$layout = _ref.layout,
+    layout = _ref$layout === void 0 ? 'vertical' : _ref$layout,
+    _ref$ratingLabel = _ref.ratingLabel,
+    ratingLabel = _ref$ratingLabel === void 0 ? 'Hva syns du om tjenesten?' : _ref$ratingLabel,
+    _ref$positiveFeedback = _ref.positiveFeedbackLabel,
+    positiveFeedbackLabel = _ref$positiveFeedback === void 0 ? 'Hva kan vi forbedre? (valgfritt)' : _ref$positiveFeedback,
+    _ref$negativeFeedback = _ref.negativeFeedbackLabel,
+    negativeFeedbackLabel = _ref$negativeFeedback === void 0 ? 'Hva kan vi forbedre? (valgfritt)' : _ref$negativeFeedback,
+    _ref$ratingSubmittedT = _ref.ratingSubmittedTitle,
+    ratingSubmittedTitle = _ref$ratingSubmittedT === void 0 ? 'Tusen takk! Tilbakemeldingen din hjelper oss å forbedre løsningen' : _ref$ratingSubmittedT,
+    _ref$submittedTitle = _ref.submittedTitle,
+    submittedTitle = _ref$submittedTitle === void 0 ? 'Tusen takk! Tilbakemeldingen din hjelper oss å forbedre løsningen' : _ref$submittedTitle,
+    ratingProp = _ref.ratingValue,
+    feedbackTextProp = _ref.feedbackTextValue,
+    _ref$thumbUpTooltip = _ref.thumbUpTooltip,
+    thumbUpTooltip = _ref$thumbUpTooltip === void 0 ? 'Bra' : _ref$thumbUpTooltip,
+    _ref$thumbDownTooltip = _ref.thumbDownTooltip,
+    thumbDownTooltip = _ref$thumbDownTooltip === void 0 ? 'Dårlig' : _ref$thumbDownTooltip,
+    _ref$feedbackTextArea = _ref.feedbackTextAreaExcluded,
+    feedbackTextAreaExcluded = _ref$feedbackTextArea === void 0 ? false : _ref$feedbackTextArea,
+    _ref$loading = _ref.loading,
+    loading = _ref$loading === void 0 ? false : _ref$loading,
+    isSubmittedProp = _ref.isSubmitted,
+    onRating = _ref.onRating,
+    onFeedbackTextChange = _ref.onFeedbackTextChange,
+    onSubmit = _ref.onSubmit;
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    rating = _useState2[0],
+    setRating = _useState2[1];
+  var _useState3 = useState(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    feedbackText = _useState4[0],
+    setFeedbackText = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isFeedbackSubmitted = _useState6[0],
+    setIsFeedbackSubmitted = _useState6[1];
+  useEffect(function () {
+    ratingProp !== undefined && setRating(ratingProp);
+  }, [ratingProp]);
+  useEffect(function () {
+    feedbackTextProp !== undefined && setFeedbackText(feedbackTextProp);
+  }, [feedbackTextProp]);
+  useEffect(function () {
+    isSubmittedProp !== undefined && setIsFeedbackSubmitted(isSubmittedProp);
+  }, [isSubmittedProp]);
+  var handleRatingChange = function handleRatingChange(newRating) {
+    onRating && onRating(newRating);
+    onSubmit && feedbackTextAreaExcluded && onSubmit(newRating, '');
+    ratingProp === undefined && setRating(newRating);
+  };
+  var handleFeedbackTextChange = function handleFeedbackTextChange(newFeedbackText) {
+    onFeedbackTextChange && onFeedbackTextChange(newFeedbackText);
+    feedbackTextProp === undefined && setFeedbackText(newFeedbackText);
+  };
+  var handleSubmit = function handleSubmit() {
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- Ved submit er rating alltid satt
+    onSubmit && onSubmit(rating, feedbackText !== null && feedbackText !== void 0 ? feedbackText : '');
+    isSubmittedProp === undefined && setIsFeedbackSubmitted(true);
+  };
+  if (rating === null && !isFeedbackSubmitted) {
+    return jsx(RatingComponent, {
+      layout: layout,
+      ratingLabel: ratingLabel,
+      loading: loading,
+      thumbUpTooltip: thumbUpTooltip,
+      thumbDownTooltip: thumbDownTooltip,
+      handleRatingChange: handleRatingChange
+    });
+  }
+  if (!feedbackTextAreaExcluded && !isFeedbackSubmitted) {
+    return jsx(CommentComponent, {
+      rating: rating,
+      feedbackText: feedbackText,
+      positiveFeedbackLabel: positiveFeedbackLabel,
+      negativeFeedbackLabel: negativeFeedbackLabel,
+      ratingSubmittedTitle: ratingSubmittedTitle,
+      loading: loading,
+      handleSubmit: handleSubmit,
+      handleFeedbackTextChange: handleFeedbackTextChange
+    });
+  }
+  return jsx(Paragraph, {
+    children: submittedTitle
+  });
+};
+
+export { Feedback };