https://lanekassen.no/dist/assets/VeilederStegComponent-kjJbWOki.js

1import { c as __toESM, r as require_react, t as require_jsx_runtime } from "./jsx-runtime-d1SSMKUy.js";
2import { o as connect_default } from "./redux-Bu-O7gKu.js";
3import { r as SET_COLLAPSED } from "./Reducers-D9Lc5pnQ.js";
4//#region Features/Shared/Scripts/Store/StegVisning/Actions.ts
5var import_react = /* @__PURE__ */ __toESM(require_react(), 1);
6function setCollapsed(stegVisning) {
7	return {
8		type: SET_COLLAPSED,
9		payload: stegVisning
10	};
11}
12//#endregion
13//#region Features/Shared/Scripts/Components/VeilederStegComponent.tsx
14var import_jsx_runtime = require_jsx_runtime();
15var VeilederStegComponent = class extends import_react.PureComponent {
16	static {
17		this.defaultProps = {
18			neverCollapse: false,
19			customBottomRow: void 0
20		};
21	}
22	constructor(props) {
23		super(props);
24		this.parentDivRef = import_react.createRef();
25		this.headerRowRef = import_react.createRef();
26		this.inputParentDivRef = import_react.createRef();
27		this.handleDocumentOnFocus = (ev) => {
28			const { canCollapse, stegState, stegVisningSetCollapsed, neverCollapse } = this.props;
29			const targetElement = ev.target;
30			const parentDiv = this.parentDivRef.current;
31			if (neverCollapse !== true && canCollapse && stegState.isCollapsed !== true && parentDiv !== null && !parentDiv.contains(targetElement) && parent !== ev.target) stegVisningSetCollapsed({
32				id: stegState.id,
33				isCollapsed: true
34			});
35		};
36		this.handleClick = (e) => {
37			const { stegState, stegVisningSetCollapsed, canCollapse, neverCollapse } = this.props;
38			if (neverCollapse !== true && !stegState.isCollapsed && canCollapse) stegVisningSetCollapsed({
39				id: stegState.id,
40				isCollapsed: true
41			});
42			else if (stegState.isCollapsed) stegVisningSetCollapsed({
43				id: stegState.id,
44				isCollapsed: false
45			});
46		};
47		this.handleClick = this.handleClick.bind(this);
48		this.handleOnKeyUp = this.handleOnKeyUp.bind(this);
49		this.handleDocumentOnFocus = this.handleDocumentOnFocus.bind(this);
50	}
51	componentDidMount() {
52		if (this.props.neverCollapse !== true) document.addEventListener("focusin", this.handleDocumentOnFocus, false);
53	}
54	componentWillUnmount() {
55		if (this.props.neverCollapse !== true) document.removeEventListener("focusin", this.handleDocumentOnFocus, false);
56	}
57	handleOnKeyUp(e) {
58		if (e.key != "Enter") return;
59		const { stegState, stegVisningSetCollapsed } = this.props;
60		if (stegState.isCollapsed && e.target !== this.headerRowRef.current) stegVisningSetCollapsed({
61			id: stegState.id,
62			isCollapsed: false
63		});
64		else if (!stegState.isCollapsed) stegVisningSetCollapsed({
65			id: stegState.id,
66			isCollapsed: true
67		});
68	}
69	render() {
70		const { displayElement, tittel, sporsmalId, forklaring, inputArea, classModifier, canCollapse, customBottomRow, stegState, neverCollapse } = this.props;
71		const isCollapsed = stegState.isCollapsed && canCollapse;
72		const canReCollapse = neverCollapse !== true && !stegState.isCollapsed && canCollapse;
73		return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
74			ref: this.parentDivRef,
75			className: [
76				"c-veileder__panel",
77				isCollapsed ? "c-veileder__panel--collapsed" : "",
78				!isCollapsed && canReCollapse ? "c-veileder__panel--uncollapsed" : "",
79				classModifier ? classModifier : "c-veileder__panel--color"
80			].join(" "),
81			id: sporsmalId,
82			children: [

83				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
84					className: ["c-veileder__panel-row", "c-veileder__panel-row--clickable"].join(" "),
85					onClick: this.handleClick,
86					onKeyUp: this.handleOnKeyUp,
87					role: !canReCollapse && !isCollapsed ? void 0 : "button",
88					tabIndex: !canReCollapse && !isCollapsed ? void 0 : 0,
89					"aria-expanded": !canReCollapse && !isCollapsed ? void 0 : !isCollapsed,
90					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
91						className: "c-veileder__content c-veileder__content--header",
92						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
93							className: "c-veileder__tittel",
94							children: tittel
95						})
96					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
97						className: "c-veileder__content c-veileder__content--header c-veileder__content--indented",
98						children: !stegState.isCollapsed ? null : displayElement
99					})]
100				}),
101				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
102					className: "c-veileder__panel-row",
103					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
104						className: "c-veileder__content c-veileder__content--textarea",
105						children: forklaring
106					}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
107						ref: this.inputParentDivRef,
108						className: "c-veileder__content c-veileder__content--inputarea c-veileder__content--indented",
109						children: inputArea
110					})]
111				}),
112				customBottomRow ?? null
113			]
114		});
115	}
116};
117var VeilederStegComponent_default = connect_default((state, ownProps) => {
118	return { stegState: state.stegVisning[ownProps.sporsmalId] ? state.stegVisning[ownProps.sporsmalId] : {
119		id: ownProps.sporsmalId,
120		isCollapsed: false
121	} };
122}, { stegVisningSetCollapsed: setCollapsed })(VeilederStegComponent);
123//#endregion
124export { setCollapsed as n, VeilederStegComponent_default as t };
125
126//# sourceMappingURL=VeilederStegComponent-kjJbWOki.js.map