@norges-domstoler/dds-components 24.2.0 → 24.2.2

package/dist/index.cjs

@@ -7349,22 +7349,15 @@ const TextArea = ({ id, value, defaultValue, onChange, errorMessage, required =
 };
 TextArea.displayName = "TextArea";
 //#endregion
-//#region src/components/Feedback/utils.tsx
-const getIconSize = (layout) => layout === "vertical" ? "large" : "medium";
-//#endregion
 //#region src/components/Feedback/CommentComponent.tsx
-const CommentComponent = ({ layout, rating, feedbackText, positiveFeedbackLabel, negativeFeedbackLabel, ratingSubmittedTitle, textAreaTip, loading, handleSubmit, handleFeedbackTextChange }) => {
+const CommentComponent = ({ rating, feedbackText, positiveFeedbackLabel, negativeFeedbackLabel, ratingSubmittedTitle, textAreaTip, loading, handleSubmit, handleFeedbackTextChange }) => {
 	const { t } = useTranslation();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
 		gap: "x1",
 		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				className: Feedback_module_default["rating-submitted-title"],
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
-					icon: rating === "positive" ? ThumbUpFilledIcon : ThumbDownFilledIcon,
-					color: "icon-action-resting",
-					iconSize: getIconSize(layout)
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Paragraph, { children: [ratingSubmittedTitle, " "] })]
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Paragraph, { children: [ratingSubmittedTitle, " "] })
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextArea, {
 				value: feedbackText,
@@ -7390,6 +7383,9 @@ const texts$17 = createTexts({ send: {
 	se: "Sádde"
 } });
 //#endregion
+//#region src/components/Feedback/utils.tsx
+const getButtonSize = (layout) => layout === "vertical" ? "medium" : "small";
+//#endregion
 //#region src/components/Tooltip/Tooltip.tsx
 const Tooltip = ({ text, placement = "bottom", children, tooltipId, delay = 100, style, onMouseLeave, onMouseOver, keepMounted = true, id, ref, className, htmlProps, ...rest }) => {
 	const generatedId = (0, react.useId)();
@@ -7485,26 +7481,32 @@ Tooltip.displayName = "Tooltip";
 //#region src/components/Feedback/RatingComponent.tsx
 const RatingComponent = ({ layout, ratingLabel, loading, thumbUpTooltip, thumbDownTooltip, handleRatingChange }) => {
 	const { t } = useTranslation();
-	const button = (rating, layout, tooltip) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(InlineIconButton, {
-		"aria-label": tooltip,
-		onClick: () => handleRatingChange(rating),
-		size: getIconSize(layout),
-		icon: rating === "positive" ? ThumbUpIcon : ThumbDownIcon,
-		color: "icon-medium"
-	});
+	const buttonSize = getButtonSize(layout);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: cn(Feedback_module_default["rating-container"], Feedback_module_default[`rating-container--${layout}`]),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
 			className: typographyStyles_module_default["label-medium"],
 			children: ratingLabel
 		}), loading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Spinner, { tooltip: t(texts$16.uploadingFeedback) }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
-			gap: "x1",
+			gap: "x0.75",
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tooltip, {
 				text: thumbUpTooltip,
-				children: button("positive", layout, thumbUpTooltip)
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+					purpose: "secondary",
+					"aria-label": thumbUpTooltip,
+					onClick: () => handleRatingChange("positive"),
+					size: buttonSize,
+					icon: ThumbUpIcon
+				})
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tooltip, {
 				text: thumbDownTooltip,
-				children: button("negative", layout, thumbDownTooltip)
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+					purpose: "secondary",
+					"aria-label": thumbDownTooltip,
+					onClick: () => handleRatingChange("negative"),
+					size: buttonSize,
+					icon: ThumbDownIcon
+				})
 			})]
 		})]
 	});
@@ -7562,7 +7564,6 @@ const Feedback = ({ layout = "vertical", ratingLabel, positiveFeedbackLabel, neg
 		handleRatingChange
 	});
 	if (!feedbackTextAreaExcluded && !isFeedbackSubmitted) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CommentComponent, {
-		layout,
 		rating,
 		feedbackText,
 		positiveFeedbackLabel: tPositiveFeedbackLabel,
@@ -9138,7 +9139,8 @@ const NewsPopover = ({ id, className, style, htmlProps, header, news, defaultAct
 	}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
 		gap: "x0.75",
 		alignItems: "center",
-		margin: "x0.75 x0.75 x1 x0.75",
+		margin: "x0.75 x0.75 0 x0.75",
+		height: styleUpToBreakpoint("100%", smallScreenBreakpoint, "130px"),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Heading, {
 			level: 3,
 			children: el.heading
@@ -9178,7 +9180,6 @@ const NewsPopover = ({ id, className, style, htmlProps, header, news, defaultAct
 		border: "border-subtle",
 		role: "dialog",
 		"aria-labelledby": headerId,
-		height: isList ? "368px" : "327px",
 		width: styleUpToBreakpoint("100%", smallScreenBreakpoint, "500px"),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(HStack, {
 			margin: "x0.75 x3 x0.75 x0.75",
@@ -9190,14 +9191,13 @@ const NewsPopover = ({ id, className, style, htmlProps, header, news, defaultAct
 			})
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
 			alignItems: "center",
-			height: isList ? "299px" : void 0,
 			"aria-live": "polite",
+			marginBlock: "0 x1.5",
 			children: [
 				content,
 				isList && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 					alignItems: "center",
 					gap: "x1",
-					marginBlock: "auto 0",
 					children: [
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
 							"aria-label": t(commonTexts.previousPage),