@fremtind/jkl-feedback-react
Version:
Jøkul react feedback component
87 lines (86 loc) • 3.52 kB
JavaScript
var __defProp = Object.defineProperty;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
import { PrimaryButton, TertiaryButton } from "@fremtind/jkl-button-react";
import { useAnimatedHeight } from "@fremtind/jkl-react-hooks";
import cn from "classnames";
import React, { useEffect } from "react";
import { useFeedbackContext } from "../feedbackContext";
import { FeedbackSuccess } from "../FeedbackSuccess";
import { AddonQuestion } from "../questions";
import { getQuestionFromType } from "../utils";
import { MainQuestionContextProvider } from "./mainQuestionContext";
import { useMainQuestion } from "./useMainQuestion";
const defaultSuccessMessage = {
title: "Takk for tilbakemeldingen!",
children: "Husk at vi ikke kan besvare meldinger fra dette skjemaet. Kontakt gjerne din forsikringsr\xE5dgiver om du har flere sp\xF8rsm\xE5l."
};
const MainQuestion = ({
label,
options,
type,
addOnQuestion,
successMessage = defaultSuccessMessage,
helpLabel,
onSubmit
}) => {
const mainQuestionState = useMainQuestion(onSubmit);
const { setFeedbackSubmitted, contactSubmitted, landmarkLabel } = useFeedbackContext();
const { handleSubmit, currentValue, setCurrentValue, submitted } = mainQuestionState;
const [submitWrapperRef] = useAnimatedHeight(
currentValue !== void 0
);
useEffect(() => {
setFeedbackSubmitted(submitted);
}, [submitted, setFeedbackSubmitted]);
const MainQuestionComp = getQuestionFromType(type);
return /* @__PURE__ */ React.createElement(React.Fragment, null, !submitted && /* @__PURE__ */ React.createElement(MainQuestionContextProvider, { state: mainQuestionState }, /* @__PURE__ */ React.createElement("form", { onSubmit: handleSubmit, "aria-label": landmarkLabel }, /* @__PURE__ */ React.createElement(
MainQuestionComp,
{
label,
options,
helpLabel
}
), /* @__PURE__ */ React.createElement(
"div",
{
ref: submitWrapperRef,
className: cn({
"jkl-feedback__submit-wrapper": true,
"jkl-feedback__submit-wrapper--hidden": currentValue === void 0
})
},
addOnQuestion && /* @__PURE__ */ React.createElement(
AddonQuestion,
{
helpLabel: typeof addOnQuestion === "object" ? addOnQuestion.helpLabel : void 0,
label: typeof addOnQuestion === "object" ? addOnQuestion.label : void 0
}
),
/* @__PURE__ */ React.createElement("div", { className: "jkl-spacing-xl--top" }, /* @__PURE__ */ React.createElement(PrimaryButton, { className: "jkl-spacing-xl--right" }, "Send"), /* @__PURE__ */ React.createElement(
TertiaryButton,
{
type: "button",
onClick: () => setCurrentValue(void 0)
},
"Avbryt"
))
))), submitted && !contactSubmitted && /* @__PURE__ */ React.createElement(FeedbackSuccess, __spreadValues({}, successMessage)));
};
export {
MainQuestion
};
//# sourceMappingURL=MainQuestion.js.map